palette · dna1In the files
Low-poly dusk over a dark tidal marsh, oxblood curtains at the edge
Anchored to
melancholic mood quality · predictedartistic look quality · newLow-poly art style · new
Translates: melancholic · artistic · Low-poly
Through the convention: low-poly dusk landscapes: flat-shaded facets in bands of sunset colour with dark silhouetted foregrounds
InterpretationMelancholic becomes the last orange of a dusk sky over dark teal water; artistic and Low-poly become flat-shaded facets in a few hard colour bands, with olive reeds silhouetted in front, the way low-poly dusk landscapes draw it. The oxblood of a theatre curtain frames it; a sodium-yellow spotlight is the only bright light.
#16383a#2b6b62#e8722a#f5c542#6e1423#7d8a3a
Made with source for “Melancholic, tense small-town games”: The palette lives as hex constants in the game script's PAL object and the page's CSS custom properties, drawn in flat facets on the canvas.
Away from the sketch: 6 colours
typography · dna2In the files
Playbill fat face over a typewritten script
Anchored to
Theatrical look quality · newTalking Heads music · new
Translates: Theatrical · New Wave
Through the convention: school-play and repertory playbills: a fat-face title over a typeset cast list, acts announced on a card
InterpretationTheatrical becomes the type of a repertory playbill: a heavy fat-face display for the title, act cards and cast list, and the dialogue set like a typed play script with speaker names before each line.
The tide is coming in. The band is not.
Rozha One
The tide is coming in. The band is not.
Cutive Mono
Made with library-font for “Theatrical art-rock stage”: Rozha One and Cutive Mono are fetched into fonts/ and loaded with @font-face, then used by both the page and canvas text.
Away from the sketch: 2 type families
imagery · dna8In the files
Faceted marsh set pieces and a tailored stage manager
Anchored to
Low-poly art style · newModern Tailoring surface · new
Translates: Low-poly · Modern Tailoring
InterpretationLow-poly becomes every set piece drawn as flat-shaded triangles on the canvas: dunes, reeds, the pier, the houseboat. Modern Tailoring becomes the cast: figures as narrow tailored silhouettes in suits, cut from a few polygons.
function drawFacetMarshfunction drawTailoredFigure
Made with source for “Melancholic, tense small-town games”: Every set piece and figure is drawn from polygons by canvas functions, no image files.
motion · dna3In the files
Hard curtain sweep between scenes, beat-locked lights
Anchored to
Rhythmically Charged pacing · newStylized pacing · new
Translates: Rhythmically Charged · Stylized
Through the convention: curtain-and-spotlight scene changes of stage musicals and concert films: the cut is a hard sweep, not a dissolve
InterpretationRhythmically Charged and Stylized pacing replace the soft fade I predicted: every scene change is a fast, hard curtain sweep from both wings, and lamps, the spotlight and the tide clock pulse on one shared beat.
transition: transform 650ms cubic-bezier(.77,0,.18,1)const BEAT_MS = 480
Made with source for “Theatrical art-rock stage”: Two DOM curtain panels over the canvas sweep with a CSS transform transition at every scene change; the canvas lights pulse on BEAT_MS.
voice · dna9In the files
Deadpan lines, a pause, then the true thing
Anchored to
Her film · newSubmarine film · newIntimate look quality · new
Translates: Thought provoking · Deadpan whimsicality · Intimate
InterpretationDeadpan whimsicality and Intimate become short flat lines in the play script, then a sudden sincere one; Thought provoking becomes the singer's questions, which have an honest answer and an easy one.
The tide is coming in. The band is not.
I kept the setlist. I don't know why. Yes, I do.
Nobody tunes out a person. You just lose the frequency.
Made with copy for “Loyal friends, drama and grief”: The lines are written into the dialogue data of the script and the page.
layout · dna7In the files
Dress the stage in mirror symmetry
Anchored to
Theatrical look quality · newRushmore film · new
Translates: Theatrical · Resourceful
Through the convention: art-rock concert stagings: bare boards, one hard white spotlight, a band in tailored suits
InterpretationTheatrical and Resourceful become a staging puzzle: on a bare stage grid the player places lamps, amps and a ladder so that each prop has its mirror twin across the centre line, the self-serious care of a school play mounted like an opera.
#stage-gridfunction checkSymmetry
Made with source for “Theatrical art-rock stage”: The stage dressing puzzle is a grid scene in the script with a symmetry check.
Away from the sketch: 1 new part
structure · dna6In the files
Get the band back before high tide
Anchored to
Drama loving meaning quality · newLoyal meaning quality · newSomebody Somewhere TV · new
Translates: Drama loving · Loyal · Friendship and community
Through the convention: ensemble reunion stories: one by one the old friends are brought back for one last night
InterpretationDrama loving and Loyal become the shape of the play: a tide clock runs from low to high water, each member won back is a loyalty restored, and the final show in the pier hall plays out with exactly who came, so the ending differs.
#tide-clock#final-show
Made with source for “Loyal friends, drama and grief”: The tide clock and the final show are the game's state machine; the tide clock is a DOM meter beside the canvas.
Away from the sketch: 2 new parts
interaction · dna4In the files
Radio dial tuned through static
Anchored to
Oxenfree game · newtense mood quality · newMysterious tone · new
Translates: tense · Stylized · Mysterious
Through the convention: radio-static tuning puzzles: a dial, a needle and voices rising out of the noise
InterpretationTense and Mysterious become a tuning puzzle: the player sweeps a needle along a dial while static hisses, finds a voice by its strength meter, and must hold it steady against drift until the keyboardist's broadcast is clear.
#radio-dialfunction tuneRadio
Made with source for “Melancholic, tense small-town games”: The radio tuning scene is a canvas mini-game in the script, with its dial drawn as the radio-dial scene element.
Away from the sketch: 1 new part
interaction · dna5In the files
Boathouse rehearsal in three falling lanes
Anchored to
Night in the Woods game · predictedRhythmically Charged pacing · new
Translates: melancholic · Rhythmically Charged
Through the convention: small-town band-practice rhythm sequences: notes falling down lanes to a cheap drum loop
InterpretationBand practice from the small-town games this audience loves, made rhythmically charged: notes fall down three lanes to a synthesised drum loop, and the guitarist only comes back if the player keeps time.
#rhythm-lanefunction playRehearsal
Made with source for “Melancholic, tense small-town games”: The rehearsal is a canvas rhythm game in the script with WebAudio clicks, its lanes drawn as rhythm-lane.
Away from the sketch: 1 new part