NUX

Curation as the product, not another algorithm wall

Every streaming UI is an infinite algorithmic wall, and the scrolling it forces is the real product. Benchmarking Netflix, Disney+, MUBI and Criterion exposed the unoccupied space: no platform’s atomic unit is a curated narrative theme. NUX makes finite, editor-curated clusters the whole point — Criterion × MUBI × Apple TV.

Every decision serves that thesis. Editorial anatomy appears wherever a collection does — amber eyebrow, serif headline, two-sentence dek, curator byline with a date — with finite counts, never “More like this ∞” — “Five Films on Grief” began as this principle’s example and now ships as a live collection. One filled amber CTA per region, rationed like ink to ≤10% of any screen, so the single Play always wins the glance.

“Projection Still Life” — one symbolic object, one amber key light, 35mm grain. The imagery is the color system: the UI stays warm near-black so the art carries the screen

The finite-count promise, kept — Five Films on Grief, live in the app

One token set, two variable modes — wireframes and hi-fi are the same screens

The core engineering decision: a single semantic token set (surfaces, text, borders, actions, icons) carries two Figma variable modes. Wireframe is a greyscale HIG ramp in Plus Jakarta Sans + Inter; Hi-Fi is a warm ink ladder (#070606→#332E27) with paper text tones at 17.0:1 / 8.4:1 / 5.2:1, amber #C8922A accents using dark-on-amber labels (7.1:1 — white fails at 2.4:1), hairlines instead of shadows and 2.5% film grain. 35 wireframe + 46 hi-fi screens, audited to 0 hardcoded values and 0 unstyled text layers.

Type does the editorial work: Fraunces names content, Inter handles anything functional, Newsreader carries long-reads, at a display-to-metadata ratio of at least 5×. A 50+ component library per platform covers every interactive state (default/hover/pressed/focus/disabled), plus selective iOS 26 glass tab bars and a tvOS focus model — white ring and lift, one focus per screen. Every platform has its player, and both fidelity modes run as fully clickable prototypes.

Figma hi-fi Desktop Home — the same token system the app ships on

A placeholder-free catalog of real British cinema with a generated-imagery identity

The catalog is real British cinema — 72 films, each with its poster and landscape stills (The Third Man, Lawrence of Arabia, The Red Shoes, Black Narcissus…), 21 of them designed end-to-end in the hi-fi prototype, with period cast portraits and strict portrait-in-portrait, still-in-landscape discipline. For surfaces with no real art — genres, fictional titles, onboarding — I designed “Projection Still Life”: one symbolic object per genre, a single amber key light, 35mm grain, photographic and deliberately not 3D so it never fights the editorial ink language.

AI curation as a conversation — grounded so it cannot hallucinate a title

If curation is the product, the next move is to let the viewer ask for a mood in plain language and have the house answer. The Curator is a concierge in the live app, reachable from two entry points — a floating button on every screen and a “✦ Ask the Curator” pill beside the Browse search. Type “a tense noir about betrayal” or tap a mood chip, and it replies in NUX’s editorial voice with a short note plus real film cards. The conversation continues — “something shorter?”, “more like the noir one” — on the same surface.

It can’t invent a title: the whole catalog fits in one prompt (no RAG), the model returns only film ids, and the server validates them against the real catalog before anything renders. A provider adapter calls Gemini 2.0 Flash and fails over to Groq (Llama 3.3) — both free-tier — with keys server-side, rate-limited and input-capped. The same engine generates themed editorial rails (“Islands of the Mind”, “Portraits of Obsession”), cached and refreshed weekly — and subscribers get a single push notification when the new programme lands. Built test-first: provider failover, id-validation and a prompt-injection guard all covered.

A playable promise — the games in the catalog are real

The catalog isn’t only films — it spans documentaries, games and courses, so I made the games real. Neon Drift, the one game in the library, isn’t a still: press Play on its title page and a small synthwave canvas game opens — pilot a salvaged starfighter through the neon ruins, reflex-driven, inside its own focus-trapped, reduced-motion-aware overlay. The content types aren’t a façade; the promise is kept in code.

Neon Drift — a playable canvas game that opens from its title page, with its own synthwave identity

Inside the run: gates drift in, one clip and you’re scrap

A responsive React build, live on my own infrastructure

The full responsive app is live — Home, Browse, film pages with anchored sections, critic pull-quotes and Downloads that really do store on device, a keyboard-driven Player with a “?” cheat sheet, editorial collections, My List + Continue Watching, auth, Profile, editable taste and onboarding — React + Vite on the exported token system, real catalog data, a poster→hero View-Transition morph, a poster-thumbnail hero pager, hover crossfades into film stills, scroll-driven editorial reveals and a floating glass tab bar on mobile. It’s built to production standard: WCAG-AA accessibility (focus management, reduced-motion, screen-reader live regions, a screen-reader-grade Curator overlay), an axe gate in the test suite, a backend suite and CI that builds and smoke-tests the real Docker image, and a hardened non-root container — self-hosted on my own infrastructure (Docker · nginx · Coolify · Hetzner), auto-deployed on push. Before this release the whole flow went through an adversarially verified UX audit: 42 findings distilled to 13 root causes, all fixed, so the unhappy paths tell the truth too. The app ships as an installable PWA — a service-worker offline fallback, add to home screen, web push with one notification a week when the Curator publishes — and a separate marketing landing, built on the same token system, sits in front at nux.ontwrpn.com.

Film pages grew anchored sections and critic pull-quotes, matching the Figma spec to the pixel

▶Live demo

app.nux.ontwrpn.com

Open

Live — try it

Mobile — floating glass tab bar + detached search (iOS 26 pattern)

The modes architecture paid for itself twice: hi-fi took hours, not weeks, and every late decision — a token re-alias, a component fix — propagated to 33 screens at once. The discipline of auditing to zero raw values is what made that speed possible

The mark it was graded on — 15/15, “A+ Impressively exceeds expectations” (HEC Montréal / edX)

Sources

• Iyengar & Lepper (2000). When choice is demotivating: can one desire too much of a good thing? Journal of Personality and Social Psychology 79(6):995–1006.
• Scheibehenne, Greifeneder & Todd (2010). Can there ever be too many options? A meta-analytic review of choice overload. Journal of Consumer Research 37(3):409–425. — the choice-overload effect is debated and does not reliably replicate