Futbol Friend.

A team finder for local pickup soccer · product design and solo build · in active development

Pickup players and standing teams have the same problem from opposite sides. Both need one more player. Neither wants to join a formal league.

The Futbol Friend home page. A large headline reads “Make room for your next game”, next to an illustration of a player kicking a ball.
The home page states the problem. Open teams already set a time, and they need one more player.

Two ways in

The product has two paths, and it keeps them separate. You can join a single run and play that day. You can also build a standing team and fill the last few spots.

A section headed “Three ways in. One team out.” with three bordered cards: find an open run, show up and play, or build a team.
Three ways in: join an open run, play that day, or build a team.

The player path

This is the most important decision in the product. Most pickup tools treat two different things as one state. The first is “I am interested in your team”. The second is “I am confirmed for this Sunday”. Futbol Friend keeps them separate. Interest in a team never adds you to the roster. A place on the roster never confirms you for a match.

The interface states this directly:

“Waiting for the team leader. If they invite you to a run, it will show up under Matches for a separate yes or no.”

A dialog for Downtown Orlando FC listing the positions needed, how often the team plays, the roster count, and a button in the “Interest sent” state.
Interest, roster, and RSVP are three separate states. This is deliberate.

The leader path

This is the other half of the same idea. Team setup asks three questions and nothing more: the name, how often you play, and which positions you need. People do not finish a longer form.

A three-step team setup screen. Step one asks for a team name. Steps two and three ask how often the team plays and which positions it needs.
Name, frequency, positions. Three questions create the team.

The leader’s dashboard then enforces the order. A run needs a court and a time before the leader can invite anyone. Roster membership stays separate from each RSVP.

The Team HQ dashboard for Sunday Side FC, showing the home city, how often they play, and three cards for team profile, first run, and run invites.
The leader manages the roster and the runs as two separate jobs. You cannot invite players to a run that does not exist.

Designing with AI

I build Futbol Friend alone. Claude Code does much of the building. The decisions are written down before any code exists.

Claude Code reads three files before it touches a screen: the product rules, the locked visual system, and the design handoff. Palette, type, shape and spacing are already fixed, so exploration happens inside them.

The two-track model was the hardest call. I worked through the options with Claude and listed the trade-offs for each one. Once I picked the separation, I wrote it into the rules file so it would not be re-decided later:

“Two-track roster. Per-match accept/decline confirmation is a separate track from standing roster membership. Never collapse them into one state.”

Output gets reviewed, not accepted. The first team-creation flow was convoluted. It used a vertical progress rail and repeated the team identity row on every step. It never made clear where team creation ended and match scheduling began. I cut it to three numbered steps on one horizontal marker.

I keep a running list of problems found in review so they do not come back. Pale borderless controls that do not look interactive. A filter label reading “Lights” when it means “Lit after dark”.

The exploration folder shows the shape of the work. Six directions, then thirty refined variants before one was chosen. Every one was coded and responsive, because the handoff does not accept image mockups. That is what changed: not the decisions, but how many I can test before committing to one.

Where it stands

The app is in active development. I build it alone. It is not shipped yet. The lists below describe the app today, not the plan.

Working today

  • Home and how-it-works
  • Team discovery and the interest flow
  • Team creation wizard
  • Team HQ dashboard for leaders
  • Email OTP authentication

Next

  • Player-side Matches screen: accept or decline a run invite
  • Run planning: court, exact time, invitations
  • Promoting an interested player onto the roster
  • Notifications when a run is set

Built with Next.js 16, React 19, Supabase, and Tailwind v4. The palette is “Eclipse Field”: deep navy and pale paper. The typefaces are Bodoni Moda, Fraunces, DM Mono, and Inter.