One Team Face Off

Why I built it#

When a new Athletic Director walks into a Division I department, they're responsible for hundreds of athletes across 18 sports, plus the coaches, trainers, administrators, and support staff who make it all run. That's a lot of names and faces to learn, and getting them wrong in a hallway or a locker room is the kind of thing that erodes trust fast.

One Team Face Off was built for exactly that problem. The "JC" is John Cunningham, UC's Athletic Director. The app is a name-learning game that turns rote memorization into something quick, repeatable, and even fun - so the AD can walk into a room and know who's in it.

What it does#

The core loop is simple: a face appears, you pick or type the name, and the game tells you if you're right. Streaks build, the clock ticks, and the faces you miss come back at the end so you actually learn them instead of just forgetting.

Four quiz modes keep it from getting stale:

• Faces quiz - see a photo, pick the right name
• Names quiz - see a name, pick the right photo
• Details quiz - answer questions about position, jersey number, height, hometown, and more
• Find player - a reverse lookup mode that tests recall from a different angle

Each mode has four difficulty levels - beginner, intermediate, advanced, and expert - that control how many options you see and which sports are in the pool. Groups let you focus on a specific sport or roster, so you can learn football first and work your way through the department.

Challenge the AD#

The one-vs-one face-off mode is where it gets competitive. You go head-to-head against JC in real time, answering the same questions, and the scoreboard tracks who's getting more right. Streak bonuses reward consistency, and the results feed into the leaderboard so the whole department can see who knows their people.

Gamification#

The app is built around a full gamification system: XP, levels, daily and weekly challenges, and badges across nine categories - learning, accuracy, streaks, exploration, social, dedication, mastery, speed, and special. A spaced repetition system (SRS) tracks each person's mastery level from "new" to "mastered" using a scientifically-proven algorithm, so the app knows which faces to surface and when. Study mode uses the SRS data to focus on the people you keep getting wrong, so your practice time is spent where it matters.

How it was built#

Built with React, TypeScript, and Vite, with Supabase handling the backend - PostgreSQL for roster data, authentication for user accounts, and Storage for player photos. The UI uses shadcn/ui and Tailwind CSS, and the whole thing is a progressive web app with offline support, home-screen install, and splash screens on iOS. The theme matches UC's brand: red and black, Bearcats identity.

The roster data lives in Supabase with full CRUD through an admin dashboard, so the face pool stays current as athletes join, transfer, or graduate. An audit log tracks every change, and analytics track quiz performance so you can see where the gaps are.

Where it stands#

Live at faces.gobearcats.ai. The quiz modes, admin dashboard, leaderboards, gamification system, and study mode are all working. The next step is expanding the roster to cover every sport and staff member in the department and adding social sharing so other leaders in the department can learn their teams too.