★ LOCKED design language · 5 pages · v5/02 (SVG refraction) + parallax depth + ambient motion
Design final — applied to every page
The locked design language: SVG turbulence-based liquid glass, cream + sage palette, emerald accent only, single material, ≥40% empty viewport. Cursor-tracking parallax tilt on hero cards, floating bob on satellite chips, layered emerald-tinted shadow stack — the depth Federico noted was missing in flat v4 variants. Applied uniformly to landing, library, skill page, explore, and sign-in.
Track B v2 · refined per Federico's edits + mobile + /explore
Content wireframes (B&W) — v2
Library reordered (skills first, agents compact, MCP compact, no Sync button — sync is passive). Skill page picker simplified (default-to-all-agents + default-to-all-folder, expand-to-edit). New /explore page (2 variants). Mobile versions for every page (10 mobile files). Real Floom copy throughout.
L1Landing — sync narrativeOpen
L2Landing — product-ledOpen
L3Landing — pack-firstOpen
Lib1Library — stacked (skills first)Open
Lib2Library — sticky TOCOpen
Sk1Skill — App StoreOpen
Sk2Skill — sticky TOCOpen
Ex1Explore — simple gridOpen
Ex2Explore — editorialOpen
In1Sign-in — centeredOpen
In2Sign-in — splitOpen
BENCHMARK · Codex (gpt-5.5) — same brief, same SKILL.md refs
Codex liquid-glass attempt
Codex got the exact same brief Claude got for design-v4: pure HTML, no images, no mascot, visionOS Liquid Glass quality. Both received the rshankras + dpearson Apple SKILL.md files as reference. Codex's pick: 04 first, 01 second.
Track A · v4 (Claude · pure HTML, glass-liquid focus)
Claude liquid-glass attempt — design-v4
5 pure HTML/CSS variants demonstrating different liquid-glass treatments. SVG turbulence refraction, edge specular, perspective-stacked depth, dark mint, GlassEffectContainer with multiple chips.
Track A · v3 (Imagen 4 Ultra · reference images, NOT shipping)
Design hero variants — generated at reference quality
After "the Apple ones are way cheaper than Apple" critique: the reference Federico shared was AI-generated. v3 uses Imagen 4 Ultra to produce each hero as a single designed asset at premium magazine-ad quality. Pick one, regen with copy fixes if needed.
Track A · v2 (post-critique, code-built)
Design hero variants — disciplined
After the v1 critique ("cheaper than Apple"), 10 variants with hard constraints: max 2 colors, ≥40% empty viewport, 1 motion, 1 material, no mascot except the reference variant.
Track A · v1 (rejected, kept for reference)
Design hero variants — first pass
11 directions including the original Floom poster vibe. Critique that drove v2: "cheaper than Apple, not as many colours, not so much going on, visually easier to digest."