Tournament bracket: the draw, the times and a path to the final

A single-elimination draw with match times and tables, sent to the players before a small tournament.

Live example

The example: The Winter Cup at Sailcloth Mill

Eight pairs, two tables, one Friday afternoon

The Winter Cup at Sailcloth Mill

Open the exampleThe names and numbers are made up.

What to notice

  • All seven matches carry a time and a table, so match 3 reads 3:25 pm, Table 1 without a separate schedule to open.
  • Tap Night Shift in match 1 and they appear in match 5. Pick Front Desk instead and anything you'd chosen further along for Night Shift clears.
  • The opening paragraph says in bold that taps stay on your own screen, then names Ines as the one who republishes the page after each round.

The prompt that starts one like it

Make a single-elimination tournament bracket as one HTML page for [event, date and place]. The [eight] teams are [team names and players], paired as [the draw, or draw them at random]. Show a time and a table on every match, with lines joining the rounds. Clicking a team moves it to the next round, and the champion shows at the end. Add a reset button and our house rules, say that clicks stay on each person's own screen, and stack the rounds on a phone. Then publish it on sharable.link.

A bracket answers two questions for every player: who am I playing, and when. This draw, for eight pairs at an office table-tennis afternoon, can be clicked through to a champion. A page can't gather scores from players' phones, so somebody keeps the real results, and the page should say who.

Who it's for

The organizer, usually the person who suggested the tournament out loud. Table tennis at work, five-a-side in the park, a chess club knockout. Send it a few days ahead, once the draw is done, so people know their first match and who they'd meet next.

It suits four to sixteen entrants in a straight knockout. A league or a round robin reads better as a table of fixtures. If every player must enter their own score, use a tournament app.

What a good one contains

  • The whole draw on one screen. Eight pairs, seven matches and three rounds, joined by lines. People trace their route to the final before they read a word.
  • A time and a table on every match. Later rounds get a slot too, so a semi-finalist knows to be at the loading bay at 4:00 pm.
  • Players beside the team names. "Front Desk" is the funnier label, but Agnes and Paulo are who the opponents go looking for.
  • Empty slots that say what they're waiting for. A semi-final reads "Winner of match 1" until that match is picked.
  • One tap to advance, one more to undo. Changing an early result clears the later picks that relied on it, so no pair shows in a final they didn't reach.
  • A champion box. It reads "To be decided" until the final is picked, then turns red with the winners' names.
  • House rules in four lines. Best of three, first to 11, losers umpire the next match. Writing it down saves an argument at 3:05.

One official copy

Each person's taps stay on their own screen, and a reload clears them. Decide before the day who keeps the true bracket. The simple way is you, on a laptop beside the table, calling results out.

If people will follow from their desks, put the results into the page between rounds. Say in the conversation where you made the page that Night Shift won match 1 and Accounts won match 2, then publish again to the same link. Anyone who reloads sees the bracket as it stands.

Leave more time between rounds than you think you need. The sample allows 25 minutes for a best-of-three, and 40 from the semi-finals to the final. Once a 4:00 semi-final starts at 4:20, nobody trusts the times on the page.

How to send it

As an open link. Players pass it to their partners and to whoever is coming to watch. A draw has nothing private on it, and nobody wants to type a password beside the table.

Every page you publish gets one link that opens in any browser. You choose who can open it: anyone with the link, anyone with the password, or only the people and company domains you name, who sign in with Google or Microsoft. Change the page later and the link stays the same.

Make yours in Claude

Add the connector once, then publish from any Claude conversation and get a link to send.

Add Claude Connector

Already have the file? Upload it here.

More in games and fun

  • Trivia game: A quiz night on one page: questions, answers the host reveals, and a scoreboard for the teams.
  • Bingo cards: Themed bingo from one link: each person gets their own shuffled card and taps squares as they go.
  • Spin the wheel: A wheel with your own entries that picks one at random, for settling who goes first or who pays.
  • Bill splitter: Shared expenses, who paid and who was in on each, worked down to a short list of payments.
  • Browser game: A small original game on one page, made for a friend, a class or a team to play from a link.
  • All use cases

Keep reading