One arm of a comparison · Without Qloo

Night Shift Run Club, a phone app, with Qloo and without: Claude Code: Without Qloo

Host: Claude Code 2.1.284
Model: claude-opus-5-5[1m]
Moûsa: 0.7.1
Started: 26 October 2026
Time: 16.4 minutes, 24 turns
Qloo requests: 13
Pictures: none: imagery drawn in SVG or CSS

Play it

The design's own files as the session left them, running sandboxed on a separate origin.

Without Qloo Open full screen

design devices rest on the model's own prediction, with no Qloo data

The audience, as the person named itHaruki MurakamiLCD Soundsystem

46entries in the prediction

0Qloo requests

9design devices over 8 layers

The result

The captures of round 2, the last the agent reviewed: 5 criteria met, 0 partly, 0 missed.

board · full page, round 2 — board · full page · round 2

phone · sample · full page, round 2 — phone · sample · full page · round 2 · judged in the review

phone · sample-notebook, round 2 — phone · sample-notebook · round 2 · judged in the review

phone · sample-loop · full page, round 2 — phone · sample-loop · full page · round 2 · judged in the review

board · sample, round 2 — board · sample · round 2 · judged in the review

Before any data: the model's own prediction

Frozen before the design began. Without Qloo it is the whole taste input.

The design the model would make from it alone

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.

#0d0f14#f2c94c#e8e4da#3a4a6b#d94f3d

Type: Literata and Courier Prime

#next-run#rsvp#run-log#routes#streak#playlist

two moons
the fountain as a well
run log as numbered chapters
pulsing beat at 120 BPM
late-night jazz bar

The audience it expected

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.

Pacing

slow, contemplative pacinglong takesrepetitive structures that builddreamlike drift

Surfaces

minimalistneon at nightanalog and vinyl warmthlo-fi grainurban nocturnal

Tone

melancholicwistfulsurrealquietly euphoriclonely

Shared qualities

solitude in the cityrepetition as ritualparallel worlds and doorsnostalgiadance as release

The works it expected them to love

Brands

MujiUniqloBandcampPatagoniaMoleskineCriterion Collection

Twin PeaksAtlantaSeveranceBroad CityMidnight Diner

Films

Lost in TranslationIn the Mood for LoveBurningDrive My CarPatersonPerfect Days

Music

Talking HeadsRadioheadThe StrokesArcade FireHot ChipNew Order

Podcasts

This American LifeRadiolabSong Exploder99% Invisible

Sealed at the freeze: SHA-256 bbba1733a13834f8772d21032a2e720ac460e02d7e9decc104659737d02b6fa6. The prediction shown here still matches it.

How the agent read it

Before deciding anything, the agent grouped what belongs together. Each cluster rests on a quality; the works are its evidence.

c1 · carries palette, imagery and voice

Alone in the lit city

InterpretationThese 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.)

How these works look, as a genre

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

solitude in the city quality · own predictionLost in Translation film · own predictionIn the Mood for Love film · own predictionDrive My Car film · own predictionurban nocturnal surface · own predictionneon at night surface · own predictionmelancholic tone · own predictionlonely tone · own prediction

c2 · carries structure, interaction, motion and typography

The loop that builds

InterpretationThe 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.)

How these works look, as a genre

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

repetition as ritual quality · own predictionrepetitive structures that build pacing · own predictiondance as release quality · own predictionquietly euphoric tone · own predictionTalking Heads music · own predictionHot Chip music · own predictionNew Order music · own predictionPaterson film · own prediction

c3 · carries interaction, imagery and motion

Doors to the other side

InterpretationAn 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.)

How these works look, as a genre

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

parallel worlds and doors quality · own predictionTwin Peaks TV · own predictionSeverance TV · own predictionBurning film · own predictionsurreal tone · own predictiondreamlike drift pacing · own prediction

c4 · carries typography, structure, voice and palette

Kept in a plain notebook

InterpretationUnbranded, 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.)

How these works look, as a genre

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

nostalgia quality · own predictionMuji brand · own predictionMoleskine brand · own predictionanalog and vinyl warmth surface · own predictionminimalist surface · own predictionlo-fi grain surface · own predictionCriterion Collection brand · own predictionPerfect Days film · own prediction

How the medium carries itA 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.

Set aside as noise

Uniqlo brand · own prediction A clothing retailer whose look is generic retail; nothing in it says night, running or the novels beyond what Muji already carries.
Patagonia brand · own prediction Outdoor and mountain gear; this club runs a city park at night, so the wilderness register points the wrong way.
Broad City TV · own prediction Loud ensemble comedy; its tone works against the solitary, wistful register the rest of the prediction shares.
Bandcamp brand · own prediction A music storefront; it is where the records are bought, not a look or a habit of the records themselves.

The Design DNA

9 binding devices with literal tokens the check looks for in the files. Each rests on the model's own prediction.

palette · dna1In the files

Sodium streetlight on teal-blue shadow, with one cool neon and one plain paper

Anchored to

solitude in the city quality · own predictionurban nocturnal surface · own predictionLost in Translation film · own prediction

Translates: solitude in the city · urban nocturnal

Through the convention: late-night film stills: sodium-orange streetlight against teal-blue shadow, one small figure low in the frame

InterpretationSolitude 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.

#12304a#0a1d30#ff8a3d#5fe3c0#e9eef2#16293b

Made with design-tokens for “Alone in the lit city”: The six colours live in tokens/tokens.json and as custom properties in :root, so every screen draws from the same night palette.

Away from the sketch: 2 colours

typography · dna2In the files

A heavy record-sleeve word over a paperback page, with the notebook in handwriting

Anchored to

repetition as ritual quality · own predictionHot Chip music · own predictionnostalgia quality · own prediction

Translates: repetition as ritual · nostalgia

Through the convention: 12-inch dance single sleeves: one heavy grotesk word on a flat field of colour, a tiny block of track times

InterpretationHeadings 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.

Thursday, 20:00. The old fountain, in the park.

Archivo Black

Thursday, 20:00. The old fountain, in the park.

EB Garamond

Thursday, 20:00. The old fountain, in the park.

Caveat

letter-spacing: -0.02em

Made with library-font for “The loop that builds”: Archivo Black, EB Garamond and Caveat are fetched as local files and referenced through font tokens; no network fonts are allowed.

Away from the sketch: 3 type families

imagery · dna5In the files

A night skyline whose lit windows are the member's runs, over the park fountain

Anchored to

neon at night surface · own predictionIn the Mood for Love film · own predictionDrive My Car film · own prediction

Translates: neon at night · urban nocturnal

Through the convention: a hotel-window view of the city: a dark facade gridded with a few lit windows

InterpretationA 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.

#tonight-herosvg#night-city

Made with inline-svg for “Alone in the lit city”: The skyline is an original inline SVG whose window rects are lit by script from the number of logged runs.

Away from the sketch: 1 new part

motion · dna6In the files

Slow drifting windows and a beat you can set

Anchored to

dreamlike drift pacing · own predictionrepetitive structures that build pacing · own prediction

Translates: dreamlike drift · repetitive structures that build

InterpretationDreamlike 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.

@keyframes window-drift@keyframes beat-pulseanimation: window-drift 14s ease-in-out infinite

Made with css-motion for “Doors to the other side”: Two keyframes: window-drift on lit windows, beat-pulse on the metronome; a pause control and a prefers-reduced-motion rule stop both.

voice · dna9In the files

Short, wistful lines that state the fact and then step back

Anchored to

melancholic tone · own predictionlonely tone · own predictionquietly euphoric tone · own prediction

Translates: melancholic · quietly euphoric

InterpretationA 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.

Thursday, 20:00. The old fountain, in the park.

Same loop. A different night.

Where did your mind go tonight?

Made with copy for “Alone in the lit city”: The lines go into titles, empty states and prompts across the screens, keeping only the brief's facts.

layout · dna7In the files

The notebook: a ruled page with a margin line, each run a numbered chapter

Anchored to

Muji brand · own predictionMoleskine brand · own predictionPerfect Days film · own prediction

Translates: nostalgia · minimalist

Through the convention: plain ruled notebook pages: faint blue rules, a red margin line, handwritten entries

InterpretationRuns 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.

#notebook#log-formbackground-image: repeating-linear-gradient(transparent 0 31px, #b7c8dc 31px 32px)

Made with screen-layout for “Kept in a plain notebook”: 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.

Away from the sketch: 2 new parts

structure · dna3In the files

Sixteen Thursdays: a step-sequencer that lights one square per run

Anchored to

repetition as ritual quality · own predictionrepetitive structures that build pacing · own predictionNew Order music · own prediction

Translates: repetition as ritual · repetitive structures that build

Through the convention: step-sequencer grids: a row of sixteen squares that light one by one and loop

InterpretationThe 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.

#loop-grid#loop-screen#loop-streak

Made with screen-layout for “The loop that builds”: 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.

Away from the sketch: 3 new parts

interaction · dna4In the files

The door: saying you are coming opens a drawn door onto light

Anchored to

parallel worlds and doors quality · own predictionTwin Peaks TV · own predictionsurreal tone · own prediction

Translates: parallel worlds and doors · surreal

Through the convention: a corridor of identical doors in one-point perspective, one of them lit

InterpretationParallel 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.

#door-rsvpsvg#door-arttransition: transform 1.4s cubic-bezier(.2,.7,.2,1)

Made with css-motion for “Doors to the other side”: 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.

Away from the sketch: 1 new part

interaction · dna8In the files

Plan the run: route, target time, splits and a cadence pulse

Anchored to

dance as release quality · own predictionTalking Heads music · own predictionquietly euphoric tone · own prediction

Translates: dance as release · quietly euphoric

InterpretationDance 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.

#planner#metronome#split-list

Made with screen-layout for “The loop that builds”: 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.

Away from the sketch: 3 new parts

Away from the sketch

The design's palette, type and parts against the sketch frozen with the prediction. A colour counts as moved at a CIE76 difference of 20 or more from every sketch colour.

Sketch palette

#0d0f14#f2c94c#e8e4da#3a4a6b#d94f3d

Design palette: 2 of 6 moved

#12304aΔE 13 from #3a4a6b#0a1d30ΔE 13 from #0d0f14#ff8a3dΔE 29 from #d94f3d#5fe3c0ΔE 45 from #e8e4da#e9eef2ΔE 9 from #e8e4da#16293bΔE 16 from #0d0f14

Type

Sketch: Literata and Courier Prime. Design: Archivo Black (new), EB Garamond (new), Caveat (new).

Parts

Sketch sections: #next-run #rsvp #run-log #routes #streak #playlist

New in the design

#loop-grid#loop-screen#loop-streak#door-rsvp#tonight-hero#notebook#log-form#planner#metronome#split-list

The review

The agent judged each criterion of its plan on the captures it took, then repaired what fell short. The verdicts are its own.

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

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.

Observed in r2-phone-sample-fullUnder 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'.

met

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.

Observed in r2-phone-sample-fullThe 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.

met

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.

Observed in r2-phone-sample-loop-fullA 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.

met

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.

Observed in r2-phone-sample-notebookPaper 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.

met

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.

Observed in r2-board-sampleFour 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.

Its three most generic choices, by its own eye

replaced The sample notice as a flat full-width mint strip, the same notification bar any app shows.
kept The kilometre splits as a grid of small tiles with a coloured top edge. kept for repetitive structures that build
kept A huge numeral beside a short caption for the streak, a common stat-hero pattern. kept for repetition as ritual

Would someone who loves Lost in Translation, In the Mood for Love, Twin Peaks, Talking Heads and Perfect Days take it for theirs?partly: 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.

What earlier rounds found short, and the repairs

Round 1: 2 met, 3 partly, 0 missed. 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.

partly

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.

Observed in r1-phone-sample-fullWith 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.

RepairMake 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.

partly

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.

Observed in r1-phone-sample-notebook-fullThe 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.

RepairPut 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.

partly

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.

Observed in r1-board-sampleOn 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.

RepairFold 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.

The check

Whether each device's declared tokens are in the project's files, through its own design system, and how much of the look models default to the page kept.

1.00 conformance · 9 of 9 devices in the files · design system: css-vars

dna1 presentdna2 presentdna3 presentdna4 presentdna5 presentdna6 presentdna7 presentdna8 presentdna9 present

Styling at the start: 0 hand-written declarations and 0 classes; now 627 and 132.

The look models default to: 0 of its 12 signatures on the page; at most 2 may stay.

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.

Back to the comparison