The timeline from paste to export, the new components, and the rules every screen follows.
System
A
URL to brand
Paste a site; the brand card shows in about 2 seconds and refines in place.
4 screens
B
First moment
A start screen written for the brand, one press to draw, then the moment in its own app.
6 screens
F
Your screen
Paste the screen you are working on. We draw for it and play the moment there, on their real pixels.
5 screens
G
Brand kit and size
The guide as a few readable decisions, and Icon, Spot or Scene per moment.
3 screens
C
Use it
Install, files, a Lottie a mobile team can trust, and a phone preview.
3 screens
D
Email settings
One clear way to stop emails, in settings and from any email.
3 screens
E
Lifecycle emails
The four emails worth sending at launch, each about the person's own product.
4 screens
T
Community tags
Tags that narrow the gallery, counted across everything shared.
2 screens
H
Loading
Never a blank white page.
1 screens
Paste to export, timed
Target timings from the prod measurements of Oct 7 (today: card at about 22 s, read about 34 s, half of reads failing, draw about 103 s). Click a state to open its screen.
URL pasted0 s
Design rules
How this fits the product.
About their product, every timeThe first screen after the brand names the brand, shows its logo and colors, and writes ideas in its vocabulary. No fixed word like magical.
Never a blank waitThe card shows from a page fetch in about 2 seconds; ideas hold their place while they are written; the opening paints before scripts.
Their pixels, never oursContext comes from a screen they paste. We never draw a fake version of their app around a moment.
One press to a momentAn idea tile draws itself. It shows the cost, and its sketch, seen as pencil outlines, is the drawing's starting point.
Plans, not picturesA concept is shown the way the light table draws: construction pencil and washes. Never as a generated image.
Decided for them, changeableWe pick Icon, Spot or Scene from the words and the brand. Size only shows up inside Redraw, for when we guessed wrong.
Exports you can trustEvery Lottie is checked against the stage at each state, and says what plays and where.
A1Paste your site
app: none · site prefilled from work email
One field, already filled from the sign-up email’s domain. Continue is the only action.
workSite(email) prefills the address (exists)
POST /api/apps/discover streams NDJSON
Address normalization fixed: bare domains, www, paths, case, spaces (12 prod rejections in 3 days)
3 existing
A2Brand card at 2 seconds
read: instant · card provisional · browser still reading
The card appears from a plain page fetch before any browser or model runs. Continue works right away; the read keeps refining behind it.
Instant pass: fetch HTML through the address guard, parse og:site_name, manifest, theme-color, apple-touch-icon, header logo, CSS colors
Stream event found{provisional:true} at ~2 s (prod today: card at ~22 s)
Browser launch starts in parallel; palette validated for contrast before it is shown
5 existing
A3Brand checked at 9 seconds
read: identity done · style known · ideas writing
The same card, refined in place: the style the site draws in becomes a few plain tags anyone can correct. Nothing jumps.
read_brand starts when DOM evidence is measured (~9 s), not after crops and pages
Style tags are structured guide fields (subject, look, shape), editable later in app settings
Guide and ideas keep streaming; Create never waits for them
4 existing
A4Site turns the reader away
read: browser blocked · instant pass kept
A blocked site still gets a card from what loads without a browser. A palette that could not work is fixed and says so.
crowdvolt.com refuses Browser Run; icon and theme colors come from the page fetch or the page itself
Palette check: ink vs background contrast, accent must differ from ink (prod saved CrowdVolt with accent = ink = white)
Failure only when nothing at all could be read
3 existing
B1Duolingo: three ideas, ready
app: created · ideas: 3 pre-sketched · moments: 0
The first screen of a new app is about that app: its logo, its colors, a headline written for it, and three ideas in its vocabulary. One press draws one.
Headline + ideas come from one call with the identity (no extra call); fallback headline until it lands
Each tile shows a concept sketched in the background as construction-pencil outlines (measured 12.4–16.1 s, $0.016–0.031 each); the draw reuses it, skipping its sketch step
Press = POST /api/moments/runs with the idea brief, kind and size
6 existing4 new
B2Stripe: no characters
guide.subjects: objects only · sizes: icon, spot
A minimal brand gets minimal ideas. The structured guide says Stripe draws no people, so no idea is a character scene.
guide.subjects = "objects" filters idea briefs and the illustrator prompt
Sizes come from the brand: Stripe defaults to Icon and Spot
Same screen and components as B1
6 existing4 new
B3Pathao: written for its screens
ideas: rides, food, parcels
The headline names the screen that matters most to this product. No fixed word like magical.
Headline: sentence case, under 48 characters, names the brand and one concrete screen
Ideas carry corrected kinds (prod filed “Ride loading” as welcome)
6 existing4 new
B4Ideas still on their way
app: created · ideas: writing
Pressing Continue at 2 seconds lands here at once. The tiles hold their place and breathe; the headline is plain until the written one arrives.
Create no longer waits for the guide (prod: up to a 25 s fourth model call)
Optimistic cache insert, no /api/apps refetch
Composer works while ideas write
6 existing3 new
B5Drawing from the sketch
run: drawing · concept: reused
The concept already exists, so its outlines are on the stage in construction pencil the moment the run starts. Ink lands over them and they fade as parts arrive.
The concept’s traced outlines replace the blocking ellipses as the first layer; the existing light table (ink, x-ray, joints) runs over them
Reusing the pre-sketched concept removes the 12–16 s sketch step (measured 12.4–16.1 s for these 12 sketches)
Outline presence fades per landed part, like the blocking does today; never the concept image itself
5 existing1 new
B6First moment, playing
moment: saved · plays: arrival, hover, click
A real Duolingo moment from production, playing on a clean stage. Use it is the one primary and opens a modal.
Live runtime, same as the export
No invented app chrome: we never fake the screen around it
5 existing
F1Start screen, paste ready
app: CrowdVolt · ideas: 3 · screen: none
Under the ideas, one short line: paste the screen you are working on. Nothing else to learn.
window paste + drop listeners on the workspace; image/png, image/jpeg, image/webp up to 8 MB
Any picture on the clipboard works: a screenshot, a Figma frame copied with ⇧⌘C, a simulator capture
Dark brand: the stage stays neutral, only the idea sketches take the brand colors
6 existing4 new
F2Their screen, box suggested
screen: pasted · slot: suggested
Their own screen fills the stage. We suggest the empty area as the box, they drag to adjust, then say what it should show.
The composer shows the screen as a thumbnail only; pressing it brings the screen back with its box selected; × on hover or focus
Screen stored as a private reference on the app (R2), never shown publicly
Slot suggestion: largest quiet region of the image (no model call); stored as a box in % of the screen
Draw sends the screen plus the slot to the sketch, illustrator and review steps (~$0.005 more)
5 existing2 new
F3A plain Figma copy, caught
paste: text/html with figmeta, no image
A plain ⌘C from Figma carries no picture. The line says which keys work, in one sentence.
Detect Figma clipboard HTML ((figmeta) marker) with no image item
The only Figma help in the product: it appears after a plain ⌘C from Figma, in place of the paste line
6 existing4 new
F4Drawing on their screen
run: drawing · slot: 80% × 32% at the empty area
The plan lands inside their box, on their screen, so the size and fit are obvious before the ink.
Same light table and run events, rendered inside the slot
The screen stays beside the brief, locked: it is part of the request
Background drawn transparent when placed, so it sits on their screen
5 existing3 new
F5Playing on their screen
moment: saved · view: on your screen
A real CrowdVolt moment from production, playing inside the box on their real screen, with its arrival, hover and click in the usual play row. A corner toggle shows it alone.
The screen is now the moment’s context: a two-icon toggle in the stage corner switches On your screen / Alone; changes draw against it without re-attaching
Removing it is a menu action (Draw without the screen), never a stray ×
Exports stay transparent-ready so it drops into that slot; the agent prompt can name the screen
5 existing2 new
C1Use it: add to the app
export: private · installer ready
One command adds the moment to a React app. A phone preview sits one glance away for people building mobile.
Existing Add tab
New: QR opens the private link page on a phone, which plays the .lottie in dotlottie-web
moment_installed logged on GET /install/<token>
9 existing1 adapted
C2Use it: files
files: SVG · GIF · Lottie
Three files, each named for where it goes. GIF replaces PNG, Lottie replaces HTML.
GIF/MP4/WebM made in the browser from the live runtime (PR from feat/gif-video-export)
Lottie made without a browser, so the Worker serves /r/<token>/moment.json and .lottie too
ZIP keeps everything plus ATTRIBUTION.txt for remixes
8 existing
C3Lottie, opened
lottie: 38 KB · markers 6 · state machine on
Everything a mobile developer checks before trusting a Lottie: size, what plays when, the platforms, and code to paste.
Markers: arrival, loop, hover, click, and each app state with its loop
.lottie carries the dotLottie state machine; plain JSON plays markers on lottie-ios/android
Every export is pixel-checked against the runtime at each marker before it is offered
9 existing
D1Settings: emails on
accounts.email_opt_out_at: null
Emails get their own card with one plain button. It says what we send and how often, so the choice is informed.
PATCH /api/account/email { optOut: true }
canEmail(account, kind) gates every lifecycle send; sign-in codes bypass it
Migration 0037 adds email_opt_out_at and the send log
3 existing1 new
D2Settings: emails off
accounts.email_opt_out_at: 2026-10-07
The card says the result in its title and offers the way back.
Same endpoint with optOut: false
3 existing1 new
D3Unsubscribe from an email
GET /unsubscribe?t=…
The link in every email lands here without signing in. One button. Mail apps can also do it in one click.
Signed per-account token; POST is RFC 8058 one-click
List-Unsubscribe and List-Unsubscribe-Post headers on every non-transactional email
noindex, app host
2 existing
E1Email 02: brand ready, nothing made
brand_scan_completed + no moment_generated after 12–24 h
The email points at three real ideas for their product, sketched in their colors. One button.
Cron task every 5 min picks eligible accounts; cap 2 per rolling 7 days
Ideas come with their sketches; email sends a still of each outline as a PNG (mail clients run no shaders)
New template blocks: image, idea row, button
3 new
E2Email 03: made, not shipped
moment_generated + no moment_installed after 24 h
It is about shipping: the moment, then the one command that adds it.
GIF of the moment (made at export time) as the image
Install command is the private installer for that moment
2 new
E3Email 04: first install
moment_installed
Acknowledge the ship, then exactly one adjacent idea.
Adjacent idea: next unused suggestion of a different kind
3 new
E4Email 06: a small idea
activated + quiet 21–30 days
A specific idea for their product. Never “we miss you”.
Sent once per quiet stretch, suppressed if any creation happens
3 new
H1Opening as a skeleton
boot: HTML painted · session and apps loading
The page paints the shape of the screen they are about to see, with a slow field in the stage in their last app’s colors. Real content replaces each block in place, so nothing jumps.
Skeleton and its CSS are inline in studio.html, so it paints before any script
Last app palette read from localStorage; Chocopie’s palette on a first visit
App chunks modulepreloaded; session and apps requested in parallel; target content < 1.5 s warm
The guide becomes a few decisions anyone can read and change, plus one line in their own words. A minimal brand stays minimal. It also steers the size we pick.
Replaces ~300 words of guide prose per app with typed fields; prose kept to notes (≤300 chars) and never-chips
Palette only from measured colors, with contrast checked; lime accents flagged fill-only, not rejected
A ~1k character compiled brief replaces the 4–9k JSON blob sent to every step; the motion director finally reads the motion fields
One migration script backfills all 17 apps (~$0.04), then the old guide schema is deleted
5 existing1 new
G2Size, decided for them
request.scope: icon (inferred)
No size control up front. We read the words and the brand kit and decide; the status line is the only place the decision shows.
Scope inferred from the brief plus guide subjects and detail; a check that draws on is an icon
Icon skips the sketch review and uses template motion: about $0.02 and 20 s instead of $0.09 and 74 s (estimate)
Icon turns off the ambient-life check that forces a resting moment to float
5 existing1 new
G3Not the size they wanted
redraw: same · bigger · simpler
Size lives one step deeper, inside Redraw, only for when we guessed wrong. Same price whatever the size.
Redraw already exists as a priced action (5 credits); it gains a scope override
Flat pricing: 5 per drawing, 2 per change, whatever size we pick
6 existing
T1Gallery with tags
tags: top 4 by count among listed · more: 6
A row of the tags that actually narrow the gallery, counted across everything shared. Only tags with two or more moments show.
Tags come from the public view only (name, kind, parts, motion), one $0.0002 call at share time
moment_tags + moment_tag_sources (migration 0039); counts live up to ~2k moments, then cached
URL: /community?kind=&tag=&order=&moment= (PR #57 must keep the other params)
2 existing1 new
T2Gallery, one tag picked
tag: phone · 4 moments
The picked tag pins first in ink with a way out; the other counts update for what is left.
One tag at a time; changing kind keeps the tag
Empty result shows a dashed card with Clear tag
2 existing1 new
Paste your site
Brand card at 2 seconds
Brand checked at 9 seconds
Site turns the reader away
URL to brand4 screens · Paste a site; the brand card shows in about 2 seconds and refines in place.
Duolingo: three ideas, ready
Stripe: no characters
Pathao: written for its screens
Ideas still on their way
Drawing from the sketch
First moment, playing
First moment6 screens · A start screen written for the brand, one press to draw, then the moment in its own app.
Start screen, paste ready
Their screen, box suggested
A plain Figma copy, caught
Drawing on their screen
Playing on their screen
Your screen5 screens · Paste the screen you are working on. We draw for it and play the moment there, on their real pixels.
Brand kit, structured
Size, decided for them
Not the size they wanted
Brand kit and size3 screens · The guide as a few readable decisions, and Icon, Spot or Scene per moment.
Use it: add to the app
Use it: files
Lottie, opened
Use it3 screens · Install, files, a Lottie a mobile team can trust, and a phone preview.
Settings: emails on
Settings: emails off
Unsubscribe from an email
Email settings3 screens · One clear way to stop emails, in settings and from any email.
Email 02: brand ready, nothing made
Email 03: made, not shipped
Email 04: first install
Email 06: a small idea
Lifecycle emails4 screens · The four emails worth sending at launch, each about the person's own product.
Gallery with tags
Gallery, one tag picked
Community tags2 screens · Tags that narrow the gallery, counted across everything shared.