{ "schemaVersion": "1.0", "kind": "comparison", "generatedAt": "2026-10-27T14:00:19.649Z", "host": "claude-code", "writtenBy": { "name": "mousa", "version": "0.7.1" }, "medium": "app-ui", "title": "For an audience that loves Haruki Murakami and LCD Soundsystem", "audience": { "references": [ { "name": "Haruki Murakami", "found": true }, { "name": "LCD Soundsystem", "found": true } ], "segments": [ { "name": "runners", "found": false } ] }, "headline": { "value": "0.63", "text": "heuristic distance between the two designs, from 0 (alike) to 1", "sentence": "10 of 10 devices rest on what the prediction did not contain." }, "arms": [ { "label": "With Qloo", "folder": "compare/with-qloo", "taste": "qloo", "kind": "session", "headline": { "value": "10 of 10", "text": "design devices rest on what the model did not predict", "sentence": "10 of 10 devices rest on what the prediction did not contain." }, "link": "/gallery/run-club-claude-code/arms/with-qloo/" }, { "label": "Without Qloo", "folder": "compare/without-qloo", "taste": "own prediction", "kind": "baseline", "headline": { "value": "9", "text": "design devices rest on the model's own prediction, with no Qloo data", "sentence": "9 devices rest on the prediction alone; no Qloo data was used." }, "link": "/gallery/run-club-claude-code/arms/without-qloo/" } ], "samePrediction": true, "measure": "design", "distance": { "overall": 0.632, "palette": 0.476, "typography": 0.771, "structure": 1, "features": 0.306, "method": "Weighted heuristic: palette CIE76 color distance (35%), font family/class difference (20%), landmark section ID difference (25%), CSS property and signature-feature difference (20%)." }, "prediction": { "frozenAt": "2026-10-26T21:55:05.492Z", "sha256": "7c125cab23726c125b257ccf80e4b559961ad0c77eea0ffcfb21f56b80b292f5", "sealHolds": true, "summary": "Literate, slightly melancholy urban night-owls in their 30s-40s who treat running as solitary meditation (Murakami's 'What I Talk About When I Talk About Running') and love dance-punk built on long, repetitive, building grooves. They prize vinyl, paperbacks, cats, jazz bars and the quiet strangeness of a city after dark.", "groups": [ { "domain": "brand", "label": "Brands", "quality": false, "entries": [ { "name": "Muji", "measured": false }, { "name": "Uniqlo", "measured": false }, { "name": "Bandcamp", "measured": false }, { "name": "Patagonia", "measured": false }, { "name": "Moleskine", "measured": false }, { "name": "Criterion Collection", "measured": false } ] }, { "domain": "tv_show", "label": "TV", "quality": false, "entries": [ { "name": "Twin Peaks", "measured": false }, { "name": "Atlanta", "measured": false }, { "name": "Severance", "measured": false }, { "name": "Broad City", "measured": true }, { "name": "Midnight Diner", "measured": false } ] }, { "domain": "movie", "label": "Films", "quality": false, "entries": [ { "name": "Lost in Translation", "measured": true }, { "name": "In the Mood for Love", "measured": false }, { "name": "Burning", "measured": false }, { "name": "Drive My Car", "measured": false }, { "name": "Paterson", "measured": false }, { "name": "Perfect Days", "measured": false } ] }, { "domain": "artist", "label": "Music", "quality": false, "entries": [ { "name": "Talking Heads", "measured": false }, { "name": "Radiohead", "measured": false }, { "name": "The Strokes", "measured": false }, { "name": "Arcade Fire", "measured": true }, { "name": "Hot Chip", "measured": false }, { "name": "New Order", "measured": false } ] }, { "domain": "podcast", "label": "Podcasts", "quality": false, "entries": [ { "name": "This American Life", "measured": true }, { "name": "Radiolab", "measured": true }, { "name": "Song Exploder", "measured": true }, { "name": "99% Invisible", "measured": true } ] }, { "domain": "style", "label": "Pacing", "quality": true, "entries": [ { "name": "slow, contemplative pacing", "measured": false }, { "name": "long takes", "measured": false }, { "name": "repetitive structures that build", "measured": false }, { "name": "dreamlike drift", "measured": false } ] }, { "domain": "aesthetic", "label": "Surfaces", "quality": true, "entries": [ { "name": "minimalist", "measured": true }, { "name": "neon at night", "measured": false }, { "name": "analog and vinyl warmth", "measured": false }, { "name": "lo-fi grain", "measured": true, "as": "Lo Fi (pacing)" }, { "name": "urban nocturnal", "measured": false } ] }, { "domain": "tone", "label": "Tone", "quality": true, "entries": [ { "name": "melancholic", "measured": false }, { "name": "wistful", "measured": false }, { "name": "surreal", "measured": true, "as": "Surrealism (meaning quality)" }, { "name": "quietly euphoric", "measured": false }, { "name": "lonely", "measured": false } ] }, { "domain": "qualities", "label": "Shared qualities", "quality": true, "entries": [ { "name": "solitude in the city", "measured": false }, { "name": "repetition as ritual", "measured": false }, { "name": "parallel worlds and doors", "measured": false }, { "name": "nostalgia", "measured": false }, { "name": "dance as release", "measured": false } ] } ], "sketch": { "summary": "A near-black night app with a single moon-yellow accent, typewriter-mono labels and a literary serif, where each run is a numbered 'chapter' in a paperback-style logbook, the next run is shown as a countdown with a pulsing BPM beat, and a well-and-moon motif marks the fountain.", "palette": [ "#0d0f14", "#f2c94c", "#e8e4da", "#3a4a6b", "#d94f3d" ], "fonts": [ "Literata", "Courier Prime" ], "sections": [ "next-run", "rsvp", "run-log", "routes", "streak", "playlist" ], "motifs": [ "two moons", "the fountain as a well", "run log as numbered chapters", "pulsing beat at 120 BPM", "late-night jazz bar" ] } }, "measured": { "counts": { "works": 70, "worksPredicted": 7, "worksNew": 63, "qualities": 18, "qualitiesPredicted": 2, "tags": 24, "tagsPredicted": 1, "predictions": 27, "predictionsMeasured": 7, "requests": 13, "fromCache": 0 }, "qualities": { "look": [ { "name": "Energetic", "kind": "look quality", "mark": "new", "works": [ "The Flaming Lips", "Pixies", "Pavement" ], "domains": [ "music", "TV" ], "lift": 1.65 }, { "name": "Professional", "kind": "look quality", "mark": "new", "works": [ "NPR", "University of Illinois at Springfield", "ShipStation" ], "domains": [ "brand" ], "lift": 2.77 }, { "name": "Minimalist", "kind": "look quality", "mark": "predicted", "works": [ "The Velvet Underground", "Spoon", "NPR" ], "domains": [ "music", "brand" ], "lift": 1.12 }, { "name": "Clean Typography", "kind": "look quality", "mark": "new", "works": [ "MoMA, the Museum of Modern Art", "NPR", "Huffpost" ], "domains": [ "brand" ], "lift": 1.97 }, { "name": "Atmospheric", "kind": "look quality", "mark": "new", "works": [ "Synecdoche, New York", "Adaptation.", "Forever" ], "domains": [ "film", "TV" ], "lift": 1.08 } ], "mood": [ { "name": "Obsessive", "kind": "mood quality", "mark": "new", "works": [ "Being John Malkovich", "The Devil and Daniel Johnston", "City of God" ], "domains": [ "film" ], "lift": 3.01 }, { "name": "Psychological", "kind": "mood quality", "mark": "new", "works": [ "Lady Dynamite", "The Path", "The Devil and Daniel Johnston" ], "domains": [ "TV", "film" ], "lift": 2.58 }, { "name": "Character driven", "kind": "mood quality", "mark": "new", "works": [ "Lady Dynamite", "Portlandia", "Happyish" ], "domains": [ "TV", "film" ], "lift": 1.31 }, { "name": "Nonlinear", "kind": "mood quality", "mark": "new", "works": [ "Lady Dynamite", "Enter the Void" ], "domains": [ "TV", "film" ], "lift": 2.44 }, { "name": "Psychedelic", "kind": "mood quality", "mark": "new", "works": [ "The Flaming Lips", "Animal Collective" ], "domains": [ "music" ], "lift": 2.44 } ], "meaning": [ { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted", "works": [ "The Flaming Lips", "Animal Collective", "Beck" ], "domains": [ "music" ], "lift": 3.26 }, { "name": "Global Citizenship", "kind": "meaning quality", "mark": "new", "works": [ "The New Yorker", "MoMA, the Museum of Modern Art", "Metropolitan Museum of Art" ], "domains": [ "brand" ], "lift": 3.26 }, { "name": "Indie music", "kind": "meaning quality", "mark": "new", "works": [ "Happyish", "Almost Famous" ], "domains": [ "TV", "film" ], "lift": 2.44 }, { "name": "Obsession", "kind": "meaning quality", "mark": "new", "works": [ "Search Party", "Man in the Mirror" ], "domains": [ "TV", "film" ], "lift": 2.4 }, { "name": "Humor", "kind": "meaning quality", "mark": "new", "works": [ "Pavement", "Beck" ], "domains": [ "music" ], "lift": 2.44 } ] }, "tags": { "pacing": [ { "name": "Comic-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Cinematic Intimacy", "kind": "pacing", "mark": "new" }, { "name": "Gritty Realism", "kind": "pacing", "mark": "new" }, { "name": "Pop Culture Savvy", "kind": "pacing", "mark": "new" }, { "name": "Retro-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Visually Enchanting", "kind": "pacing", "mark": "new" } ], "surfaces": [ { "name": "Modern Tailoring", "kind": "surface", "mark": "new" }, { "name": "Parisian", "kind": "surface", "mark": "new" }, { "name": "Artsy", "kind": "surface", "mark": "new" }, { "name": "Trendsetting", "kind": "surface", "mark": "new" }, { "name": "Vintage Inspired", "kind": "surface", "mark": "new" }, { "name": "Artistic", "kind": "surface", "mark": "new" } ], "tone": [ { "name": "minimalism", "kind": "tone", "mark": "new" }, { "name": "Bohemian", "kind": "tone", "mark": "new" }, { "name": "Refined", "kind": "tone", "mark": "new" }, { "name": "Informative", "kind": "tone", "mark": "new" }, { "name": "Curiosity", "kind": "tone", "mark": "new" }, { "name": "quality", "kind": "tone", "mark": "new" } ] }, "worlds": [ { "label": "Brands", "works": [ { "name": "The New Yorker", "kind": "brand", "mark": "new", "tags": [ "Minimalist Typography", "Signature Serif Font", "Classic Illustration Style" ] }, { "name": "Vice", "kind": "brand", "mark": "new", "tags": [ "News & Politics", "Advertising Enabled", "Television broadcasting companies of Canada" ] }, { "name": "MoMA, the Museum of Modern Art", "kind": "brand", "mark": "new", "tags": [ "Minimalist Architecture", "Modernist Design", "Clean Typography" ] }, { "name": "Getty Images", "kind": "brand", "mark": "new", "tags": [ "Mass media companies established in 1995", "Photo agencies", "Entertainment" ] } ] }, { "label": "Brands, lesser known", "works": [ { "name": "LA Kings", "kind": "brand", "mark": "new", "tags": [ "Black And Silver Palette", "Minimalist Logo Design", "Iconic Visual Branding" ] }, { "name": "Antonio Banderas", "kind": "brand", "mark": "new", "tags": [ "Fashion" ] } ] }, { "label": "TV", "works": [ { "name": "Black Mirror", "kind": "TV", "mark": "new", "tags": [ "Bleak minimalism", "Morally ambiguous", "Self destructive" ] }, { "name": "Lady Dynamite", "kind": "TV", "mark": "new", "tags": [ "Flashback driven", "Whimsical", "Humorous" ] }, { "name": "Search Party", "kind": "TV", "mark": "new", "tags": [ "Identity crisis", "Obsession", "Tbs" ] }, { "name": "Forever", "kind": "TV", "mark": "new", "tags": [ "Atmospheric", "Episodic", "Thought provoking" ] } ] }, { "label": "Films", "works": [ { "name": "Synecdoche, New York", "kind": "film", "mark": "new", "tags": [ "Atmospheric", "Art and creativity", "Electronic translator" ] }, { "name": "Being John Malkovich", "kind": "film", "mark": "new", "tags": [ "Surreal", "Humorous", "Obsessive" ] }, { "name": "Adaptation.", "kind": "film", "mark": "new", "tags": [ "Atmospheric", "Charismatic", "Creative writing" ] }, { "name": "Gummo", "kind": "film", "mark": "new", "tags": [ "Ferocious minimalism", "Fragmented", "Transgressive" ] } ] }, { "label": "Films, lesser known", "works": [ { "name": "City of God", "kind": "film", "mark": "new", "tags": [ "Atmospheric", "Kinetic", "Collage like" ] }, { "name": "Control", "kind": "film", "mark": "new", "tags": [ "Clinical", "Gritty", "Cinematic" ] } ] }, { "label": "Music", "works": [ { "name": "The Flaming Lips", "kind": "music", "mark": "new", "tags": [ "Visual", "Energetic", "Synth-Infused" ] }, { "name": "Pixies", "kind": "music", "mark": "new", "tags": [ "Noise Infused", "Intense", "Raw" ] }, { "name": "TV on the Radio", "kind": "music", "mark": "new", "tags": [ "Indie Rock", "Soulful", "Layered" ] }, { "name": "Pavement", "kind": "music", "mark": "new", "tags": [ "Noise Rock", "Energetic", "Post Punk" ] } ] }, { "label": "Podcasts", "works": [ { "name": "Radiolab", "kind": "podcast", "mark": "predicted", "tags": [ "Podcasts", "Natural Sciences", "Society & Culture" ] }, { "name": "Invisibilia", "kind": "podcast", "mark": "new", "tags": [ "Society & Culture", "Podcasts", "Social Sciences" ] }, { "name": "This American Life", "kind": "podcast", "mark": "predicted", "tags": [ "Arts", "Podcasts", "Society & Culture" ] }, { "name": "Hidden Brain", "kind": "podcast", "mark": "new", "tags": [ "Arts", "Podcasts", "Performing Arts" ] } ] } ], "required": [ { "name": "NPR", "kind": "brand", "mark": "new" }, { "name": "Lady Dynamite", "kind": "TV", "mark": "new" }, { "name": "The Flaming Lips", "kind": "music", "mark": "new" }, { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "Obsessive", "kind": "mood quality", "mark": "new" }, { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted" } ], "cautions": [ "Professional is carried mostly by brands (NPR, University of Illinois at Springfield, ShipStation): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "Minimalist is carried mostly by brands (NPR, Huffpost, Breather): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "Clean Typography is carried mostly by brands (MoMA, the Museum of Modern Art, NPR, Huffpost): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "Clean is carried mostly by brands (Evolve Vacation Rental, Breather, ShipStation): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "The audience \"runners\" matched no Qloo audience segment, so it did not contribute." ] }, "views": [ { "key": "phone", "label": "phone", "a": { "id": "r2-phone", "round": 2, "view": "phone", "width": 390, "height": 844, "label": "phone", "cited": true, "source": ".mousa/captures/r2-phone.png", "file": "assets/captures/a-r2-phone.png" }, "b": null }, { "key": "board-demo-flash", "label": "board · demo:flash", "a": { "id": "r2-board-demo-flash", "round": 2, "view": "board", "target": "demo:flash", "width": 1440, "height": 900, "label": "board · demo:flash", "cited": true, "source": ".mousa/captures/r2-board-demo-flash.png", "file": "assets/captures/a-r2-board-demo-flash.png" }, "b": null }, { "key": "phone-demo-tab-wall-flash", "label": "phone · demo:tab=wall:flash", "a": { "id": "r2-phone-demo-tab-wall-flash", "round": 2, "view": "phone", "target": "demo:tab=wall:flash", "width": 390, "height": 844, "label": "phone · demo:tab=wall:flash", "cited": false, "source": ".mousa/captures/r2-phone-demo-tab-wall-flash.png", "file": "assets/captures/a-r2-phone-demo-tab-wall-flash.png" }, "b": null }, { "key": "phone-demo-tab-odd", "label": "phone · demo:tab=odd", "a": { "id": "r2-phone-demo-tab-odd", "round": 2, "view": "phone", "target": "demo:tab=odd", "width": 390, "height": 844, "label": "phone · demo:tab=odd", "cited": false, "source": ".mousa/captures/r2-phone-demo-tab-odd.png", "file": "assets/captures/a-r2-phone-demo-tab-odd.png" }, "b": null }, { "key": "board-demo-flash-full", "label": "board · demo:flash · full page", "a": { "id": "r2-board-demo-flash-full", "round": 2, "view": "board", "target": "demo:flash", "full": true, "width": 1440, "height": 2993, "label": "board · demo:flash · full page", "cited": false, "source": ".mousa/captures/r2-board-demo-flash-full.png", "file": "assets/captures/a-r2-board-demo-flash-full.png" }, "b": null }, { "key": "board", "label": "board", "a": { "id": "r2-board", "round": 2, "view": "board", "width": 1440, "height": 900, "label": "board", "cited": false, "source": ".mousa/captures/r2-board.png", "file": "assets/captures/a-r2-board.png" }, "b": null }, { "key": "board-full", "label": "board · full page", "a": null, "b": { "id": "r2-board-full", "round": 2, "view": "board", "full": true, "width": 1440, "height": 1027, "label": "board · full page", "cited": false, "source": ".mousa/captures/r2-board-full.png", "file": "assets/captures/b-r2-board-full.png" } }, { "key": "phone-sample-full", "label": "phone · sample · full page", "a": null, "b": { "id": "r2-phone-sample-full", "round": 2, "view": "phone", "target": "sample", "full": true, "width": 390, "height": 1253, "label": "phone · sample · full page", "cited": true, "source": ".mousa/captures/r2-phone-sample-full.png", "file": "assets/captures/b-r2-phone-sample-full.png" } }, { "key": "phone-sample-notebook", "label": "phone · sample-notebook", "a": null, "b": { "id": "r2-phone-sample-notebook", "round": 2, "view": "phone", "target": "sample-notebook", "width": 390, "height": 844, "label": "phone · sample-notebook", "cited": true, "source": ".mousa/captures/r2-phone-sample-notebook.png", "file": "assets/captures/b-r2-phone-sample-notebook.png" } }, { "key": "phone-sample-loop-full", "label": "phone · sample-loop · full page", "a": null, "b": { "id": "r2-phone-sample-loop-full", "round": 2, "view": "phone", "target": "sample-loop", "full": true, "width": 390, "height": 1332, "label": "phone · sample-loop · full page", "cited": true, "source": ".mousa/captures/r2-phone-sample-loop-full.png", "file": "assets/captures/b-r2-phone-sample-loop-full.png" } }, { "key": "board-sample", "label": "board · sample", "a": null, "b": { "id": "r2-board-sample", "round": 2, "view": "board", "target": "sample", "width": 1440, "height": 900, "label": "board · sample", "cited": true, "source": ".mousa/captures/r2-board-sample.png", "file": "assets/captures/b-r2-board-sample.png" } } ], "layers": [ { "layer": "palette", "arms": [ [ { "id": "dna1", "layer": "palette", "device": "Two-ink riso night: fluorescent pink and mint overprinted on riso blue", "anchors": [ { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "The Flaming Lips", "kind": "music", "mark": "new" } ], "qualities": [ "Energetic", "Visual" ], "translation": "Energetic is drawn the way photocopied indie gig flyers draw it: a saturated blue ground with fluorescent pink and mint inks that overlap and misregister, plus a cool paper white for the label cards. No brand's colours, the genre's ink set.", "convention": "photocopied indie-rock gig flyers in two-ink riso: fluorescent pink overprinted on blue, slightly misregistered", "tokens": { "colors": [ "#2234a8", "#ff3fa4", "#3ce0a0", "#eef1f4", "#101544" ] }, "surprise": true, "moved": { "colors": [ "#2234a8", "#ff3fa4", "#3ce0a0", "#101544" ], "fonts": [], "ids": [] }, "method": "design-tokens", "why": "The ink set lives in tokens.json and :root custom properties so every surface uses the same riso inks.", "cluster": "Energetic surreal noise", "check": "present" } ], [ { "id": "dna1", "layer": "palette", "device": "Sodium streetlight on teal-blue shadow, with one cool neon and one plain paper", "anchors": [ { "name": "solitude in the city", "kind": "quality", "mark": "own" }, { "name": "urban nocturnal", "kind": "surface", "mark": "own" }, { "name": "Lost in Translation", "kind": "film", "mark": "own" } ], "qualities": [ "solitude in the city", "urban nocturnal" ], "translation": "Solitude in the city drawn the way late-night film stills draw it: a deep teal-blue shadow ground instead of black, sodium-orange light for what is warm and human (the run, the door, the button), a cool neon mint for the loop that builds, and a cool unbleached paper for the notebook. Two lights, not one accent.", "convention": "late-night film stills: sodium-orange streetlight against teal-blue shadow, one small figure low in the frame", "tokens": { "colors": [ "#12304a", "#0a1d30", "#ff8a3d", "#5fe3c0", "#e9eef2", "#16293b" ] }, "surprise": false, "moved": { "colors": [ "#ff8a3d", "#5fe3c0" ], "fonts": [], "ids": [] }, "method": "design-tokens", "why": "The six colours live in tokens/tokens.json and as custom properties in :root, so every screen draws from the same night palette.", "cluster": "Alone in the lit city", "check": "present" } ] ] }, { "layer": "typography", "arms": [ [ { "id": "dna2", "layer": "typography", "device": "Museum wall-label grotesque for every fact", "anchors": [ { "name": "Clean Typography", "kind": "look quality", "mark": "new" }, { "name": "NPR", "kind": "brand", "mark": "new" } ], "qualities": [ "Clean Typography", "Professional" ], "translation": "Clean Typography set as museum wall labels set it: a small, even grotesque, title then date then detail stacked flush left, sentence case, no tracking tricks.", "convention": "museum wall labels: a small clean grotesque, title, date and medium stacked flush left", "tokens": { "fonts": [ "Familjen Grotesk" ], "css": [ "text-align: left" ] }, "surprise": true, "moved": { "colors": [], "fonts": [ "Familjen Grotesk" ], "ids": [] }, "method": "library-font", "why": "Familjen Grotesk is fetched locally and set through a font token for all label and body text.", "cluster": "Public-radio clarity", "check": "present" }, { "id": "dna3", "layer": "typography", "device": "Flyer headline in a heavy poster grotesque", "anchors": [ { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "Pixies", "kind": "music", "mark": "new" } ], "qualities": [ "Energetic", "Raw" ], "translation": "The loud register: one heavy, raw poster grotesque for the club name and the big numbers, set tight like a photocopied gig flyer headline.", "convention": "photocopied indie-rock gig flyers in two-ink riso: fluorescent pink overprinted on blue, slightly misregistered", "tokens": { "fonts": [ "Archivo Black" ], "css": [ "line-height: 0.92" ] }, "surprise": true, "moved": { "colors": [], "fonts": [ "Archivo Black" ], "ids": [] }, "method": "library-font", "why": "Archivo Black is fetched locally and set through a display font token for the name and big numbers.", "cluster": "Energetic surreal noise", "check": "present" } ], [ { "id": "dna2", "layer": "typography", "device": "A heavy record-sleeve word over a paperback page, with the notebook in handwriting", "anchors": [ { "name": "repetition as ritual", "kind": "quality", "mark": "own" }, { "name": "Hot Chip", "kind": "music", "mark": "own" }, { "name": "nostalgia", "kind": "quality", "mark": "own" } ], "qualities": [ "repetition as ritual", "nostalgia" ], "translation": "Headings are set the way 12-inch dance singles set their one word: a heavy grotesk, tight and large, on a flat field. Running text is set like a translated paperback in an old-style book serif. What the member writes in the log appears in a handwriting face, as in a plain notebook.", "convention": "12-inch dance single sleeves: one heavy grotesk word on a flat field of colour, a tiny block of track times", "tokens": { "fonts": [ "Archivo Black", "EB Garamond", "Caveat" ], "css": [ "letter-spacing: -0.02em" ] }, "surprise": false, "moved": { "colors": [], "fonts": [ "Archivo Black", "EB Garamond", "Caveat" ], "ids": [] }, "method": "library-font", "why": "Archivo Black, EB Garamond and Caveat are fetched as local files and referenced through font tokens; no network fonts are allowed.", "cluster": "The loop that builds", "check": "present" } ] ] }, { "layer": "imagery", "arms": [ [ { "id": "dna9", "layer": "imagery", "device": "Two-ink fountain print", "anchors": [ { "name": "Artsy", "kind": "surface", "mark": "new" }, { "name": "Vintage Inspired", "kind": "surface", "mark": "new" } ], "qualities": [ "Artsy", "Vintage Inspired" ], "translation": "An artsy, vintage surface becomes an original drawing of an old park fountain built from flat cut shapes in pink and mint over blue, slightly offset like a riso pull.", "tokens": { "ids": [ "fountain-figure" ], "svg": [ "fountain-print" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "fountain-figure" ] }, "method": "inline-svg", "why": "A hand-built flat-shape SVG of the fountain with offset pink and mint layers.", "cluster": "Energetic surreal noise", "check": "present" } ], [ { "id": "dna5", "layer": "imagery", "device": "A night skyline whose lit windows are the member's runs, over the park fountain", "anchors": [ { "name": "neon at night", "kind": "surface", "mark": "own" }, { "name": "In the Mood for Love", "kind": "film", "mark": "own" }, { "name": "Drive My Car", "kind": "film", "mark": "own" } ], "qualities": [ "neon at night", "urban nocturnal" ], "translation": "A hotel-window view of the city at night, drawn flat in SVG: dark blocks gridded with windows, a park line and the old fountain small at the bottom. One window lights for each run in the member's notebook, so the city slowly fills up with their own nights.", "convention": "a hotel-window view of the city: a dark facade gridded with a few lit windows", "tokens": { "ids": [ "tonight-hero" ], "svg": [ "night-city" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "tonight-hero" ] }, "method": "inline-svg", "why": "The skyline is an original inline SVG whose window rects are lit by script from the number of logged runs.", "cluster": "Alone in the lit city", "check": "present" } ] ] }, { "layer": "motion", "arms": [ [ { "id": "dna8", "layer": "motion", "device": "Misregistration kick: the pink layer jumps out of register on each action", "anchors": [ { "name": "Comic-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Energetic", "kind": "look quality", "mark": "new" } ], "qualities": [ "Comic-Inspired", "Energetic" ], "translation": "Comic-inspired pacing becomes a short stepped jolt: when a member commits or logs, the pink ink offsets in three hard steps and snaps back, like a misprinted panel. Runs once, never loops.", "tokens": { "css": [ "animation: misregister 420ms steps(3) 1" ], "keyframes": [ "misregister" ] }, "surprise": true, "method": "css-motion", "why": "A stepped keyframe on the pink ink layer, triggered once per action, with a reduced-motion fallback.", "cluster": "Energetic surreal noise", "check": "present" } ], [ { "id": "dna6", "layer": "motion", "device": "Slow drifting windows and a beat you can set", "anchors": [ { "name": "dreamlike drift", "kind": "pacing", "mark": "own" }, { "name": "repetitive structures that build", "kind": "pacing", "mark": "own" } ], "qualities": [ "dreamlike drift", "repetitive structures that build" ], "translation": "Dreamlike drift becomes lit windows that fade up and down on a fourteen-second cycle, out of step with each other; the repetitive build becomes a pulse that beats at the cadence the member chooses in the planner. Both pause on a control and stop under reduced motion.", "tokens": { "css": [ "animation: window-drift 14s ease-in-out infinite" ], "keyframes": [ "window-drift", "beat-pulse" ] }, "surprise": false, "method": "css-motion", "why": "Two keyframes: window-drift on lit windows, beat-pulse on the metronome; a pause control and a prefers-reduced-motion rule stop both.", "cluster": "Doors to the other side", "check": "present" } ] ] }, { "layer": "voice", "arms": [ [ { "id": "dna10", "layer": "voice", "device": "Curious rundown voice: facts first, one question after", "anchors": [ { "name": "Curiosity", "kind": "tone", "mark": "new" }, { "name": "Informative", "kind": "tone", "mark": "new" } ], "qualities": [ "Curiosity", "Informative" ], "translation": "Curiosity and an informative tone replace my guessed melancholy: plain facts stated once, then a curious prompt that asks the runner to notice something.", "tokens": { "copy": [ "Saw something odd on the run? File it before it turns ordinary.", "Nothing on the wall yet. It starts with your first Thursday.", "Pull an old Thursday out of order." ] }, "surprise": true, "method": "copy", "why": "The lines go into buttons, empty states and prompts.", "cluster": "Public-radio clarity", "check": "present" } ], [ { "id": "dna9", "layer": "voice", "device": "Short, wistful lines that state the fact and then step back", "anchors": [ { "name": "melancholic", "kind": "tone", "mark": "own" }, { "name": "lonely", "kind": "tone", "mark": "own" }, { "name": "quietly euphoric", "kind": "tone", "mark": "own" } ], "qualities": [ "melancholic", "quietly euphoric" ], "translation": "A melancholic, quietly euphoric register: plain sentences, the fact first, then one small turn. The voice never adds a fact: only Thursday, 20:00, the old fountain, 5 km and 10 km.", "tokens": { "copy": [ "Thursday, 20:00. The old fountain, in the park.", "Same loop. A different night.", "Where did your mind go tonight?" ] }, "surprise": false, "method": "copy", "why": "The lines go into titles, empty states and prompts across the screens, keeping only the brief's facts.", "cluster": "Alone in the lit city", "check": "present" } ] ] }, { "layer": "layout", "arms": [ [], [ { "id": "dna7", "layer": "layout", "device": "The notebook: a ruled page with a margin line, each run a numbered chapter", "anchors": [ { "name": "Muji", "kind": "brand", "mark": "own" }, { "name": "Moleskine", "kind": "brand", "mark": "own" }, { "name": "Perfect Days", "kind": "film", "mark": "own" } ], "qualities": [ "nostalgia", "minimalist" ], "translation": "Runs are remembered on a plain ruled notebook page: faint blue rules, a margin line, the date in book serif and the member's note in handwriting. Each entry carries a chapter number on a small spine band, like a collected edition. Unbranded and kept by hand, the way the prediction reads Muji and Moleskine.", "convention": "plain ruled notebook pages: faint blue rules, a red margin line, handwritten entries", "tokens": { "css": [ "background-image: repeating-linear-gradient(transparent 0 31px, #b7c8dc 31px 32px)" ], "ids": [ "notebook", "log-form" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "notebook", "log-form" ] }, "method": "screen-layout", "why": "The Notebook screen is a ruled page made with a repeating gradient, a margin line, and chapter-numbered entries with a form to add one.", "cluster": "Kept in a plain notebook", "check": "present" } ] ] }, { "layer": "structure", "arms": [ [ { "id": "dna4", "layer": "structure", "device": "The Thursday wall: every Thursday of the season as a card in a grid", "anchors": [ { "name": "Obsessive", "kind": "mood quality", "mark": "new" }, { "name": "Obsession", "kind": "meaning quality", "mark": "new" }, { "name": "Search Party", "kind": "TV", "mark": "new" } ], "qualities": [ "Obsessive", "Obsession" ], "translation": "Obsession becomes the reward: not a streak number but an index-card wall of the last 24 Thursdays, each filled in with the route you ran, so gaps and runs are both kept in sequence.", "convention": "indie psychological film production design: walls of index cards, labelled tapes and filing boxes kept in obsessive sequence", "tokens": { "css": [ "grid-template-columns: repeat(6, 1fr)" ], "ids": [ "thursday-wall" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "thursday-wall" ] }, "method": "screen-layout", "why": "A six-column grid of 24 Thursday cards drawn from the stored log.", "cluster": "The obsessive archive", "check": "present" }, { "id": "dna6", "layer": "structure", "device": "The oddity file: one strange thing seen per run, archived", "anchors": [ { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted" }, { "name": "Being John Malkovich", "kind": "film", "mark": "new" } ], "qualities": [ "Surrealism", "Surreal" ], "translation": "Surrealism becomes a feature: each member files the odd things they notice on the night run, and the app keeps them as a numbered catalogue of small strangenesses.", "tokens": { "ids": [ "oddities" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "oddities" ] }, "method": "screen-layout", "why": "A form and a numbered list kept in localStorage.", "cluster": "The obsessive archive", "check": "present" } ], [ { "id": "dna3", "layer": "structure", "device": "Sixteen Thursdays: a step-sequencer that lights one square per run", "anchors": [ { "name": "repetition as ritual", "kind": "quality", "mark": "own" }, { "name": "repetitive structures that build", "kind": "pacing", "mark": "own" }, { "name": "New Order", "kind": "music", "mark": "own" } ], "qualities": [ "repetition as ritual", "repetitive structures that build" ], "translation": "The weekly ritual becomes the app's reward: the last sixteen Thursdays laid out as a 4 x 4 step-sequencer row. Each Thursday a member logged lights its square; four in a row complete a bar, and the streak is counted in Thursdays. The loop builds the way a long groove builds.", "convention": "step-sequencer grids: a row of sixteen squares that light one by one and loop", "tokens": { "ids": [ "loop-grid", "loop-screen", "loop-streak" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "loop-grid", "loop-screen", "loop-streak" ] }, "method": "screen-layout", "why": "The sequencer is a real component on the Loop screen: a 4 x 4 grid of buttons computed from the run log, with a streak count and bar marks.", "cluster": "The loop that builds", "check": "present" } ] ] }, { "layer": "interaction", "arms": [ [ { "id": "dna5", "layer": "interaction", "device": "Flashback: an old run cuts back in with a dated title card", "anchors": [ { "name": "Lady Dynamite", "kind": "TV", "mark": "new" }, { "name": "Nonlinear", "kind": "mood quality", "mark": "new" } ], "qualities": [ "Flashback driven", "Nonlinear" ], "translation": "Flashback-driven, nonlinear memory becomes a control that pulls a random past run out of order and shows it behind a hard date card, with your own note and soundtrack line.", "convention": "flashback cuts: a hard title card with a date before the remembered scene", "tokens": { "css": [ "transition: transform 360ms steps(4)" ], "ids": [ "flashback" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "flashback" ] }, "method": "screen-layout", "why": "A button plus a card that flips in with a stepped transform, filled from a random stored run.", "cluster": "The obsessive archive", "check": "present" }, { "id": "dna7", "layer": "interaction", "device": "Pace rundown: plan a finish time like a radio show rundown", "anchors": [ { "name": "Informative", "kind": "tone", "mark": "new" }, { "name": "Radiolab", "kind": "podcast", "mark": "predicted" } ], "qualities": [ "Informative" ], "translation": "Informative becomes a planner: choose 5 or 10 km and a pace, and the run is laid out as a rundown of kilometre marks with clock times from 20:00, in tabular figures.", "convention": "public-radio show rundowns: segment times listed in a plain tidy column", "tokens": { "css": [ "font-variant-numeric: tabular-nums" ], "ids": [ "pace-planner" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "pace-planner" ] }, "method": "screen-layout", "why": "Route and pace inputs that produce a tabular rundown of kilometre clock times.", "cluster": "Public-radio clarity", "check": "present" } ], [ { "id": "dna4", "layer": "interaction", "device": "The door: saying you are coming opens a drawn door onto light", "anchors": [ { "name": "parallel worlds and doors", "kind": "quality", "mark": "own" }, { "name": "Twin Peaks", "kind": "TV", "mark": "own" }, { "name": "surreal", "kind": "tone", "mark": "own" } ], "qualities": [ "parallel worlds and doors", "surreal" ], "translation": "Parallel worlds and doors becomes the RSVP itself: a plain door drawn in the night scene swings open on its hinge when a member says they are coming, and sodium light spills out. Closing it takes the RSVP back. No curtain, no patterned floor: only a door in an ordinary place.", "convention": "a corridor of identical doors in one-point perspective, one of them lit", "tokens": { "css": [ "transition: transform 1.4s cubic-bezier(.2,.7,.2,1)" ], "ids": [ "door-rsvp" ], "svg": [ "door-art" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "door-rsvp" ] }, "method": "css-motion", "why": "The door is an inline SVG panel rotated on its hinge by a CSS transition when the RSVP state changes; the transition token carries the slow swing.", "cluster": "Doors to the other side", "check": "present" }, { "id": "dna8", "layer": "interaction", "device": "Plan the run: route, target time, splits and a cadence pulse", "anchors": [ { "name": "dance as release", "kind": "quality", "mark": "own" }, { "name": "Talking Heads", "kind": "music", "mark": "own" }, { "name": "quietly euphoric", "kind": "tone", "mark": "own" } ], "qualities": [ "dance as release", "quietly euphoric" ], "translation": "Dance as release becomes a planner that turns a run into a beat: pick the 5 km or 10 km route and a target time, read the pace and the kilometre splits, then set a cadence and let the app pulse (and click, if wanted) at that tempo.", "tokens": { "ids": [ "planner", "metronome", "split-list" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "planner", "metronome", "split-list" ] }, "method": "screen-layout", "why": "The planner is a working form on the Plan screen: route and target time in, pace and splits out, and a cadence metronome with start and stop.", "cluster": "The loop that builds", "check": "present" } ] ] } ], "limits": [ "One pair is one sample. Model variance alone makes two designs differ, so one distance does not isolate what Qloo changed; repeat the pair before calling a difference the data's effect.", "The distance is a heuristic over palettes, type classes, landmark sections and CSS features. It does not measure quality or what people prefer.", "The headline counts devices anchored to what the prediction did not contain. It shows that the data changed the specification, not that the result is better." ], "records": [ { "schemaVersion": "1.0", "kind": "session", "generatedAt": "2026-10-27T14:00:19.645Z", "host": "claude-code", "writtenBy": { "name": "mousa", "version": "0.7.1" }, "medium": "app-ui", "taste": "qloo", "title": "For an audience that loves Haruki Murakami and LCD Soundsystem", "audience": { "references": [ { "name": "Haruki Murakami", "found": true }, { "name": "LCD Soundsystem", "found": true } ], "segments": [ { "name": "runners", "found": false } ] }, "headline": { "value": "10 of 10", "text": "design devices rest on what the model did not predict", "sentence": "10 of 10 devices rest on what the prediction did not contain." }, "numbers": [ { "value": 70, "label": "works measured, 7 of them predicted" }, { "value": 18, "label": "shared qualities, 2 predicted" }, { "value": 24, "label": "pacing, surface and tone tags, 1 predicted" }, { "value": 13, "label": "Qloo requests" } ], "prediction": { "frozenAt": "2026-10-26T21:55:05.492Z", "sha256": "7c125cab23726c125b257ccf80e4b559961ad0c77eea0ffcfb21f56b80b292f5", "sealHolds": true, "summary": "Literate, slightly melancholy urban night-owls in their 30s-40s who treat running as solitary meditation (Murakami's 'What I Talk About When I Talk About Running') and love dance-punk built on long, repetitive, building grooves. They prize vinyl, paperbacks, cats, jazz bars and the quiet strangeness of a city after dark.", "groups": [ { "domain": "brand", "label": "Brands", "quality": false, "entries": [ { "name": "Muji", "measured": false }, { "name": "Uniqlo", "measured": false }, { "name": "Bandcamp", "measured": false }, { "name": "Patagonia", "measured": false }, { "name": "Moleskine", "measured": false }, { "name": "Criterion Collection", "measured": false } ] }, { "domain": "tv_show", "label": "TV", "quality": false, "entries": [ { "name": "Twin Peaks", "measured": false }, { "name": "Atlanta", "measured": false }, { "name": "Severance", "measured": false }, { "name": "Broad City", "measured": true }, { "name": "Midnight Diner", "measured": false } ] }, { "domain": "movie", "label": "Films", "quality": false, "entries": [ { "name": "Lost in Translation", "measured": true }, { "name": "In the Mood for Love", "measured": false }, { "name": "Burning", "measured": false }, { "name": "Drive My Car", "measured": false }, { "name": "Paterson", "measured": false }, { "name": "Perfect Days", "measured": false } ] }, { "domain": "artist", "label": "Music", "quality": false, "entries": [ { "name": "Talking Heads", "measured": false }, { "name": "Radiohead", "measured": false }, { "name": "The Strokes", "measured": false }, { "name": "Arcade Fire", "measured": true }, { "name": "Hot Chip", "measured": false }, { "name": "New Order", "measured": false } ] }, { "domain": "podcast", "label": "Podcasts", "quality": false, "entries": [ { "name": "This American Life", "measured": true }, { "name": "Radiolab", "measured": true }, { "name": "Song Exploder", "measured": true }, { "name": "99% Invisible", "measured": true } ] }, { "domain": "style", "label": "Pacing", "quality": true, "entries": [ { "name": "slow, contemplative pacing", "measured": false }, { "name": "long takes", "measured": false }, { "name": "repetitive structures that build", "measured": false }, { "name": "dreamlike drift", "measured": false } ] }, { "domain": "aesthetic", "label": "Surfaces", "quality": true, "entries": [ { "name": "minimalist", "measured": true }, { "name": "neon at night", "measured": false }, { "name": "analog and vinyl warmth", "measured": false }, { "name": "lo-fi grain", "measured": true, "as": "Lo Fi (pacing)" }, { "name": "urban nocturnal", "measured": false } ] }, { "domain": "tone", "label": "Tone", "quality": true, "entries": [ { "name": "melancholic", "measured": false }, { "name": "wistful", "measured": false }, { "name": "surreal", "measured": true, "as": "Surrealism (meaning quality)" }, { "name": "quietly euphoric", "measured": false }, { "name": "lonely", "measured": false } ] }, { "domain": "qualities", "label": "Shared qualities", "quality": true, "entries": [ { "name": "solitude in the city", "measured": false }, { "name": "repetition as ritual", "measured": false }, { "name": "parallel worlds and doors", "measured": false }, { "name": "nostalgia", "measured": false }, { "name": "dance as release", "measured": false } ] } ], "sketch": { "summary": "A near-black night app with a single moon-yellow accent, typewriter-mono labels and a literary serif, where each run is a numbered 'chapter' in a paperback-style logbook, the next run is shown as a countdown with a pulsing BPM beat, and a well-and-moon motif marks the fountain.", "palette": [ "#0d0f14", "#f2c94c", "#e8e4da", "#3a4a6b", "#d94f3d" ], "fonts": [ "Literata", "Courier Prime" ], "sections": [ "next-run", "rsvp", "run-log", "routes", "streak", "playlist" ], "motifs": [ "two moons", "the fountain as a well", "run log as numbered chapters", "pulsing beat at 120 BPM", "late-night jazz bar" ] } }, "measured": { "counts": { "works": 70, "worksPredicted": 7, "worksNew": 63, "qualities": 18, "qualitiesPredicted": 2, "tags": 24, "tagsPredicted": 1, "predictions": 27, "predictionsMeasured": 7, "requests": 13, "fromCache": 0 }, "qualities": { "look": [ { "name": "Energetic", "kind": "look quality", "mark": "new", "works": [ "The Flaming Lips", "Pixies", "Pavement" ], "domains": [ "music", "TV" ], "lift": 1.65 }, { "name": "Professional", "kind": "look quality", "mark": "new", "works": [ "NPR", "University of Illinois at Springfield", "ShipStation" ], "domains": [ "brand" ], "lift": 2.77 }, { "name": "Minimalist", "kind": "look quality", "mark": "predicted", "works": [ "The Velvet Underground", "Spoon", "NPR" ], "domains": [ "music", "brand" ], "lift": 1.12 }, { "name": "Clean Typography", "kind": "look quality", "mark": "new", "works": [ "MoMA, the Museum of Modern Art", "NPR", "Huffpost" ], "domains": [ "brand" ], "lift": 1.97 }, { "name": "Atmospheric", "kind": "look quality", "mark": "new", "works": [ "Synecdoche, New York", "Adaptation.", "Forever" ], "domains": [ "film", "TV" ], "lift": 1.08 } ], "mood": [ { "name": "Obsessive", "kind": "mood quality", "mark": "new", "works": [ "Being John Malkovich", "The Devil and Daniel Johnston", "City of God" ], "domains": [ "film" ], "lift": 3.01 }, { "name": "Psychological", "kind": "mood quality", "mark": "new", "works": [ "Lady Dynamite", "The Path", "The Devil and Daniel Johnston" ], "domains": [ "TV", "film" ], "lift": 2.58 }, { "name": "Character driven", "kind": "mood quality", "mark": "new", "works": [ "Lady Dynamite", "Portlandia", "Happyish" ], "domains": [ "TV", "film" ], "lift": 1.31 }, { "name": "Nonlinear", "kind": "mood quality", "mark": "new", "works": [ "Lady Dynamite", "Enter the Void" ], "domains": [ "TV", "film" ], "lift": 2.44 }, { "name": "Psychedelic", "kind": "mood quality", "mark": "new", "works": [ "The Flaming Lips", "Animal Collective" ], "domains": [ "music" ], "lift": 2.44 } ], "meaning": [ { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted", "works": [ "The Flaming Lips", "Animal Collective", "Beck" ], "domains": [ "music" ], "lift": 3.26 }, { "name": "Global Citizenship", "kind": "meaning quality", "mark": "new", "works": [ "The New Yorker", "MoMA, the Museum of Modern Art", "Metropolitan Museum of Art" ], "domains": [ "brand" ], "lift": 3.26 }, { "name": "Indie music", "kind": "meaning quality", "mark": "new", "works": [ "Happyish", "Almost Famous" ], "domains": [ "TV", "film" ], "lift": 2.44 }, { "name": "Obsession", "kind": "meaning quality", "mark": "new", "works": [ "Search Party", "Man in the Mirror" ], "domains": [ "TV", "film" ], "lift": 2.4 }, { "name": "Humor", "kind": "meaning quality", "mark": "new", "works": [ "Pavement", "Beck" ], "domains": [ "music" ], "lift": 2.44 } ] }, "tags": { "pacing": [ { "name": "Comic-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Cinematic Intimacy", "kind": "pacing", "mark": "new" }, { "name": "Gritty Realism", "kind": "pacing", "mark": "new" }, { "name": "Pop Culture Savvy", "kind": "pacing", "mark": "new" }, { "name": "Retro-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Visually Enchanting", "kind": "pacing", "mark": "new" } ], "surfaces": [ { "name": "Modern Tailoring", "kind": "surface", "mark": "new" }, { "name": "Parisian", "kind": "surface", "mark": "new" }, { "name": "Artsy", "kind": "surface", "mark": "new" }, { "name": "Trendsetting", "kind": "surface", "mark": "new" }, { "name": "Vintage Inspired", "kind": "surface", "mark": "new" }, { "name": "Artistic", "kind": "surface", "mark": "new" } ], "tone": [ { "name": "minimalism", "kind": "tone", "mark": "new" }, { "name": "Bohemian", "kind": "tone", "mark": "new" }, { "name": "Refined", "kind": "tone", "mark": "new" }, { "name": "Informative", "kind": "tone", "mark": "new" }, { "name": "Curiosity", "kind": "tone", "mark": "new" }, { "name": "quality", "kind": "tone", "mark": "new" } ] }, "worlds": [ { "label": "Brands", "works": [ { "name": "The New Yorker", "kind": "brand", "mark": "new", "tags": [ "Minimalist Typography", "Signature Serif Font", "Classic Illustration Style" ] }, { "name": "Vice", "kind": "brand", "mark": "new", "tags": [ "News & Politics", "Advertising Enabled", "Television broadcasting companies of Canada" ] }, { "name": "MoMA, the Museum of Modern Art", "kind": "brand", "mark": "new", "tags": [ "Minimalist Architecture", "Modernist Design", "Clean Typography" ] }, { "name": "Getty Images", "kind": "brand", "mark": "new", "tags": [ "Mass media companies established in 1995", "Photo agencies", "Entertainment" ] } ] }, { "label": "Brands, lesser known", "works": [ { "name": "LA Kings", "kind": "brand", "mark": "new", "tags": [ "Black And Silver Palette", "Minimalist Logo Design", "Iconic Visual Branding" ] }, { "name": "Antonio Banderas", "kind": "brand", "mark": "new", "tags": [ "Fashion" ] } ] }, { "label": "TV", "works": [ { "name": "Black Mirror", "kind": "TV", "mark": "new", "tags": [ "Bleak minimalism", "Morally ambiguous", "Self destructive" ] }, { "name": "Lady Dynamite", "kind": "TV", "mark": "new", "tags": [ "Flashback driven", "Whimsical", "Humorous" ] }, { "name": "Search Party", "kind": "TV", "mark": "new", "tags": [ "Identity crisis", "Obsession", "Tbs" ] }, { "name": "Forever", "kind": "TV", "mark": "new", "tags": [ "Atmospheric", "Episodic", "Thought provoking" ] } ] }, { "label": "Films", "works": [ { "name": "Synecdoche, New York", "kind": "film", "mark": "new", "tags": [ "Atmospheric", "Art and creativity", "Electronic translator" ] }, { "name": "Being John Malkovich", "kind": "film", "mark": "new", "tags": [ "Surreal", "Humorous", "Obsessive" ] }, { "name": "Adaptation.", "kind": "film", "mark": "new", "tags": [ "Atmospheric", "Charismatic", "Creative writing" ] }, { "name": "Gummo", "kind": "film", "mark": "new", "tags": [ "Ferocious minimalism", "Fragmented", "Transgressive" ] } ] }, { "label": "Films, lesser known", "works": [ { "name": "City of God", "kind": "film", "mark": "new", "tags": [ "Atmospheric", "Kinetic", "Collage like" ] }, { "name": "Control", "kind": "film", "mark": "new", "tags": [ "Clinical", "Gritty", "Cinematic" ] } ] }, { "label": "Music", "works": [ { "name": "The Flaming Lips", "kind": "music", "mark": "new", "tags": [ "Visual", "Energetic", "Synth-Infused" ] }, { "name": "Pixies", "kind": "music", "mark": "new", "tags": [ "Noise Infused", "Intense", "Raw" ] }, { "name": "TV on the Radio", "kind": "music", "mark": "new", "tags": [ "Indie Rock", "Soulful", "Layered" ] }, { "name": "Pavement", "kind": "music", "mark": "new", "tags": [ "Noise Rock", "Energetic", "Post Punk" ] } ] }, { "label": "Podcasts", "works": [ { "name": "Radiolab", "kind": "podcast", "mark": "predicted", "tags": [ "Podcasts", "Natural Sciences", "Society & Culture" ] }, { "name": "Invisibilia", "kind": "podcast", "mark": "new", "tags": [ "Society & Culture", "Podcasts", "Social Sciences" ] }, { "name": "This American Life", "kind": "podcast", "mark": "predicted", "tags": [ "Arts", "Podcasts", "Society & Culture" ] }, { "name": "Hidden Brain", "kind": "podcast", "mark": "new", "tags": [ "Arts", "Podcasts", "Performing Arts" ] } ] } ], "required": [ { "name": "NPR", "kind": "brand", "mark": "new" }, { "name": "Lady Dynamite", "kind": "TV", "mark": "new" }, { "name": "The Flaming Lips", "kind": "music", "mark": "new" }, { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "Obsessive", "kind": "mood quality", "mark": "new" }, { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted" } ], "cautions": [ "Professional is carried mostly by brands (NPR, University of Illinois at Springfield, ShipStation): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "Minimalist is carried mostly by brands (NPR, Huffpost, Breather): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "Clean Typography is carried mostly by brands (MoMA, the Museum of Modern Art, NPR, Huffpost): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "Clean is carried mostly by brands (Evolve Vacation Rental, Breather, ShipStation): it is the design this audience sees every day. Translate the genre of that design, such as broadcast graphics, packaging type or signage, never a brand's logo, mascot, exact colours or products.", "The audience \"runners\" matched no Qloo audience segment, so it did not contribute." ] }, "reading": { "clusters": [ { "id": "c1", "name": "The obsessive archive", "reading": "This audience loves stories about people who keep, replay and re-order their own lives: obsession, flashbacks and nonlinear memory. A run club app for them should keep a meticulous record and let the past come back out of order.", "layers": [ "structure", "interaction" ], "conventions": [ "indie psychological film production design: walls of index cards, labelled tapes and filing boxes kept in obsessive sequence", "flashback cuts: a hard title card with a date before the remembered scene" ], "refs": [ { "name": "Obsessive", "kind": "mood quality", "mark": "new" }, { "name": "Obsession", "kind": "meaning quality", "mark": "new" }, { "name": "Psychological", "kind": "mood quality", "mark": "new" }, { "name": "Nonlinear", "kind": "mood quality", "mark": "new" }, { "name": "Lady Dynamite", "kind": "TV", "mark": "new" }, { "name": "Being John Malkovich", "kind": "film", "mark": "new" }, { "name": "Synecdoche, New York", "kind": "film", "mark": "new" }, { "name": "Search Party", "kind": "TV", "mark": "new" } ], "surprise": true }, { "id": "c2", "name": "Energetic surreal noise", "reading": "The music side measured as loud, raw and surreal rather than cool and nocturnal: noise-rock and psychedelic indie whose visual world is homemade, saturated and playful.", "layers": [ "palette", "motion", "imagery" ], "conventions": [ "photocopied indie-rock gig flyers in two-ink riso: fluorescent pink overprinted on blue, slightly misregistered", "psychedelic stage-light washes: saturated colour fields with hand-cut collage shapes" ], "refs": [ { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted" }, { "name": "The Flaming Lips", "kind": "music", "mark": "new" }, { "name": "Pixies", "kind": "music", "mark": "new" }, { "name": "Pavement", "kind": "music", "mark": "new" }, { "name": "Comic-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Artsy", "kind": "surface", "mark": "new" }, { "name": "Vintage Inspired", "kind": "surface", "mark": "new" } ], "surprise": true }, { "id": "c3", "name": "Public-radio clarity", "reading": "What this audience reads and listens to every day is clear, curious and informative: museum labels, public radio, idea podcasts. The information layer should be calm and exact so the noisy layer can be loud.", "layers": [ "typography", "voice", "layout" ], "conventions": [ "museum wall labels: a small clean grotesque, title, date and medium stacked flush left", "public-radio show rundowns: segment times listed in a plain tidy column" ], "refs": [ { "name": "Clean Typography", "kind": "look quality", "mark": "new" }, { "name": "Professional", "kind": "look quality", "mark": "new" }, { "name": "Minimalist", "kind": "look quality", "mark": "predicted" }, { "name": "NPR", "kind": "brand", "mark": "new" }, { "name": "MoMA, the Museum of Modern Art", "kind": "brand", "mark": "new" }, { "name": "Radiolab", "kind": "podcast", "mark": "predicted" }, { "name": "Curiosity", "kind": "tone", "mark": "new" }, { "name": "Informative", "kind": "tone", "mark": "new" } ], "surprise": true } ], "setAside": [ { "name": "Getty Images", "kind": "brand", "mark": "new", "reason": "A stock photo agency: it measures the media this audience consumes, not a look or value it chooses." }, { "name": "Vice", "kind": "brand", "mark": "new", "reason": "Its tags are corporate facts (news, advertising, Canadian broadcasting), nothing a design can translate." } ], "approach": "A one-page phone app in two registers: a loud riso gig-flyer layer (blue ground, fluorescent pink and mint overprint, a misregistered fountain print) carries the energy and surrealism; a quiet museum-label and radio-rundown layer carries the facts, the RSVP and the numbers. Features follow the obsessive cluster: a wall of every Thursday, a log that resurfaces past runs as flashbacks, an archive of odd things seen on the run, and a pace planner laid out like a rundown." }, "dna": { "thesis": "Night Shift Run Club as a two-ink gig flyer with a museum label inside it: loud riso blue, pink and mint for the energy, a calm clean grotesque for the facts, and an obsessive archive that keeps every Thursday and lets old runs come back out of order.", "devices": [ { "id": "dna1", "layer": "palette", "device": "Two-ink riso night: fluorescent pink and mint overprinted on riso blue", "anchors": [ { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "The Flaming Lips", "kind": "music", "mark": "new" } ], "qualities": [ "Energetic", "Visual" ], "translation": "Energetic is drawn the way photocopied indie gig flyers draw it: a saturated blue ground with fluorescent pink and mint inks that overlap and misregister, plus a cool paper white for the label cards. No brand's colours, the genre's ink set.", "convention": "photocopied indie-rock gig flyers in two-ink riso: fluorescent pink overprinted on blue, slightly misregistered", "tokens": { "colors": [ "#2234a8", "#ff3fa4", "#3ce0a0", "#eef1f4", "#101544" ] }, "surprise": true, "moved": { "colors": [ "#2234a8", "#ff3fa4", "#3ce0a0", "#101544" ], "fonts": [], "ids": [] }, "method": "design-tokens", "why": "The ink set lives in tokens.json and :root custom properties so every surface uses the same riso inks.", "cluster": "Energetic surreal noise", "check": "present" }, { "id": "dna2", "layer": "typography", "device": "Museum wall-label grotesque for every fact", "anchors": [ { "name": "Clean Typography", "kind": "look quality", "mark": "new" }, { "name": "NPR", "kind": "brand", "mark": "new" } ], "qualities": [ "Clean Typography", "Professional" ], "translation": "Clean Typography set as museum wall labels set it: a small, even grotesque, title then date then detail stacked flush left, sentence case, no tracking tricks.", "convention": "museum wall labels: a small clean grotesque, title, date and medium stacked flush left", "tokens": { "fonts": [ "Familjen Grotesk" ], "css": [ "text-align: left" ] }, "surprise": true, "moved": { "colors": [], "fonts": [ "Familjen Grotesk" ], "ids": [] }, "method": "library-font", "why": "Familjen Grotesk is fetched locally and set through a font token for all label and body text.", "cluster": "Public-radio clarity", "check": "present" }, { "id": "dna3", "layer": "typography", "device": "Flyer headline in a heavy poster grotesque", "anchors": [ { "name": "Energetic", "kind": "look quality", "mark": "new" }, { "name": "Pixies", "kind": "music", "mark": "new" } ], "qualities": [ "Energetic", "Raw" ], "translation": "The loud register: one heavy, raw poster grotesque for the club name and the big numbers, set tight like a photocopied gig flyer headline.", "convention": "photocopied indie-rock gig flyers in two-ink riso: fluorescent pink overprinted on blue, slightly misregistered", "tokens": { "fonts": [ "Archivo Black" ], "css": [ "line-height: 0.92" ] }, "surprise": true, "moved": { "colors": [], "fonts": [ "Archivo Black" ], "ids": [] }, "method": "library-font", "why": "Archivo Black is fetched locally and set through a display font token for the name and big numbers.", "cluster": "Energetic surreal noise", "check": "present" }, { "id": "dna4", "layer": "structure", "device": "The Thursday wall: every Thursday of the season as a card in a grid", "anchors": [ { "name": "Obsessive", "kind": "mood quality", "mark": "new" }, { "name": "Obsession", "kind": "meaning quality", "mark": "new" }, { "name": "Search Party", "kind": "TV", "mark": "new" } ], "qualities": [ "Obsessive", "Obsession" ], "translation": "Obsession becomes the reward: not a streak number but an index-card wall of the last 24 Thursdays, each filled in with the route you ran, so gaps and runs are both kept in sequence.", "convention": "indie psychological film production design: walls of index cards, labelled tapes and filing boxes kept in obsessive sequence", "tokens": { "css": [ "grid-template-columns: repeat(6, 1fr)" ], "ids": [ "thursday-wall" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "thursday-wall" ] }, "method": "screen-layout", "why": "A six-column grid of 24 Thursday cards drawn from the stored log.", "cluster": "The obsessive archive", "check": "present" }, { "id": "dna5", "layer": "interaction", "device": "Flashback: an old run cuts back in with a dated title card", "anchors": [ { "name": "Lady Dynamite", "kind": "TV", "mark": "new" }, { "name": "Nonlinear", "kind": "mood quality", "mark": "new" } ], "qualities": [ "Flashback driven", "Nonlinear" ], "translation": "Flashback-driven, nonlinear memory becomes a control that pulls a random past run out of order and shows it behind a hard date card, with your own note and soundtrack line.", "convention": "flashback cuts: a hard title card with a date before the remembered scene", "tokens": { "css": [ "transition: transform 360ms steps(4)" ], "ids": [ "flashback" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "flashback" ] }, "method": "screen-layout", "why": "A button plus a card that flips in with a stepped transform, filled from a random stored run.", "cluster": "The obsessive archive", "check": "present" }, { "id": "dna6", "layer": "structure", "device": "The oddity file: one strange thing seen per run, archived", "anchors": [ { "name": "Surrealism", "kind": "meaning quality", "mark": "predicted" }, { "name": "Being John Malkovich", "kind": "film", "mark": "new" } ], "qualities": [ "Surrealism", "Surreal" ], "translation": "Surrealism becomes a feature: each member files the odd things they notice on the night run, and the app keeps them as a numbered catalogue of small strangenesses.", "tokens": { "ids": [ "oddities" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "oddities" ] }, "method": "screen-layout", "why": "A form and a numbered list kept in localStorage.", "cluster": "The obsessive archive", "check": "present" }, { "id": "dna7", "layer": "interaction", "device": "Pace rundown: plan a finish time like a radio show rundown", "anchors": [ { "name": "Informative", "kind": "tone", "mark": "new" }, { "name": "Radiolab", "kind": "podcast", "mark": "predicted" } ], "qualities": [ "Informative" ], "translation": "Informative becomes a planner: choose 5 or 10 km and a pace, and the run is laid out as a rundown of kilometre marks with clock times from 20:00, in tabular figures.", "convention": "public-radio show rundowns: segment times listed in a plain tidy column", "tokens": { "css": [ "font-variant-numeric: tabular-nums" ], "ids": [ "pace-planner" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "pace-planner" ] }, "method": "screen-layout", "why": "Route and pace inputs that produce a tabular rundown of kilometre clock times.", "cluster": "Public-radio clarity", "check": "present" }, { "id": "dna8", "layer": "motion", "device": "Misregistration kick: the pink layer jumps out of register on each action", "anchors": [ { "name": "Comic-Inspired", "kind": "pacing", "mark": "new" }, { "name": "Energetic", "kind": "look quality", "mark": "new" } ], "qualities": [ "Comic-Inspired", "Energetic" ], "translation": "Comic-inspired pacing becomes a short stepped jolt: when a member commits or logs, the pink ink offsets in three hard steps and snaps back, like a misprinted panel. Runs once, never loops.", "tokens": { "css": [ "animation: misregister 420ms steps(3) 1" ], "keyframes": [ "misregister" ] }, "surprise": true, "method": "css-motion", "why": "A stepped keyframe on the pink ink layer, triggered once per action, with a reduced-motion fallback.", "cluster": "Energetic surreal noise", "check": "present" }, { "id": "dna9", "layer": "imagery", "device": "Two-ink fountain print", "anchors": [ { "name": "Artsy", "kind": "surface", "mark": "new" }, { "name": "Vintage Inspired", "kind": "surface", "mark": "new" } ], "qualities": [ "Artsy", "Vintage Inspired" ], "translation": "An artsy, vintage surface becomes an original drawing of an old park fountain built from flat cut shapes in pink and mint over blue, slightly offset like a riso pull.", "tokens": { "ids": [ "fountain-figure" ], "svg": [ "fountain-print" ] }, "surprise": true, "moved": { "colors": [], "fonts": [], "ids": [ "fountain-figure" ] }, "method": "inline-svg", "why": "A hand-built flat-shape SVG of the fountain with offset pink and mint layers.", "cluster": "Energetic surreal noise", "check": "present" }, { "id": "dna10", "layer": "voice", "device": "Curious rundown voice: facts first, one question after", "anchors": [ { "name": "Curiosity", "kind": "tone", "mark": "new" }, { "name": "Informative", "kind": "tone", "mark": "new" } ], "qualities": [ "Curiosity", "Informative" ], "translation": "Curiosity and an informative tone replace my guessed melancholy: plain facts stated once, then a curious prompt that asks the runner to notice something.", "tokens": { "copy": [ "Saw something odd on the run? File it before it turns ordinary.", "Nothing on the wall yet. It starts with your first Thursday.", "Pull an old Thursday out of order." ] }, "surprise": true, "method": "copy", "why": "The lines go into buttons, empty states and prompts.", "cluster": "Public-radio clarity", "check": "present" } ], "stats": { "devices": 10, "layers": [ "palette", "typography", "structure", "interaction", "motion", "imagery", "voice" ], "surpriseAnchored": 10, "measuredAnchored": 10, "predictionAnchored": 0, "qualityAnchored": 10 } }, "departure": { "sketch": { "palette": [ "#0d0f14", "#f2c94c", "#e8e4da", "#3a4a6b", "#d94f3d" ], "fonts": [ "Literata", "Courier Prime" ], "sections": [ "next-run", "rsvp", "run-log", "routes", "streak", "playlist" ] }, "palette": [ { "color": "#2234a8", "nearest": "#3a4a6b", "delta": 54, "moved": true }, { "color": "#ff3fa4", "nearest": "#d94f3d", "delta": 56, "moved": true }, { "color": "#3ce0a0", "nearest": "#e8e4da", "delta": 59, "moved": true }, { "color": "#eef1f4", "nearest": "#e8e4da", "delta": 8, "moved": false }, { "color": "#101544", "nearest": "#3a4a6b", "delta": 27, "moved": true } ], "fonts": [ { "name": "Familjen Grotesk", "moved": true }, { "name": "Archivo Black", "moved": true } ], "ids": [ "thursday-wall", "flashback", "oddities", "pace-planner", "fountain-figure" ], "threshold": 20 }, "decisions": [ { "question": "tone", "ask": "What emotional tone runs through what they love?", "decision": "The register of the interface copy: buttons, empty states and the next-run card.", "guess": "Wistful, melancholic and quietly literary: short sentences about the city at night, loneliness and the comfort of repetition.", "answer": [ { "label": "Tone", "names": [ "minimalism (new)", "Bohemian (new)", "Refined (new)", "Informative (new)", "Curiosity (new)", "quality (new)" ] } ], "requests": 0 }, { "question": "difference", "ask": "What did I not expect?", "decision": "What the app keeps and rewards: a quiet streak counter, or something closer to an obsessive, nonlinear archive.", "guess": "A quiet streak counter and a chapter-numbered logbook would suit them; the difference will be small.", "answer": [ { "label": "Not predicted", "names": [ "Obsessive", "Psychological", "Global Citizenship", "Energetic", "Professional", "Character driven", "Nonlinear", "Indie music", "Obsession", "Social Commentary", "Morally ambiguous", "Clean Typography" ] }, { "label": "Predicted and measured", "names": [ "Surrealism", "Minimalist", "Radiolab", "This American Life", "99% Invisible", "Arcade Fire", "Song Exploder", "Broad City", "Lost in Translation", "Lo Fi" ] }, { "label": "Predicted, not measured", "names": [ "Muji", "Uniqlo", "Bandcamp", "Patagonia", "Moleskine", "Criterion Collection", "Twin Peaks", "Atlanta", "Severance", "Midnight Diner", "In the Mood for Love", "Burning" ] } ], "requests": 0 } ], "reviews": [ { "round": 1, "summary": "The two-register idea works: a loud riso flyer around a calm museum-label core, and the archive features render with real data. The fountain loses its pink ink to a blend mode, the board header leaves a large empty field, and the tab bar and two-colour headings are generic app habits.", "met": 3, "partly": 1, "missed": 0, "criteria": [ { "id": "r1", "device": "dna1", "look": "The phone screen reads as a two-ink riso flyer: blue ground, fluorescent pink and mint shapes, white label cards; not a near-black page.", "capture": "r1-phone", "verdict": "partly", "observed": "Riso-blue dotted ground, mint mountains and fountain, cool white label cards with pink offset shadows: it reads as a flyer, not a near-black page. But the pink ink layer of the fountain (spray arcs, plume, moon, drops) renders as a dark navy, because mix-blend-mode multiply on blue darkens it, so the second ink is almost missing from the drawing.", "repair": "Remove the multiply blend from the pink group so the fluorescent pink prints over the blue and mint, as an overprint does." }, { "id": "r2", "device": "dna3", "look": "The club name sits in a heavy tight poster grotesque at the top of the phone screen, with facts below in a calm grotesque label.", "capture": "r1-phone", "verdict": "met", "observed": "The club name fills the top in a heavy, tight poster grotesque in mint with a pink offset shadow; the facts below sit in the calm grotesque label style, stacked flush left." }, { "id": "r3", "device": "dna4", "look": "The Thursday wall shows a 6-column grid of dated cards with logged runs filled in pink or mint by route.", "capture": "r1-board-demo", "verdict": "met", "observed": "The Thursday wall is a six-column grid of 24 dated cards; logged runs are filled mint (5k) or pink (10k), empty Thursdays are faded, and the coming Thursday is outlined with the RSVP route; a count line sits below." }, { "id": "r4", "device": "dna7", "look": "The pace rundown lists kilometre marks with clock times in aligned tabular figures.", "capture": "r1-board-demo", "verdict": "met", "observed": "The pace rundown lists km 1-4 and Finish with elapsed times and clock times from 20:06 to 20:30 in aligned tabular figures, the finish row ruled heavier and coloured." } ], "critique": { "generic": [ { "choice": "A plain five-tab bottom bar in white text on navy, the stock app navigation.", "capture": "r1-phone", "action": "replaced" }, { "choice": "Section headings with one word picked out in a second colour (Next run, Your log).", "capture": "r1-board-demo", "action": "replaced" }, { "choice": "White cards with a solid offset colour shadow.", "capture": "r1-board-demo", "action": "kept", "anchor": "Energetic" } ], "fan": { "works": [ "The Flaming Lips", "Pixies", "Being John Malkovich", "Synecdoche, New York", "Radiolab" ], "verdict": "partly", "why": "The saturated two-ink flyer and the obsessive Thursday wall, flashback and oddity file would feel like theirs; but with the pink ink lost from the fountain the print looks flat and computer-made, and the stock tab bar and accent-word headings read as any running app." } }, "houseStyle": 0 }, { "round": 2, "summary": "Both round-1 repairs landed: the pink ink prints in the fountain, the stock tab bar became a dashed tear-off strip and the accent-word headings became whole misregistered headings. The full board capture shows every feature working with data: RSVP, rundown, wall, flashback card, log with bests, and the numbered oddity file.", "met": 4, "partly": 0, "missed": 0, "criteria": [ { "id": "r1", "device": "dna1", "look": "The phone screen reads as a two-ink riso flyer: blue ground, fluorescent pink and mint shapes, white label cards; not a near-black page.", "capture": "r2-phone", "verdict": "met", "observed": "Riso-blue dotted ground; the fountain now prints in two inks, mint basin and hills with fluorescent pink spray arcs, plume, moon and drops slightly off register; white label cards with pink and mint offset shadows; the tear-off tab strip in paper with a pink selected tab. Not a near-black page." }, { "id": "r2", "device": "dna3", "look": "The club name sits in a heavy tight poster grotesque at the top of the phone screen, with facts below in a calm grotesque label.", "capture": "r2-phone", "verdict": "met", "observed": "Night Shift Run Club fills the top in the heavy tight poster grotesque, mint with a pink offset; the facts sit below in the clean grotesque, stacked flush left in the next-run label." }, { "id": "r3", "device": "dna4", "look": "The Thursday wall shows a 6-column grid of dated cards with logged runs filled in pink or mint by route.", "capture": "r2-board-demo-flash", "verdict": "met", "observed": "The Thursday wall is a six-column grid of 24 dated cards, logged runs mint (5k) or pink (10k), empty weeks faded, the coming 29 Oct outlined with the 10k RSVP; '10 of the last 23 Thursdays' counts below." }, { "id": "r4", "device": "dna7", "look": "The pace rundown lists kilometre marks with clock times in aligned tabular figures.", "capture": "r2-board-demo-flash", "verdict": "met", "observed": "The pace rundown lists km 1 to 4 and Finish with elapsed time and clock time from 20:06 to 20:30, digits aligned in tabular figures, the finish row ruled heavier." } ], "critique": { "generic": [ { "choice": "White cards with a solid offset colour shadow.", "capture": "r2-board-demo-flash", "action": "kept", "anchor": "Energetic" }, { "choice": "Plain white form fields with a dark border in the log and oddity forms.", "capture": "r2-phone-demo-tab-odd", "action": "kept", "anchor": "Clean Typography" }, { "choice": "A long run list of ruled rows with a delete link on each.", "capture": "r2-board-demo-flash-full", "action": "kept", "anchor": "Obsessive" } ], "fan": { "works": [ "The Flaming Lips", "Pixies", "Being John Malkovich", "Synecdoche, New York", "NPR" ], "verdict": "yes", "why": "The two-ink gig-flyer print, the loud poster headline and the tear-off strip read like the homemade indie world of the noise and psychedelic bands, while the Thursday wall, out-of-order flashbacks and numbered oddity file are the obsessive, slightly surreal record-keeping of the Kaufman films, held together by calm public-radio clarity." } }, "houseStyle": 0 } ], "captures": [ { "id": "r2-phone", "round": 2, "view": "phone", "width": 390, "height": 844, "label": "phone", "cited": true, "source": ".mousa/captures/r2-phone.png", "file": "assets/captures/a-r2-phone.png" }, { "id": "r2-board-demo-flash", "round": 2, "view": "board", "target": "demo:flash", "width": 1440, "height": 900, "label": "board · demo:flash", "cited": true, "source": ".mousa/captures/r2-board-demo-flash.png", "file": "assets/captures/a-r2-board-demo-flash.png" }, { "id": "r2-phone-demo-tab-wall-flash", "round": 2, "view": "phone", "target": "demo:tab=wall:flash", "width": 390, "height": 844, "label": "phone · demo:tab=wall:flash", "cited": false, "source": ".mousa/captures/r2-phone-demo-tab-wall-flash.png", "file": "assets/captures/a-r2-phone-demo-tab-wall-flash.png" }, { "id": "r2-phone-demo-tab-odd", "round": 2, "view": "phone", "target": "demo:tab=odd", "width": 390, "height": 844, "label": "phone · demo:tab=odd", "cited": false, "source": ".mousa/captures/r2-phone-demo-tab-odd.png", "file": "assets/captures/a-r2-phone-demo-tab-odd.png" }, { "id": "r2-board-demo-flash-full", "round": 2, "view": "board", "target": "demo:flash", "full": true, "width": 1440, "height": 2993, "label": "board · demo:flash · full page", "cited": false, "source": ".mousa/captures/r2-board-demo-flash-full.png", "file": "assets/captures/a-r2-board-demo-flash-full.png" }, { "id": "r2-board", "round": 2, "view": "board", "width": 1440, "height": 900, "label": "board", "cited": false, "source": ".mousa/captures/r2-board.png", "file": "assets/captures/a-r2-board.png" } ], "check": { "score": 1, "system": "css-vars", "present": 10, "devices": [ { "id": "dna1", "status": "present" }, { "id": "dna2", "status": "present" }, { "id": "dna3", "status": "present" }, { "id": "dna4", "status": "present" }, { "id": "dna5", "status": "present" }, { "id": "dna6", "status": "present" }, { "id": "dna7", "status": "present" }, { "id": "dna8", "status": "present" }, { "id": "dna9", "status": "present" }, { "id": "dna10", "status": "present" } ], "style": { "atStart": { "stylesheets": [], "handWritten": 0, "classes": 0 }, "now": { "stylesheets": [ "styles.css" ], "handWritten": 378, "classes": 104 } }, "houseStyle": { "signatures": [ "one neutral sans for headings and text" ], "limit": 2 } }, "houseStyle": { "signatures": [ "one neutral sans for headings and text" ], "count": 1, "of": 12, "limit": 2 }, "limits": [ "Qloo measured the entities, tags and shared qualities named here and how they relate to this audience. Every colour, font, layout, motion and line drawn from them is the agent's interpretation, marked as such.", "A name marked new was not in the prediction the agent froze before any data. Only names are published here: Qloo's ids, affinity scores, popularity and descriptions stay in the project.", "The check shows that the declared tokens are in the files, not that the design is good. The review is the agent's own reading of its captures.", "One session is one sample. It shows where this design's choices came from, not that people prefer it." ] }, { "schemaVersion": "1.0", "kind": "baseline", "generatedAt": "2026-10-27T14:00:19.647Z", "host": "claude-code", "writtenBy": { "name": "mousa", "version": "0.7.1" }, "medium": "app-ui", "taste": "own prediction", "title": "For an audience that loves Haruki Murakami and LCD Soundsystem", "audience": { "references": [ { "name": "Haruki Murakami" }, { "name": "LCD Soundsystem" } ], "segments": [ { "name": "runners" } ] }, "headline": { "value": "9", "text": "design devices rest on the model's own prediction, with no Qloo data", "sentence": "9 devices rest on the prediction alone; no Qloo data was used." }, "numbers": [ { "value": 46, "label": "entries in the prediction" }, { "value": 0, "label": "Qloo requests" }, { "value": 9, "label": "design devices over 8 layers" } ], "prediction": { "frozenAt": "2026-10-26T21:55:10.961Z", "sha256": "bbba1733a13834f8772d21032a2e720ac460e02d7e9decc104659737d02b6fa6", "sealHolds": true, "summary": "Literate, slightly melancholy urban night-owls in their 30s-40s who treat running as solitary meditation (Murakami's 'What I Talk About When I Talk About Running') and love dance-punk built on long, repetitive, building grooves. They prize vinyl, paperbacks, cats, jazz bars and the quiet strangeness of a city after dark.", "groups": [ { "domain": "brand", "label": "Brands", "quality": false, "entries": [ { "name": "Muji" }, { "name": "Uniqlo" }, { "name": "Bandcamp" }, { "name": "Patagonia" }, { "name": "Moleskine" }, { "name": "Criterion Collection" } ] }, { "domain": "tv_show", "label": "TV", "quality": false, "entries": [ { "name": "Twin Peaks" }, { "name": "Atlanta" }, { "name": "Severance" }, { "name": "Broad City" }, { "name": "Midnight Diner" } ] }, { "domain": "movie", "label": "Films", "quality": false, "entries": [ { "name": "Lost in Translation" }, { "name": "In the Mood for Love" }, { "name": "Burning" }, { "name": "Drive My Car" }, { "name": "Paterson" }, { "name": "Perfect Days" } ] }, { "domain": "artist", "label": "Music", "quality": false, "entries": [ { "name": "Talking Heads" }, { "name": "Radiohead" }, { "name": "The Strokes" }, { "name": "Arcade Fire" }, { "name": "Hot Chip" }, { "name": "New Order" } ] }, { "domain": "podcast", "label": "Podcasts", "quality": false, "entries": [ { "name": "This American Life" }, { "name": "Radiolab" }, { "name": "Song Exploder" }, { "name": "99% Invisible" } ] }, { "domain": "style", "label": "Pacing", "quality": true, "entries": [ { "name": "slow, contemplative pacing" }, { "name": "long takes" }, { "name": "repetitive structures that build" }, { "name": "dreamlike drift" } ] }, { "domain": "aesthetic", "label": "Surfaces", "quality": true, "entries": [ { "name": "minimalist" }, { "name": "neon at night" }, { "name": "analog and vinyl warmth" }, { "name": "lo-fi grain" }, { "name": "urban nocturnal" } ] }, { "domain": "tone", "label": "Tone", "quality": true, "entries": [ { "name": "melancholic" }, { "name": "wistful" }, { "name": "surreal" }, { "name": "quietly euphoric" }, { "name": "lonely" } ] }, { "domain": "qualities", "label": "Shared qualities", "quality": true, "entries": [ { "name": "solitude in the city" }, { "name": "repetition as ritual" }, { "name": "parallel worlds and doors" }, { "name": "nostalgia" }, { "name": "dance as release" } ] } ], "sketch": { "summary": "A near-black night app with a single moon-yellow accent, typewriter-mono labels and a literary serif, where each run is a numbered 'chapter' in a paperback-style logbook, the next run is shown as a countdown with a pulsing BPM beat, and a well-and-moon motif marks the fountain.", "palette": [ "#0d0f14", "#f2c94c", "#e8e4da", "#3a4a6b", "#d94f3d" ], "fonts": [ "Literata", "Courier Prime" ], "sections": [ "next-run", "rsvp", "run-log", "routes", "streak", "playlist" ], "motifs": [ "two moons", "the fountain as a well", "run log as numbered chapters", "pulsing beat at 120 BPM", "late-night jazz bar" ] } }, "reading": { "clusters": [ { "id": "c1", "name": "Alone in the lit city", "reading": "These share one person moving through a big city at night, small inside the light of it: the run is a solitary hour that happens to be shared. (My prediction, not measured.)", "layers": [ "palette", "imagery", "voice" ], "conventions": [ "late-night film stills: sodium-orange streetlight against teal-blue shadow, one small figure low in the frame", "a hotel-window view of the city: a dark facade gridded with a few lit windows" ], "refs": [ { "name": "solitude in the city", "kind": "quality", "mark": "own" }, { "name": "Lost in Translation", "kind": "film", "mark": "own" }, { "name": "In the Mood for Love", "kind": "film", "mark": "own" }, { "name": "Drive My Car", "kind": "film", "mark": "own" }, { "name": "urban nocturnal", "kind": "surface", "mark": "own" }, { "name": "neon at night", "kind": "surface", "mark": "own" }, { "name": "melancholic", "kind": "tone", "mark": "own" }, { "name": "lonely", "kind": "tone", "mark": "own" } ] }, { "id": "c2", "name": "The loop that builds", "reading": "The same thing, every week, until it lifts: a groove repeated until it releases, a daily routine that becomes a kind of poem. Thursday after Thursday is the rhythm of the club. (Prediction.)", "layers": [ "structure", "interaction", "motion", "typography" ], "conventions": [ "12-inch dance single sleeves: one heavy grotesk word on a flat field of colour, a tiny block of track times", "step-sequencer grids: a row of sixteen squares that light one by one and loop" ], "refs": [ { "name": "repetition as ritual", "kind": "quality", "mark": "own" }, { "name": "repetitive structures that build", "kind": "pacing", "mark": "own" }, { "name": "dance as release", "kind": "quality", "mark": "own" }, { "name": "quietly euphoric", "kind": "tone", "mark": "own" }, { "name": "Talking Heads", "kind": "music", "mark": "own" }, { "name": "Hot Chip", "kind": "music", "mark": "own" }, { "name": "New Order", "kind": "music", "mark": "own" }, { "name": "Paterson", "kind": "film", "mark": "own" } ] }, { "id": "c3", "name": "Doors to the other side", "reading": "An ordinary place with a door in it that leads somewhere slightly wrong: the park at night as a threshold, a quiet surreal shift rather than horror. (Prediction.)", "layers": [ "interaction", "imagery", "motion" ], "conventions": [ "a corridor of identical doors in one-point perspective, one of them lit", "a well or a hole drawn as a flat dark circle in an otherwise plain scene" ], "refs": [ { "name": "parallel worlds and doors", "kind": "quality", "mark": "own" }, { "name": "Twin Peaks", "kind": "TV", "mark": "own" }, { "name": "Severance", "kind": "TV", "mark": "own" }, { "name": "Burning", "kind": "film", "mark": "own" }, { "name": "surreal", "kind": "tone", "mark": "own" }, { "name": "dreamlike drift", "kind": "pacing", "mark": "own" } ] }, { "id": "c4", "name": "Kept in a plain notebook", "reading": "Unbranded, kept things: a plain notebook, a cassette, a collected edition with a spine number, a man photographing trees each day. Memory is kept by hand, not by a dashboard. (Prediction.)", "layers": [ "typography", "structure", "voice", "palette" ], "conventions": [ "plain ruled notebook pages: faint blue rules, a red margin line, handwritten entries", "collected-edition spines: a small number and a title set in a book serif on a plain band" ], "refs": [ { "name": "nostalgia", "kind": "quality", "mark": "own" }, { "name": "Muji", "kind": "brand", "mark": "own" }, { "name": "Moleskine", "kind": "brand", "mark": "own" }, { "name": "analog and vinyl warmth", "kind": "surface", "mark": "own" }, { "name": "minimalist", "kind": "surface", "mark": "own" }, { "name": "lo-fi grain", "kind": "surface", "mark": "own" }, { "name": "Criterion Collection", "kind": "brand", "mark": "own" }, { "name": "Perfect Days", "kind": "film", "mark": "own" } ] } ], "setAside": [ { "name": "Uniqlo", "kind": "brand", "mark": "own", "reason": "A clothing retailer whose look is generic retail; nothing in it says night, running or the novels beyond what Muji already carries." }, { "name": "Patagonia", "kind": "brand", "mark": "own", "reason": "Outdoor and mountain gear; this club runs a city park at night, so the wilderness register points the wrong way." }, { "name": "Broad City", "kind": "TV", "mark": "own", "reason": "Loud ensemble comedy; its tone works against the solitary, wistful register the rest of the prediction shares." }, { "name": "Bandcamp", "kind": "brand", "mark": "own", "reason": "A music storefront; it is where the records are bought, not a look or a habit of the records themselves." } ], "approach": "A phone app of four screens behind a bottom bar. The night city (c1) is the ground: teal-blue shadow and sodium-orange light, with a drawn skyline of a few lit windows over the fountain. The weekly loop (c2) is the app's spine: Thursdays form a sixteen-step sequencer that lights as a member runs, headings are set as heavy record-sleeve words, and a cadence metronome pulses. The door (c3) is how a member says they are coming: a drawn door that swings open onto light. The notebook (c4) is where runs are remembered: a ruled page with handwritten entries and spine-numbered chapters. The prediction is the only taste input here; nothing was measured." }, "dna": { "thesis": "A Thursday-night run app drawn as the city after dark, where saying you are coming means opening a door, every Thursday lights one step of a sixteen-step loop, and each run is written by hand into a plain ruled notebook (built from my own prediction; no measured taste).", "devices": [ { "id": "dna1", "layer": "palette", "device": "Sodium streetlight on teal-blue shadow, with one cool neon and one plain paper", "anchors": [ { "name": "solitude in the city", "kind": "quality", "mark": "own" }, { "name": "urban nocturnal", "kind": "surface", "mark": "own" }, { "name": "Lost in Translation", "kind": "film", "mark": "own" } ], "qualities": [ "solitude in the city", "urban nocturnal" ], "translation": "Solitude in the city drawn the way late-night film stills draw it: a deep teal-blue shadow ground instead of black, sodium-orange light for what is warm and human (the run, the door, the button), a cool neon mint for the loop that builds, and a cool unbleached paper for the notebook. Two lights, not one accent.", "convention": "late-night film stills: sodium-orange streetlight against teal-blue shadow, one small figure low in the frame", "tokens": { "colors": [ "#12304a", "#0a1d30", "#ff8a3d", "#5fe3c0", "#e9eef2", "#16293b" ] }, "surprise": false, "moved": { "colors": [ "#ff8a3d", "#5fe3c0" ], "fonts": [], "ids": [] }, "method": "design-tokens", "why": "The six colours live in tokens/tokens.json and as custom properties in :root, so every screen draws from the same night palette.", "cluster": "Alone in the lit city", "check": "present" }, { "id": "dna2", "layer": "typography", "device": "A heavy record-sleeve word over a paperback page, with the notebook in handwriting", "anchors": [ { "name": "repetition as ritual", "kind": "quality", "mark": "own" }, { "name": "Hot Chip", "kind": "music", "mark": "own" }, { "name": "nostalgia", "kind": "quality", "mark": "own" } ], "qualities": [ "repetition as ritual", "nostalgia" ], "translation": "Headings are set the way 12-inch dance singles set their one word: a heavy grotesk, tight and large, on a flat field. Running text is set like a translated paperback in an old-style book serif. What the member writes in the log appears in a handwriting face, as in a plain notebook.", "convention": "12-inch dance single sleeves: one heavy grotesk word on a flat field of colour, a tiny block of track times", "tokens": { "fonts": [ "Archivo Black", "EB Garamond", "Caveat" ], "css": [ "letter-spacing: -0.02em" ] }, "surprise": false, "moved": { "colors": [], "fonts": [ "Archivo Black", "EB Garamond", "Caveat" ], "ids": [] }, "method": "library-font", "why": "Archivo Black, EB Garamond and Caveat are fetched as local files and referenced through font tokens; no network fonts are allowed.", "cluster": "The loop that builds", "check": "present" }, { "id": "dna3", "layer": "structure", "device": "Sixteen Thursdays: a step-sequencer that lights one square per run", "anchors": [ { "name": "repetition as ritual", "kind": "quality", "mark": "own" }, { "name": "repetitive structures that build", "kind": "pacing", "mark": "own" }, { "name": "New Order", "kind": "music", "mark": "own" } ], "qualities": [ "repetition as ritual", "repetitive structures that build" ], "translation": "The weekly ritual becomes the app's reward: the last sixteen Thursdays laid out as a 4 x 4 step-sequencer row. Each Thursday a member logged lights its square; four in a row complete a bar, and the streak is counted in Thursdays. The loop builds the way a long groove builds.", "convention": "step-sequencer grids: a row of sixteen squares that light one by one and loop", "tokens": { "ids": [ "loop-grid", "loop-screen", "loop-streak" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "loop-grid", "loop-screen", "loop-streak" ] }, "method": "screen-layout", "why": "The sequencer is a real component on the Loop screen: a 4 x 4 grid of buttons computed from the run log, with a streak count and bar marks.", "cluster": "The loop that builds", "check": "present" }, { "id": "dna4", "layer": "interaction", "device": "The door: saying you are coming opens a drawn door onto light", "anchors": [ { "name": "parallel worlds and doors", "kind": "quality", "mark": "own" }, { "name": "Twin Peaks", "kind": "TV", "mark": "own" }, { "name": "surreal", "kind": "tone", "mark": "own" } ], "qualities": [ "parallel worlds and doors", "surreal" ], "translation": "Parallel worlds and doors becomes the RSVP itself: a plain door drawn in the night scene swings open on its hinge when a member says they are coming, and sodium light spills out. Closing it takes the RSVP back. No curtain, no patterned floor: only a door in an ordinary place.", "convention": "a corridor of identical doors in one-point perspective, one of them lit", "tokens": { "css": [ "transition: transform 1.4s cubic-bezier(.2,.7,.2,1)" ], "ids": [ "door-rsvp" ], "svg": [ "door-art" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "door-rsvp" ] }, "method": "css-motion", "why": "The door is an inline SVG panel rotated on its hinge by a CSS transition when the RSVP state changes; the transition token carries the slow swing.", "cluster": "Doors to the other side", "check": "present" }, { "id": "dna5", "layer": "imagery", "device": "A night skyline whose lit windows are the member's runs, over the park fountain", "anchors": [ { "name": "neon at night", "kind": "surface", "mark": "own" }, { "name": "In the Mood for Love", "kind": "film", "mark": "own" }, { "name": "Drive My Car", "kind": "film", "mark": "own" } ], "qualities": [ "neon at night", "urban nocturnal" ], "translation": "A hotel-window view of the city at night, drawn flat in SVG: dark blocks gridded with windows, a park line and the old fountain small at the bottom. One window lights for each run in the member's notebook, so the city slowly fills up with their own nights.", "convention": "a hotel-window view of the city: a dark facade gridded with a few lit windows", "tokens": { "ids": [ "tonight-hero" ], "svg": [ "night-city" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "tonight-hero" ] }, "method": "inline-svg", "why": "The skyline is an original inline SVG whose window rects are lit by script from the number of logged runs.", "cluster": "Alone in the lit city", "check": "present" }, { "id": "dna6", "layer": "motion", "device": "Slow drifting windows and a beat you can set", "anchors": [ { "name": "dreamlike drift", "kind": "pacing", "mark": "own" }, { "name": "repetitive structures that build", "kind": "pacing", "mark": "own" } ], "qualities": [ "dreamlike drift", "repetitive structures that build" ], "translation": "Dreamlike drift becomes lit windows that fade up and down on a fourteen-second cycle, out of step with each other; the repetitive build becomes a pulse that beats at the cadence the member chooses in the planner. Both pause on a control and stop under reduced motion.", "tokens": { "css": [ "animation: window-drift 14s ease-in-out infinite" ], "keyframes": [ "window-drift", "beat-pulse" ] }, "surprise": false, "method": "css-motion", "why": "Two keyframes: window-drift on lit windows, beat-pulse on the metronome; a pause control and a prefers-reduced-motion rule stop both.", "cluster": "Doors to the other side", "check": "present" }, { "id": "dna7", "layer": "layout", "device": "The notebook: a ruled page with a margin line, each run a numbered chapter", "anchors": [ { "name": "Muji", "kind": "brand", "mark": "own" }, { "name": "Moleskine", "kind": "brand", "mark": "own" }, { "name": "Perfect Days", "kind": "film", "mark": "own" } ], "qualities": [ "nostalgia", "minimalist" ], "translation": "Runs are remembered on a plain ruled notebook page: faint blue rules, a margin line, the date in book serif and the member's note in handwriting. Each entry carries a chapter number on a small spine band, like a collected edition. Unbranded and kept by hand, the way the prediction reads Muji and Moleskine.", "convention": "plain ruled notebook pages: faint blue rules, a red margin line, handwritten entries", "tokens": { "css": [ "background-image: repeating-linear-gradient(transparent 0 31px, #b7c8dc 31px 32px)" ], "ids": [ "notebook", "log-form" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "notebook", "log-form" ] }, "method": "screen-layout", "why": "The Notebook screen is a ruled page made with a repeating gradient, a margin line, and chapter-numbered entries with a form to add one.", "cluster": "Kept in a plain notebook", "check": "present" }, { "id": "dna8", "layer": "interaction", "device": "Plan the run: route, target time, splits and a cadence pulse", "anchors": [ { "name": "dance as release", "kind": "quality", "mark": "own" }, { "name": "Talking Heads", "kind": "music", "mark": "own" }, { "name": "quietly euphoric", "kind": "tone", "mark": "own" } ], "qualities": [ "dance as release", "quietly euphoric" ], "translation": "Dance as release becomes a planner that turns a run into a beat: pick the 5 km or 10 km route and a target time, read the pace and the kilometre splits, then set a cadence and let the app pulse (and click, if wanted) at that tempo.", "tokens": { "ids": [ "planner", "metronome", "split-list" ] }, "surprise": false, "moved": { "colors": [], "fonts": [], "ids": [ "planner", "metronome", "split-list" ] }, "method": "screen-layout", "why": "The planner is a working form on the Plan screen: route and target time in, pace and splits out, and a cadence metronome with start and stop.", "cluster": "The loop that builds", "check": "present" }, { "id": "dna9", "layer": "voice", "device": "Short, wistful lines that state the fact and then step back", "anchors": [ { "name": "melancholic", "kind": "tone", "mark": "own" }, { "name": "lonely", "kind": "tone", "mark": "own" }, { "name": "quietly euphoric", "kind": "tone", "mark": "own" } ], "qualities": [ "melancholic", "quietly euphoric" ], "translation": "A melancholic, quietly euphoric register: plain sentences, the fact first, then one small turn. The voice never adds a fact: only Thursday, 20:00, the old fountain, 5 km and 10 km.", "tokens": { "copy": [ "Thursday, 20:00. The old fountain, in the park.", "Same loop. A different night.", "Where did your mind go tonight?" ] }, "surprise": false, "method": "copy", "why": "The lines go into titles, empty states and prompts across the screens, keeping only the brief's facts.", "cluster": "Alone in the lit city", "check": "present" } ], "stats": { "devices": 9, "layers": [ "palette", "typography", "structure", "interaction", "imagery", "motion", "layout", "voice" ], "surpriseAnchored": 0, "measuredAnchored": 0, "predictionAnchored": 9, "qualityAnchored": 8 } }, "departure": { "sketch": { "palette": [ "#0d0f14", "#f2c94c", "#e8e4da", "#3a4a6b", "#d94f3d" ], "fonts": [ "Literata", "Courier Prime" ], "sections": [ "next-run", "rsvp", "run-log", "routes", "streak", "playlist" ] }, "palette": [ { "color": "#12304a", "nearest": "#3a4a6b", "delta": 13, "moved": false }, { "color": "#0a1d30", "nearest": "#0d0f14", "delta": 13, "moved": false }, { "color": "#ff8a3d", "nearest": "#d94f3d", "delta": 29, "moved": true }, { "color": "#5fe3c0", "nearest": "#e8e4da", "delta": 45, "moved": true }, { "color": "#e9eef2", "nearest": "#e8e4da", "delta": 9, "moved": false }, { "color": "#16293b", "nearest": "#0d0f14", "delta": 16, "moved": false } ], "fonts": [ { "name": "Archivo Black", "moved": true }, { "name": "EB Garamond", "moved": true }, { "name": "Caveat", "moved": true } ], "ids": [ "loop-grid", "loop-screen", "loop-streak", "door-rsvp", "tonight-hero", "notebook", "log-form", "planner", "metronome", "split-list" ], "threshold": 20 }, "reviews": [ { "round": 1, "summary": "The night city, the door and the sixteen-step loop read clearly; the functional checks passed 34 of 34 in r1-board-full. The fixed tab band covers content in tall views, the notebook text does not sit on its rules, and the board hides the handwriting.", "met": 2, "partly": 3, "missed": 0, "criteria": [ { "id": "r1", "device": "dna5", "look": "On the Tonight screen the skyline SVG fills the top of the phone: dark teal-blue blocks with a grid of windows, some lit orange, and the small fountain at the bottom, above the next-run facts.", "capture": "r1-phone", "verdict": "met", "observed": "The skyline fills the top 340 px of the phone: dark teal-blue blocks gridded with windows, a few faint orange ones, the fountain drawn in mint at the bottom with a lamp and a small orange runner, above 'Thursday' and the next-run facts." }, { "id": "r2", "device": "dna4", "look": "After tapping the RSVP, the door in the scene stands visibly open (rotated on its hinge) with orange light behind it, and the button text changes to say the member is coming.", "capture": "r1-phone-sample-full", "verdict": "partly", "observed": "With the member coming, the door stands open on its hinge with orange light behind it, but the fixed tab band sits across the door card in the full-height capture, hiding the 'You're coming' title; only the sub-line and the status line below are readable.", "repair": "Make the tab band sticky at the bottom of the app instead of fixed so it never covers content in a tall view, and tighten the Tonight stack (the date line no longer repeats 'Thursday') so the door sits higher." }, { "id": "r3", "device": "dna3", "look": "The Loop screen shows a 4 x 4 grid of squares with lit mint squares for Thursdays run and dark ones for Thursdays missed, plus a streak number set in the heavy grotesk.", "capture": "r1-phone-sample-loop", "verdict": "met", "observed": "A 4 x 4 grid of square steps, thirteen lit mint and three dark, dated by Thursday; bar marks on the right with the last bar closed in orange; streak '5' set huge in the heavy grotesk." }, { "id": "r4", "device": "dna7", "look": "The Notebook screen reads as a ruled paper page on the night ground: blue rules, a margin line, entries with a chapter number and a handwritten note.", "capture": "r1-phone-sample-notebook-full", "verdict": "partly", "observed": "The notebook reads as a ruled paper page with a red margin line, dark spine bands numbered by chapter and handwritten notes, but the text drifts off the rules (rules strike through lines because the form and the tear buttons break the 32 px rhythm) and the fixed tab band lies across the page.", "repair": "Put the rules only behind the entries, keep every entry line on the 32 px rhythm, take the tear button out of the flow (absolute, top right), and make the tab band sticky." }, { "id": "r5", "device": "dna2", "look": "On the board, each screen's heading is a heavy grotesk word, running text is a book serif, and notebook notes are handwriting; no screen uses one neutral sans for everything.", "capture": "r1-board-sample", "verdict": "partly", "observed": "On the board each heading is a heavy grotesk word (The plan, Notebook, The loop, Thursday) and running text is the book serif, but no handwriting is visible: the notebook column shows only the empty form before the cut.", "repair": "Fold the new-page form behind a 'Write a new page' control when the notebook has entries, so the latest handwritten chapters open the Notebook screen." } ], "critique": { "generic": [ { "choice": "The feature-test page captured this round (r1-board-full) is set in one neutral system sans for its heading and its rows.", "capture": "r1-board-full", "action": "replaced", "signature": "one neutral sans for headings and text" }, { "choice": "The four stats in a 2 x 2 box grid with big numbers and small grey captions: a fitness-dashboard tile pattern any app has.", "capture": "r1-board-sample", "action": "replaced" }, { "choice": "The 5 km / 10 km choice as a plain two-segment toggle, identical to any settings control.", "capture": "r1-phone", "action": "replaced" } ], "fan": { "works": [ "Lost in Translation", "In the Mood for Love", "Twin Peaks", "Talking Heads", "Perfect Days" ], "verdict": "partly", "why": "The lonely lit city over the fountain, the door that opens onto light and the handwritten notebook feel like theirs; the stat tiles and the stock toggle still read like a generic running app, and the date said three times in a row reads like an event card." } }, "houseStyle": 1 }, { "round": 2, "summary": "All five criteria are met on round 2 captures, and the feature test (r2-board-full) passed 37 of 37 with no script errors. The route choices are now drawn loops and the totals a track list; the tab band moved to the top so it never covers content.", "met": 5, "partly": 0, "missed": 0, "criteria": [ { "id": "r1", "device": "dna5", "look": "On the Tonight screen the skyline SVG fills the top of the phone: dark teal-blue blocks with a grid of windows, some lit orange, and the small fountain at the bottom, above the next-run facts.", "capture": "r2-phone-sample-full", "verdict": "met", "observed": "Under the tab band the skyline fills the top of the phone: teal-blue blocks gridded with windows, fourteen of them lit orange for the sample's fourteen runs, the mint fountain, the lamp and the small orange runner low in the frame, above 'Thursday' and '29 October, 20:00'." }, { "id": "r2", "device": "dna4", "look": "After tapping the RSVP, the door in the scene stands visibly open (rotated on its hinge) with orange light behind it, and the button text changes to say the member is coming.", "capture": "r2-phone-sample-full", "verdict": "met", "observed": "The door is swung open on its left hinge with orange light filling the frame behind it; the card reads 'You're coming' and 'The door stays open. Tap again if you can't make it.', and nothing covers it now that the tab band sits at the top." }, { "id": "r3", "device": "dna3", "look": "The Loop screen shows a 4 x 4 grid of squares with lit mint squares for Thursdays run and dark ones for Thursdays missed, plus a streak number set in the heavy grotesk.", "capture": "r2-phone-sample-loop-full", "verdict": "met", "observed": "A 4 x 4 grid of dated squares, thirteen lit mint and three dark, one orange dot for a non-Thursday run, bar marks on the right with the last bar closed in orange, streak '5' in the heavy grotesk; the totals below are now a track list (A1, A2, B1, B2) on a mint sleeve." }, { "id": "r4", "device": "dna7", "look": "The Notebook screen reads as a ruled paper page on the night ground: blue rules, a margin line, entries with a chapter number and a handwritten note.", "capture": "r2-phone-sample-notebook", "verdict": "met", "observed": "Paper page with a red margin line; each chapter has a dark spine band (ch. 14, ch. 13), the date in book serif, the stats line and the handwritten note, and every line now sits on its blue rule; 'Tear out' sits top right outside the rhythm." }, { "id": "r5", "device": "dna2", "look": "On the board, each screen's heading is a heavy grotesk word, running text is a book serif, and notebook notes are handwriting; no screen uses one neutral sans for everything.", "capture": "r2-board-sample", "verdict": "met", "observed": "Four screens side by side: headings 'Thursday', 'The plan', 'Notebook', 'The loop' in the heavy grotesk, body text in the book serif, and the notebook column now opens on handwritten chapters because the new-page form is folded." } ], "critique": { "generic": [ { "choice": "The sample notice as a flat full-width mint strip, the same notification bar any app shows.", "capture": "r2-board-sample", "action": "replaced" }, { "choice": "The kilometre splits as a grid of small tiles with a coloured top edge.", "capture": "r2-board-sample", "action": "kept", "anchor": "repetitive structures that build" }, { "choice": "A huge numeral beside a short caption for the streak, a common stat-hero pattern.", "capture": "r2-phone-sample-loop-full", "action": "kept", "anchor": "repetition as ritual" } ], "fan": { "works": [ "Lost in Translation", "In the Mood for Love", "Twin Peaks", "Talking Heads", "Perfect Days" ], "verdict": "partly", "why": "The lonely lit city over the fountain, the door that opens onto light and the handwritten, spine-numbered notebook would feel like theirs, and the drawn route loops and back-of-sleeve track list help; the mint loop grid still reads more like a habit tracker than a groove, and the large flat blocks of mint are louder than the rest of the quiet night." } }, "houseStyle": 0 } ], "captures": [ { "id": "r2-board-full", "round": 2, "view": "board", "full": true, "width": 1440, "height": 1027, "label": "board · full page", "cited": false, "source": ".mousa/captures/r2-board-full.png", "file": "assets/captures/b-r2-board-full.png" }, { "id": "r2-phone-sample-full", "round": 2, "view": "phone", "target": "sample", "full": true, "width": 390, "height": 1253, "label": "phone · sample · full page", "cited": true, "source": ".mousa/captures/r2-phone-sample-full.png", "file": "assets/captures/b-r2-phone-sample-full.png" }, { "id": "r2-phone-sample-notebook", "round": 2, "view": "phone", "target": "sample-notebook", "width": 390, "height": 844, "label": "phone · sample-notebook", "cited": true, "source": ".mousa/captures/r2-phone-sample-notebook.png", "file": "assets/captures/b-r2-phone-sample-notebook.png" }, { "id": "r2-phone-sample-loop-full", "round": 2, "view": "phone", "target": "sample-loop", "full": true, "width": 390, "height": 1332, "label": "phone · sample-loop · full page", "cited": true, "source": ".mousa/captures/r2-phone-sample-loop-full.png", "file": "assets/captures/b-r2-phone-sample-loop-full.png" }, { "id": "r2-board-sample", "round": 2, "view": "board", "target": "sample", "width": 1440, "height": 900, "label": "board · sample", "cited": true, "source": ".mousa/captures/r2-board-sample.png", "file": "assets/captures/b-r2-board-sample.png" } ], "check": { "score": 1, "system": "css-vars", "present": 9, "devices": [ { "id": "dna1", "status": "present" }, { "id": "dna2", "status": "present" }, { "id": "dna3", "status": "present" }, { "id": "dna4", "status": "present" }, { "id": "dna5", "status": "present" }, { "id": "dna6", "status": "present" }, { "id": "dna7", "status": "present" }, { "id": "dna8", "status": "present" }, { "id": "dna9", "status": "present" } ], "style": { "atStart": { "stylesheets": [], "handWritten": 0, "classes": 0 }, "now": { "stylesheets": [ "styles.css" ], "handWritten": 627, "classes": 132 } }, "houseStyle": { "signatures": [], "limit": 2 } }, "houseStyle": { "signatures": [], "count": 0, "of": 12, "limit": 2 }, "limits": [ "No Qloo data was used: the taste input is the agent's own prediction, frozen before the design began.", "The check shows that the declared tokens are in the files, not that the design is good. The review is the agent's own reading of its captures.", "One session is one sample. It shows where this design's choices came from, not that people prefer it." ] } ], "fonts": [ { "family": "Fraunces", "license": "OFL-1.1" }, { "family": "Inter", "license": "OFL-1.1" }, { "family": "DM Mono", "license": "OFL-1.1" }, { "family": "Familjen Grotesk", "license": "OFL-1.1" }, { "family": "Archivo Black", "license": "OFL-1.1" }, { "family": "EB Garamond", "license": "OFL-1.1" }, { "family": "Caveat", "license": "OFL-1.1" } ] }