palette · dna1In the files
Floodlit night-game palette: navy sky, deep pitch green, floodlight white, score-bug red, club-neon pink and wristband teal
Anchored to
big live-event energy quality · own predictionstadium lights surface · own predictionneon marquee surface · own prediction
Translates: big live-event energy
Through the convention: stadium night: floodlight towers throwing white cones onto a deep green pitch under a navy sky
InterpretationBig live-event energy is drawn the way a night broadcast draws it: a navy sky and a deep green pitch lit by hard white floodlight cones, with the score bug's red tab as the one hot accent of the broadcast, and the comedy club's pink neon and arena wristband teal saved for the segments that belong to them. No team or club colours: the blues are night, not a kit.
#13204a#1f7a3f#f6f8ff#e8343c#ff3d9a#39e6c3
Made with source for “Under the lights”: The palette lives in one PALETTE object in the game script and the page's custom properties, so every canvas draw call takes its colours from it.
Away from the sketch: 3 colours
typography · dna2In the files
Score-bug capitals with club-neon signage
Anchored to
big live-event energy quality · own predictionbroadcast sports graphics art style · own predictionbanter and roasting quality · own prediction
Translates: big live-event energy · banter and roasting
Through the convention: broadcast score bugs: boxed condensed capitals on a dark bar, a coloured tab per side
InterpretationThe broadcast speaks in boxed, condensed capitals on a dark bar (Anton for the bug and the big numbers, Barlow Condensed for stat lines and instructions); the comedy segment's sign and the roast lines switch to Bungee, the urban signage face a neon tube would trace.
Nobody booked you. So you booked the whole night.
Anton
Nobody booked you. So you booked the whole night.
Barlow Condensed
Nobody booked you. So you booked the whole night.
Bungee
Made with library-font for “Under the lights”: Anton, Barlow Condensed and Bungee are fetched into fonts/ and loaded locally with @font-face, then the canvas draws text in them once document.fonts is ready.
Away from the sketch: 2 type families
imagery · dna10In the files
Flat-vector floodlit arena with a living crowd
Anchored to
stadium lights surface · own predictionbold poster art style · own predictionjumbotron scoreboards surface · own prediction
Translates: stadium lights · bold poster
InterpretationThe stage is drawn as flat vector shapes, poster-bold: four floodlight towers throwing white cones, tiered stands of crowd dots that rise in a wave with the hype, and a jumbotron frame that shows each segment's result in big capitals.
#floodlight-tower#jumbotronfunction drawFloodlights(
Made with source for “Under the lights”: The arena is drawn on the canvas in flat vector shapes: floodlight towers, cones, stands of crowd dots and a jumbotron frame.
Away from the sketch: 2 new parts
motion · dna8In the files
Highlight-reel stingers and a marquee bulb chase
Anchored to
highlight-reel editing pacing · own predictionfast-paced pacing · own predictionhype tone · own prediction
Translates: highlight-reel editing · fast-paced
InterpretationEvery big moment cuts like a highlight package: a fast diagonal stinger wipe between segments, a short screen punch on a home run or a killer line, and the bulbs on the marquee frame around the screen chasing in two steps; the chase stops when the game is paused or motion is reduced.
@keyframes bulb-chaseanimation: bulb-chase 0.6s steps(2) infiniteSTINGER_MS = 420
Made with source for “Encore”: The stinger wipe and screen punch are canvas timings; the bulb chase is a CSS keyframe on the marquee frame around the canvas, paused with the game and under reduced motion.
voice · dna9In the files
Hype-man play-by-play with a porch-roast edge
Anchored to
banter and roasting quality · own predictionFriday film · own predictionhype tone · own prediction
Translates: banter and roasting · irreverent
InterpretationThe announcer talks like a friend on the front porch who also has the stadium mic: confident, teasing, never cruel, short lines that land on the beat. It hypes the underdog and roasts the flops in the same breath.
Nobody booked you. So you booked the whole night.
Doors at seven. No refunds on nerve.
Press R to run it back.
Made with copy for “Roast on the mic”: The announcer lines are written into the script's copy table and drawn on the title, intro cards and box score.
structure · dna3In the files
Run of show: four segments, one hype meter, one box score
Anchored to
underdog hustle quality · own predictionbig live-event energy quality · own predictionteam loyalty quality · own prediction
Translates: underdog hustle · team loyalty
InterpretationThe game progresses like a broadcast night's rundown: a cold open, four timed segments each with its own intro card, a persistent crowd Hype meter that starts low (the underdog has to win the room) and drains if you coast, and a final box score that rates the night and offers a rerun. The crowd in the stands is your side: its wave height is the hype.
#run-of-show#seg-at-bat#seg-roast#seg-pitch-room#seg-encore#box-score
Made with source for “Hustle in the pitch room”: The run of show is a data array of segment ids that the state machine walks, with the hype meter and box score held in one state object.
Away from the sketch: 6 new parts
interaction · dna4In the files
At-bat: read the pitch location, then time the swing
Anchored to
MLB The Show 24 game · own predictionjumbotron scoreboards surface · own prediction
Translates: big live-event energy
InterpretationThe ballpark segment plays like a console at-bat reduced to its nerve: a pitch is cued high, middle or low, the player holds UP or DOWN to set the swing plane and presses SPACE as the ball crosses the zone; timing grades single, double or home run, and the jumbotron flashes the result.
#strike-zoneSWING_WINDOW = 0.11
Made with source for “Under the lights”: The at-bat is a canvas segment with its own update and draw functions and a timing window constant.
Away from the sketch: 1 new part
interaction · dna5In the files
Crowd work: pick the comeback, then land it on the beat
Anchored to
banter and roasting quality · own predictionpunchline rhythm pacing · own predictionDef Comedy Jam TV · own prediction
Translates: banter and roasting · punchline rhythm
InterpretationA heckle comes from the dark; the player picks one of three comebacks with 1, 2 or 3 and then lands it with SPACE when the beat marker crosses the laugh window. The best line delivered late still dies: the room rewards timing as much as words.
#roast-beat-barLAUGH_WINDOW = 0.14
Made with source for “Roast on the mic”: The roast is a canvas segment: a heckle list, three comeback choices and a sweeping beat bar with a laugh window constant.
Away from the sketch: 1 new part
interaction · dna6In the files
Pitch room: counter, accept or walk while the investor's patience burns
Anchored to
underdog hustle quality · own predictionShark Tank TV · own predictionMoneyball film · own prediction
Translates: underdog hustle · competitive
InterpretationThree fictional investors make offers for a cut of the night. The player moves a counter with UP and DOWN, sends it with SPACE, takes the deal with A or walks with W. Each investor has a hidden floor and a patience bar; reading the interest gauge like a stat sheet is how the underdog wins.
#deal-boardPATIENCE_START = 3
Made with source for “Hustle in the pitch room”: The pitch room is a canvas segment with three investor records, hidden floors and patience counters.
Away from the sketch: 1 new part
interaction · dna7In the files
Encore: hit the light cues in four wristband lanes
Anchored to
crowd-pleasing pacing · own predictionColdplay music · own predictionBeyoncé music · own prediction
Translates: crowd-pleasing · celebratory
InterpretationThe finale is the arena light show: cues fall down four lanes coloured like wristband fields, the arrow keys fire them on the hit line, and each hit lights a section of the stands; combos multiply hype.
#light-cue-lanesENCORE_BPM = 120
Made with source for “Encore”: The encore is a canvas rhythm segment driven by a BPM constant and a generated cue chart in four lanes.
Away from the sketch: 1 new part