feat(landing): factory-tone rebuild with interactive live-DOM ultrawork demo, team mode & ulw-research sections#99
Conversation
…nd motion contract Defines the light Codex Desktop adapter palette, the CodexWindow / TeamModeSection / UlwResearchSection primitives with their states, the ulw-demo timeline rules (autoplay, reduced-motion), and the binding hover-is-an-affordance rule before any component code lands.
Eight-scene Ultrawork run (research fan-out, Prometheus plan, todo registration, lane assignment, TDD red, record-evidence, QA retry, checkpoint) ported verbatim from the reviewed prototype whose beats map to OMO source truth, plus the subagent roster, workflow steps, proof chips, and environment rows the Codex window renders.
Light Codex Desktop window (adapter tokens from DESIGN.md): transcript pane with command chip and numbered stages, subagent roster, environment and ledger cards, composer bar, and a scene state machine with IntersectionObserver autoplay, tab/play controls, and reduced-motion support. MarketingSection gains an optional id for section anchors.
Copy grounded in plugins/omo/skills/teammode/SKILL.md and plugins/omo/skills/ulw-research/SKILL.md plus the recorded team-mode session: leader/member thread mock with a cross-thread verification note, when-to-team guidance, and the saturation-research feature band.
…rk badge Mounts the interactive demo right after the install block and the team mode / ulw-research sections after the workflow pillars, drops the raster badge section in favor of the live-DOM window, and adds the e2e contracts for the demo (autoplay, tabs, reduced motion, 390px overflow) and the new sections (grounded copy, section order).
Lighthouse mobile flagged aria-required-children (play button inside the tablist) and color-contrast (opacity-dimmed inactive steps/workers on white). Inactive states now use AA-safe adapter colors instead of opacity, worker glyphs move to darker shades, the window accent darkens to green-800, and the play control sits outside a display:contents tablist. Both presets now score 100/100/100/100.
Pass A: the scene status live region moves outside the keyed swap subtree so screen readers actually announce scene changes, and the remaining raw colors (traffic lights, active borders, glyph text, on-accent text) become declared tokens. Pass B: the demo section gains scroll-margin below the sticky header, command-card code samples get a right-edge fade as a scroll affordance, and the card's decorative hover — a non-actionable element — is removed per the design rule.
The final gate flagged BrandImage and ultraworkTagline as dead after ultrawork-section.tsx was replaced by the live demo — both removed with zero remaining references. The demo tabpanel also gains aria-labelledby pointing at the active tab.
|
Thanks for the PR! Changes to LazyCodex land through oh-my-openagent — could you open this against omo-codex over there instead? PRs in this repository can't be merged. If you're working with a coding agent, prompt it like this:
|
Summary
Rebuilds the lazycodex.ai landing in a factory.ai-style clean, declarative tone while keeping every existing LazyCodex asset intact (logo, green design system, copy, docs, features). The raster "Ultrawork" badge section is replaced by an interactive, live-DOM Codex Desktop window that replays a real ultrawork run in 8 scenes —
ULTRAWORK MODE ENABLED!→ Explorer/Librarian research fan-out → Prometheus plan → todo registration → lane assignment → TDD RED → GREEN + record-evidence → QA retry → checkpoint — and new Team Mode and ulw-research sections introduce features the product actually ships, with every visible string traced to a source.Changes
Interactive Ultrawork demo (
components/site/ulw-demo/,lib/ulw-demo-scenes.ts,app/styles/ulw-demo.css)role=tablist, arrow-key navigation), play/pause witharia-pressed,prefers-reduced-motiondisables autoplay and the caret/scene animations.New sections (
components/site/team-mode-section.tsx,ulw-research-section.tsx,lib/site-config.ts)plugins/omo/skills/teammode/SKILL.md.plugins/omo/skills/ulw-research/SKILL.md.Design system (
DESIGN.md,app/styles/design-system.css)--codex-window-*adapter palette (light surface) with documented primitives, states, and motion rules — written before component code.Information architecture (
app/page.tsx)main.Accessibility — Lighthouse mobile initially scored a11y 91 on this branch (play button inside the tablist; opacity-dimmed inactive rows failing contrast on white). Fixed with AA-safe color states, darker roster glyphs, a green-800 window accent, and a
display: contentstablist. Both presets now score 100.QA & Evidence
All artifacts live in the worktree's
.omo/evidence/(synced to the repo's.omo/, not committed).e2e/ulw-demo.spec.ts+e2e/landing-sections.spec.tscaptured failing (6 fails: components absent) before any component code, green after (g2-c1-demo-e2e.txt,g3-c1-sections.txt).aria-pressed; reduced-motion keeps scene 0 static while tabs still switch; 390×844 shows zero horizontal overflow (g2-c2-demo-reduced-mobile.txt,g2-c2-demo-mobile.png).tsc --noEmit+biome lintclean (g3-c3-full-suite.txt).g4-c1-lighthouse.txt).img/picture/url()backgrounds; the only hover rule added by this branch is.ulw-control:hover(actionable tab/play buttons) (g2-c4-hover-raster-audit.txt).copy-ledger.md(skill SKILL.md lines, docs lines, or recorded Codex Desktop session frames); forbidden-drift scan (pricing/customers/testimonials/KPIs/dates) clean (g3-c2-copy-ledger-check.txt).g4-c2-visual-qa/).Risks & Residuals
.omo/evidence is not part of the diff; the captures below are the reviewer-facing subset.Screenshots
Demo scenes — research (autoplay start) → TDD red → checkpoint, plus a mid-transition frame proving the scene swap animates:
Summary by cubic
Rebuilt the landing with a live-DOM Ultrawork demo and added Team Mode and ulw-research sections to showcase real workflows. Achieves 100/100/100/100 Lighthouse scores, replaces the raster badge, and adds e2e coverage.
New Features
Refactors
MarketingSectionnow accepts anid.aria-livestatus updates, AA-safe colors on light surfaces, reduced-motion disables autoplay; both presets score 100 across Lighthouse.brand-image.tsx, and the unusedultraworkTagline.Written for commit 4025875. Summary will update on new commits.