Skip to content

ben4mn/sprite-dex

Repository files navigation

✨ Sprite-dex

Gotta catch 'em all — Fortnite edition.

A Pokédex-style PWA for your Fortnite Sprites collection, with an AI camera scan that reads your in-game collection screen and fills in your dex for you.

🌐 Landing page · 🚀 Quick start · 🧠 How the AI scan works

PWA Offline No account needed Sprites


🐛 The problem

Fortnite's Chapter 7 Sprites are the closest thing the game has to Pokémon — 16 collectible companions (and counting), some with drop rates below 0.0001%. But there's no way to track your collection outside the game, and no API exposes it: we verified that Epic's official APIs share zero inventory data with third parties, and Sprites don't exist in the unofficial endpoints either. Every other tracker is a plain manual checklist.

💡 The fix

Sprite-dex gives you a real Pokédex — and replaces "account sync" with something better:

📷 AI Vision Scan Screenshot your in-game collection screen (or just photograph your TV — console players welcome). Claude's vision model reads which sprites are unlocked vs. silhouetted and fills your dex. You review every detection before it saves.
📖 A proper dex Silhouettes and ??? for the uncaught. Dex numbers, rarities, drop info, catch dates, notes, favorites. Search and filters.
🏅 Progress & medals Completion ring, per-wave progress bars, medals at 100%.
📱 Real PWA Install it on your home screen. Everything except scanning works fully offline — mark catches mid-match.
🔗 No accounts, ever Your dex lives on your device. Back it up or move it with a share link. Show off your completion with the same link.

🚀 Run it

npm install
npm run dev                 # frontend at :5173

Scanning needs an Anthropic API key and the local functions runtime:

export ANTHROPIC_API_KEY=sk-ant-...     # platform.claude.com
npm run build
npx wrangler pages dev dist             # app + /api/scan on :8788
node scripts/test-scan.mjs shot.jpg     # CLI smoke test

☁️ Deploy (Cloudflare Pages)

  1. Create a Pages project from this repo — build npm run build, output dist.
  2. Add ANTHROPIC_API_KEY under Settings → Environment variables.
  3. functions/api/scan.ts deploys automatically as the scan endpoint.

A scan costs roughly 1–3¢ of API usage (images are downscaled on-device to ≤1568px first). Before going public, put Cloudflare Turnstile or a rate limit in front of /api/scan — it spends your credits.

🧠 The AI Vision Scan

your screenshot ──▶ downscaled in your browser (never stored)
                ──▶ Cloudflare Pages Function
                ──▶ Claude Opus 4.8 (vision + guaranteed-JSON structured output)
                ──▶ { collected, uncollected, uncertain }
                ──▶ review screen — you confirm before anything is written

The model gets the full sprite roster and classifies every visible card: full color → collected, dark silhouette → not yet, ambiguous (TV glare, angles) → flagged uncertain for you to decide.

🗃️ Updating the roster

New season, new sprites? Edit one file — src/data/sprites.json — and drop the icon into public/sprites/. The dex and the scanner both read from it.

⚖️ Disclaimer

Sprite-dex is a fan-made tracker. It is not affiliated with, endorsed, sponsored, or approved by Epic Games. Fortnite is a trademark of Epic Games, Inc. Uploaded images are processed transiently for scanning and never stored.

About

A Pokédex for your Fortnite Sprites collection — PWA with AI vision scan. Not affiliated with Epic Games.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors