Skip to main content
·Brock

Designing the Tournament Creation Flow (It's Harder Than You Think)

Tournament creation has dozens of variables. Getting the UX right so organizers don't feel overwhelmed has been one of the biggest design challenges on GotNext.

designtournamentsfrontend

I've been working on the tournament creation flow for a while now, and I keep going back to it. It's one of those features where the backend is relatively straightforward, but the UX is genuinely hard to get right.

The problem is simple to state: tournaments have a lot of variables. And every single one of them needs to be configured by the organizer before the tournament goes live.

The Variables

Here's a partial list of what an organizer needs to set when creating a tournament:

  • Tournament name and description
  • Game and platform
  • Format (single elimination, double elimination)
  • Team size (1v1, 2v2, 3v3, 4v4, 5v5)
  • Max number of teams or players
  • Registration open and close dates
  • Check-in window duration
  • Tournament start time
  • Rules and match settings
  • Prize pool (per-placement prizes, which can be cash, physical items, or anything else)
  • Visibility (public or unlisted)
  • Sponsor logos
  • Organizer branding and accent color
  • Discord webhook URL for notifications

That's a lot. And every field matters. If you get the team size wrong, players can't register properly. If you get the check-in window wrong, half your bracket is empty when the tournament starts. If you forget to set the Discord webhook, your community doesn't get notified.

The First Attempt: One Long Form

My first attempt was a single-page form with all the fields laid out top to bottom. It worked, technically. But watching organizers try to use it (thanks PostHog session recordings) was painful. They'd scroll up and down, miss fields, get confused about which settings were required vs optional, and sometimes just abandon the form entirely.

The cognitive load was too high. When you present someone with 15+ fields at once, their brain checks out.

The Wizard Approach

I rebuilt the creation flow as a multi-step wizard. Each step focuses on one category of settings:

  1. Basics: Name, description, game, platform
  2. Format: Elimination type, team size, max teams
  3. Schedule: Registration dates, check-in window, start time
  4. Rules: Match settings, rule text
  5. Customization: Prize pool, sponsor logos, branding, accent color
  6. Review: Summary of everything before publishing

Each step shows only the fields relevant to that category. Required fields are clearly marked. Optional fields are present but don't demand attention. The organizer can move forward and backward through the steps, and there's a review page at the end so they can double-check everything.

The Tricky Parts

Even with the wizard approach, there are UX challenges that took multiple iterations:

Conditional fields. Some fields only matter depending on other choices. If it's a 1v1 tournament, you don't need team-related settings. If there's no prize pool, you don't need prize placement fields. Showing and hiding fields based on earlier selections without making the form feel jumpy took some work.

Prize pool entry. This was surprisingly hard to design. Organizers need to add prizes per placement (1st, 2nd, 3rd, etc.), and the prizes can be anything: "$300", "Gaming Headset", "Gift Card". I ended up with a dynamic list where you add rows, set the placement and prize text, and reorder if needed. Getting this to feel intuitive on both desktop and mobile took three or four iterations.

Date and time selection. Tournaments involve multiple time-related fields: when registration opens, when it closes, when check-in starts, and when the tournament itself begins. These all need to be in the right order (you can't have check-in start before registration closes), and the time zone handling needs to be clear. I've seen organizers accidentally schedule tournaments in the wrong time zone because the picker wasn't explicit enough.

Validation across steps. In a wizard, you can't just validate on submit. Each step needs its own validation so the organizer knows immediately if something is wrong, but you also need cross-step validation (like making sure the start time is after the registration close time). Balancing immediate feedback with not being annoying about it is a real design challenge.

What I Landed On

The current flow isn't perfect, but it's dramatically better than the single-page form. Organizers can create a tournament in a few minutes without feeling overwhelmed. The wizard guides them through the process, and the review step catches anything they missed.

I'm still watching session recordings of organizers going through the flow and tweaking based on where they hesitate or make mistakes. This is one of those features that will probably never be "done" because there's always a way to make it clearer.

If you're building any kind of multi-step creation flow, my advice: start with the wizard pattern from day one. Don't try to be clever with a single-page form. The wizard might feel like more work upfront, but it pays for itself immediately in usability.

    Designing the Tournament Creation Flow (It's Harder Than You Think) | GotNext.gg