palette · dna1In the files
Kitchen-table neutrals: warm paper, near-black ink, clay and sage
Anchored to
Realistic look quality · newNeutral Palettes surface · newFroning: The Fittest Man in History film · new
Translates: Realistic · Neutral Palettes · Familial intimacy
InterpretationRealistic, familial intimacy and neutral palettes become the colours of an ordinary lit room: unbleached paper, warm ink, a clay accent for what was measured and a muted sage for what was guessed. No team or brand colour is used.
#ece4d6#241f1b#9a5a3c#7d8468#c9b79c
Made with css-palette for “Unvarnished, at the kitchen table”: Custom properties on :root hold the five neutrals so every surface draws from them.
Away from the sketch: 4 colours
typography · dna2In the files
Close-up editorial serif over a sturdy grotesque, heavy tabular numerals, and a typed transcript face
Anchored to
Intimate look quality · newBold Typography look quality · new
Translates: Intimate · Bold Typography
InterpretationIntimate becomes a soft, condensed editorial serif for headlines and lead lines, set large and close, with a screenplay typewriter face for the spoken transcript. Bold Typography, carried mostly by brands, is confined to the evidence numerals: Libre Franklin at its heaviest weight with tabular figures.
Ask an agent who an audience is, and it answers from its own idea.
Instrument Serif
Ask an agent who an audience is, and it answers from its own idea.
Libre Franklin
Ask an agent who an audience is, and it answers from its own idea.
Courier Prime
font-variant-numeric: tabular-numsfont-weight: 900
Made with library-font for “Hauntingly intimate”: Instrument Serif, Libre Franklin and Courier Prime are fetched locally and set through font custom properties; numerals get tabular, heavy settings.
Away from the sketch: 3 type families
imagery · dna4In the files
The blind-spot field: 714 plain dots, 22 filled in clay
Anchored to
Clean surface · newNeutral Palettes surface · new
Translates: Clean · Neutral Palettes
InterpretationClean, neutral surfaces become an original line drawing with no ornament: a field of 714 outlined dots on paper (34 by 21), of which only the 22 the guesses named are filled. The filled dots settle in one by one as the signature moment.
#blind-spot-figuresvg#blind-spot
Made with inline-svg for “Unvarnished, at the kitchen table”: A pattern of 714 outlined dots with 22 filled circles drawn inline, clean and resolution-free.
Away from the sketch: 1 new part
motion · dna3In the files
Slow rack focus: sections come into focus from a soft blur
Anchored to
Hauntingly Intimate pacing · newJeremih music · new
Translates: Hauntingly Intimate · Melodic
InterpretationHauntingly intimate, melodic pacing becomes a slow pull-focus: each section enters from a slight blur and drift, with no bounce, the way a close-up resolves.
@keyframes rack-focusanimation: rack-focus 1.4s cubic-bezier(.2,.7,.2,1) both
Made with css-motion for “Hauntingly intimate”: A keyframed blur-to-focus entrance triggered by an IntersectionObserver class, with a reduced-motion fallback.
voice · dna8In the files
Candid, reflective interview voice
Anchored to
Family Tree TV · newEmotional mood quality · newDetermination tone · new
Translates: Reflective · Emotional · Determination
InterpretationReflective, emotional and determined tone becomes plain sentences that admit the limit before the claim, short and spoken, never a pitch.
Ask an agent who an audience is, and it answers from its own idea.
Guess first. Then measure. Then design from the difference.
Turn each card to see what it does not show.
Made with copy for “Reflective, with the limits said aloud”: The narrative lines are written in the candid register around the fixed facts.
layout · dna7In the files
Contact-sheet frames for the five steps
Anchored to
Camping TV · newCurious meaning quality · new
Translates: Unvarnished close ups · Observational
InterpretationUnvarnished, observational close-ups become the five steps laid out as a strip of portrait frames with frame numbers in the margin, read left to right like a contact sheet.
#contact-sheetaspect-ratio: 4 / 5
Made with css-layout for “Observational frames”: A five-column grid of 4:5 frames that becomes a horizontal scroll strip on mobile.
Away from the sketch: 1 new part
structure · dna5In the files
The problem told as an interview transcript
Anchored to
A Kid from Coney Island film · newReflective meaning quality · new
Translates: Interview centric · Reflective
InterpretationInterview-centric, reflective storytelling becomes a section laid out as a typed transcript: a question in the margin, the plain answer beside it.
#transcript
Made with css-layout for “Reflective, with the limits said aloud”: A two-column grid of margin questions and typed answers carries the transcript.
Away from the sketch: 1 new part
interaction · dna6In the files
Stage and backstage: each piece of evidence turns to show what it does not show
Anchored to
I'll Sleep When I'm Dead film · newComplex mood quality · new
Translates: Stage backstage juxtaposition · Complex
InterpretationStage/backstage juxtaposition and complexity become evidence cards with a front (the finding) and a back (its stated limit); a button turns each card, so the limit is one press away, never hidden in small print.
#backstagetransition: transform .7s cubic-bezier(.2,.7,.2,1)
Made with interaction-script for “Reflective, with the limits said aloud”: A small script toggles aria-pressed and a turned class on each evidence card; CSS rotates it.
Away from the sketch: 1 new part
