ryOi
02.01 / grow / Web case study

grow / Web

Built by AI. Directed by Ryoi.

RYOI.ai is Ryoi’s public home and a working experiment in directing a persistent AI product team.

Build method
Built by AI
Human direction
Directed by Ryoi
AI team
PdM web + Dev web
Principal model
GPT-5.6 Sol
First public version
9h 56m work time
Token spend
316.1M processed
Built by AI.
Directed by Ryoi.

A public home /
a working experiment

The website is both a place for Ryoi’s products and one visible result of learning how a human product owner can direct persistent AI roles.

RYOI.ai began before the portfolio was mature. It needed to feel credible without inventing products, clients or outcomes—and it needed a way to keep context, direction and accountability intact across many rounds of AI-assisted work.

AI produced the design, writing, code and delivery artifacts. Ryoi supplied the vision, taste, material corrections, approvals and final acceptance. The authorship is collaborative, but the authority is deliberately asymmetric.

Vibe coding evolved into a persistent AI product team.

The experiment moved from isolated conversations toward named roles, durable product context, one development lane, explicit gates and production evidence.

One direction /
persistent roles

Each role owns a distinct part of the work. AI makes the artifacts; Ryoi owns the vision, material decisions, approval and acceptance.

01

Ryoi

Founder, product owner and creative director. Sets the vision, taste and priorities; makes material product decisions; reviews gates; grants production authority; gives final acceptance.

Human direction
02

PdM web

Maintains Web context, turns discussion into product scope and content architecture, prepares GitHub contracts, coordinates the approved route and surfaces decisions.

AI product manager
03

Dev web

Creates journey proofs, implements approved work, reviews affected behavior, records evidence, prepares releases after approval and verifies production.

AI developer
04

OpenAI Codex

The AI environment through which the persistent product and development roles plan, design, write, code and operate.

Working environment

How the work /
moves

One visible development lane turns direction into an exact reviewable artifact, then carries the approved result through release and production verification.

01

Ryoi direction

Ryoi defines the problem, intent and material boundaries.

02

AI PdM scope

The PdM web turns that direction into an exact issue, estimate and split verification plan.

03

Journey approval / when material

One integrated journey proof is approved when a material user-facing journey is unresolved. Small changes inherit the existing journey and skip this step.

04

AI Dev implementation

The Dev web implements the approved or inherited direction as one exact branch candidate.

05

Exact preview / Ryoi approval

After the preview-admission self-check, Ryoi approves the exact rendered candidate before formal verification.

06

Review, test / release

Dev completes the remaining Focused or Full review, tests and CI. If the approved output is unchanged and everything passes, it merges and releases without another pre-release gate.

07

Production verification / done

Ryoi verifies the public URL; after acceptance, the PdM closes the issue.

The failures /
shaped the system

The operating model grew from observed delivery friction. Each reset removed ambiguity or made the next decision easier to judge.

01

Specification before experience

Early moodboards and adjective-heavy requirements repeatedly pushed the design away from Ryoi’s intent. The reset was to work through complete, reference-faithful journeys before extracting a system.

Reset / prototype first
02

Imagery without a role

Generated imagery added polish without strengthening the product story. Typography, hierarchy, space and neutral authored fields became the visual lead instead.

Decision / content first
03

One ticket carrying too much

An overloaded brief constrained exploration and made approval boundaries harder to read. Scope, journey and implementation became distinct phases with one exact artifact at each gate.

Reset / explicit phases
04

Evidence becoming ceremony

Excess testing, missing direct URLs and unnecessary monitoring spent attention without improving the decision. Review moved to URL-first gates and evidence proportional to actual risk.

Decision / proportionate proof
05

Motion moving the layout

Page-entry and title effects exposed geometry drift in live review. Motion was contained inside reserved layers so the interface can resolve without moving the page.

Correction / fixed geometry
06

Hierarchy by normalization

A uniform title system weakened the editorial character. The accepted direction restored varied magazine-like scales and corrected only the Contact close that needed restraint.

Decision / preserve variation
07

Local fixes without a shared primitive

Header/footer geometry fixes and equal CSS font-size assumptions still produced visible mismatch. One shared wordmark renderer and rendered-ink/cap-height parity replaced per-location values.

Correction / shared primitive

The visual system /
supports the story

Full-screen, content-first compositions put typography before imagery and use one restrained interaction grammar across Dark and Light.

ryOi
Dark leads / Light equalFull wordmark / interfaceCursor O / compact icon
Locked identity / live system

Typography before imagery

Sharp-square r, y and i use exact modular vector geometry. The solid O is a cursor: every runtime wordmark inherits one shared renderer, blinking never changes geometry, and reduced motion holds the cursor visible. The O alone serves compact favicon and app-icon contexts.

Canvas
Full browser
Theme
Dark / Light parity
Motion
Cursor blink / fixed geometry
Identity
Shared renderer
Media
Authored / optional
01

Full-screen composition

The browser is the website. There is no inner shell, simulated window or decorative dashboard.

Spatial principle
02

One interaction grammar

Menus, themes, titles, reveals and actions share the same timing, focus and state language.

Behavior principle
03

Honest product frames

Projects and Journal entries state what is live, evolving, unpublished or not yet known without filling gaps with claims.

Content principle

The operational /
product

The outcome is not only a website. It is a repeatable human/AI collaboration model with durable context, explicit authority and verified release.

Persistent roles let product context outlive one conversation. GitHub keeps scope, exact candidates and delivery evidence retrievable. Approval gates reserve the decisions that require Ryoi’s judgment while leaving the AI team room to execute bounded work.

Consent-first analytics, accessible interaction patterns, exact previews and production verification make operational quality part of the product rather than a separate afterthought.

Record

9h 56m work time / 316.1M processed

The first public release took 9h 56m of recorded AI-team work across PdM web and Dev web. Idle time is excluded; overlapping work is counted as team-hours. The build processed 316.1M tokens, mostly cached context.

Method / bounded ledger
01

Speed needs memory

AI can create quickly, but speed without persistent context and decision boundaries produces drift.

Learning
02

Working beats descriptive

A functioning prototype exposes proportion, hierarchy and behavior more clearly than adjective-heavy specifications.

Learning
03

Taste remains decisive

AI can generate and refine many artifacts; human judgment determines which direction deserves to continue.

Learning
04

Approved means inherited

Content-addressed evidence prevents later work from quietly reconstructing or drifting from an accepted state.

Learning
05

Visual equality is measured

Equal CSS numbers across different typefaces do not guarantee equal perceived size. Rendered cap-height parity aligned the controls and wordmark.

Learning

Live now /
still evolving

RYOI.ai is live as a durable home for Ryoi’s products. The next chapters remain intentionally open and require their own direction.

01

Authored media

Purpose-built interface fragments, process diagrams or video can deepen the story when they add meaning.

Roadmap
02

Real Journal entries

Published field notes can explore role design, context preservation, approval gates and observed delivery lessons.

Roadmap
03

Expanded product stories

Each public product can receive a fuller story when its facts, media and release context are ready.

Roadmap
04

Observed refinement

The AI product team will keep evolving from concrete delivery friction rather than speculative process.

Roadmap

Built by AI /
directed by Ryoi

Design, writing, code and delivery artifacts by the persistent Web AI team in OpenAI Codex. Vision, taste, material product decisions, approval and final acceptance by Ryoi.

Let’s make the idea real

Contact

Have a product idea, an opportunity to collaborate, or something worth bringing back to life?