palette · dna1In the files
Last-call sleeve duotone: cocoa ground, copper light, dusty rose and olive, with no black and no gold
Anchored to
Neo Soul look quality · newWarm look quality · predicted
Translates: Neo Soul · Warm
Through the convention: neo-soul album sleeves: warm earth-toned duotone in cocoa, copper and dusty rose, soft and low-lit
InterpretationNeo-soul sleeves print warm portraits in an earth duotone. The page ground is cocoa, the light is copper, text is warm rose-cream, and olive and rose carry the secondary panels. My interpretation, not Qloo's colours.
#2e1b14#c9652e#e9a99a#7f8a5a#f4dcc6
Made with css-palette for “Quiet-storm sleeve”: Custom properties carry the duotone through every section.
Away from the sketch: 3 colours
typography · dna2In the files
Lowercase sleeve title: Prata set lowercase and wide-tracked for the name and headings, Alegreya Sans for reading, Caveat for the scrawled asides
Anchored to
Soulful mood quality · newSmooth mood quality · new
Translates: Soulful · Smooth
Through the convention: late-90s R&B sleeve titles: a high-contrast serif set lowercase, wide-tracked, floating in empty space
InterpretationThe late-90s R&B sleeve title floats a high-contrast serif in lowercase with air around it, which reads soulful and smooth. A calligraphic humanist sans keeps the facts warm. The handwriting belongs to the trickster's interruptions.
The second one is when the night starts.
Prata
The second one is when the night starts.
Alegreya Sans
The second one is when the night starts.
Caveat
text-transform: lowercaseletter-spacing: 0.08em
Made with library-font for “Quiet-storm sleeve”: Prata, Alegreya Sans and Caveat come from the library, set lowercase and tracked in CSS.
Away from the sketch: 3 type families
imagery · dna5In the files
Flowing-silhouette record: an inline SVG LP with grooves, a copper label and a microphone drawn in one curving line
Anchored to
Flowing Silhouettes surface · newNeo Soul look quality · new
Translates: Flowing Silhouettes · Neo Soul
InterpretationA drawn record in flowing curves stands for the soul sleeve without any work's artwork; the microphone in one continuous line ties it to stand-up.
svg#record-art
Made with inline-svg for “Quiet-storm sleeve”: No picture generator: an inline SVG record with grooves and a one-line microphone.
motion · dna6In the files
Slow turntable: the record turns at a lazy pace, with a pause button and a reduced-motion stop
Anchored to
Smooth mood quality · newSoulful mood quality · new
Translates: Smooth · Soulful
InterpretationNo pacing tags came back, so the motion follows the Smooth mood: one slow continuous turn, never a bounce.
#spin-toggle@keyframes spinanimation: spin 12s linear infinite
Made with css-motion for “Quiet-storm sleeve”: One keyframe rotation on the record, with a pause button and a reduced-motion stop.
Away from the sketch: 1 new part
voice · dna4In the files
Trickster asides: handwritten interruptions that puncture the smooth sleeve copy
Anchored to
The trickster meaning quality · newEccentric mood quality · new
Translates: The trickster · Eccentric
InterpretationThe trickster and the eccentric sketch voice cut in on the polished line. Each section has one smooth line and one scrawl that undercuts it.
The second one is when the night starts.
No names on the poster. You'll find out who's funny.
Five minutes is longer than you think.
#asides
Made with copy for “The trickster on a bare stage”: The asides are written lines placed beside the smooth copy.
Away from the sketch: 1 new part
layout · dna7In the files
Bar guest check for the money: tickets and the drink minimum written on a ruled tab with a total line
Anchored to
The Last O.G. TV · newI Want You Back film · newCommunity meaning quality · new
Translates: Warm · Community · Observational
InterpretationWarm, observational neighbourhood stories live in places like this bar. The prices sit where a bar writes them: on a guest check, ruled, with handwritten amounts.
#the-tab
Made with css-layout for “Warm back room”: A ruled guest check built with repeating gradients and a grid.
Away from the sketch: 1 new part
structure · dna3In the files
The evening as a back-cover tracklist: Side A is every Tuesday, Side B is the first-Tuesday open mic, each line with its time
Anchored to
Maxwell music · newRomance meaning quality · new
Translates: Smooth · Romance
InterpretationA vinyl back cover lists songs with their running times. Here the doors, the show and the sign-up become the tracks, read top to bottom like a slow side.
#side-a#side-b#tracklist
Made with css-layout for “Quiet-storm sleeve”: Two side panels with a tracklist grid of times and titles.
Away from the sketch: 3 new parts
interaction · dna8In the files
Request line: the newsletter form as a late-night radio request card, plus a script that names the next Tuesday and whether it is an open-mic night
Anchored to
Romance meaning quality · newCommunity meaning quality · new
Translates: Romance · Community
InterpretationQuiet-storm radio takes requests late at night; the sign-up asks for one thing, an email. The next-Tuesday line is computed from the weekly schedule and the first-Tuesday rule, so it states no new fact.
#request-line#next-tuesday
Made with interaction-script for “Warm back room”: A small script computes the next Tuesday and whether it is the first of the month, and confirms the request-card form.
Away from the sketch: 2 new parts