Home / Ops / The Locked Demo

Affirmology Demo Overhaul: Execution Plan and Status

Updated Jun 17, 2026 · Affirmology_DemoOverhaul_ExecutionPlan_v1.md

Affirmology Demo Overhaul: Execution Plan and Status

One page to resume from the moment Claude Code finishes the cosmos film. Pulls the open items from Affirmology_PROJECT_STATE.md, Affirmology_SessionHandoff_VideoBuild_v1.md, and Affirmology_DemoPunchList_v1.md into one ordered, lane-tagged checklist. No em dashes, per house rule.

Last assembled: 2026-06-17 (Cowork lane).

1. Where it stands right now

• The live site, the teaser, primer.html, and whatsinstore.html stay up on Cloudflare regardless of the laptop. Only the per-person render needs the laptop awake with the server and Tailscale funnel running.
• The full chain was verified end to end on 2026-06-15: form to primer film to personalized audio to post-audio reel to report and download buttons. So the wiring works. The open work is polish, the post-audio display fixes, the new films, and turning email on.
• IN FLIGHT (Claude Code lane): the B2 cosmos primer, the 3D WebGL loading film that plays while the audio renders. This is the centerpiece "main video." We resume the rest the moment it lands.

2. The five moving pieces in the flow

The visitor moves through four screens and (proposed) a fifth ambient layer. Here is each piece, its status, and which lane owns it.

1. PRE-FORM opening (super short). The cosmos-direction intro before the birth-info form on index.html. Status: NOT built (handoff task 4, "second version"). Lane: Claude Code builds, Cowork reviews and refines copy.
2. LOADING FILM (main video, while audio renders). The B2 cosmos primer. Status: Claude Code building now. Lane: Claude Code (it can self-render and screenshot to verify; we cannot in the sandbox). Cowork reviews and picks variations.
3. PERSONAL AUDIO PLAYER (the listen). Status: works. Open idea: a calm ambient animation during listening (see section 5). Lane: Cowork can prototype the ambient layer as a self-contained file; Claude Code wires it in.
4. POST-AUDIO display + report (result.html). Status: PARTLY BROKEN (see section 3). Lane: Claude Code (touches the backend report generator and Cloudflare).
5. POST-AUDIO SHORT VIDEO (whatsinstore.html v2 to v3). Status: needs the v2 VO swap and the new lines (see section 4). Lane: Cowork can drive the edit directly in the file; Claude Code redeploys.

3. The post-audio display, what is broken (the notes you asked for)

From handoff task 3 and PROJECT_STATE section 5. Four distinct issues on affirmology-site/result.html:

a. SAFARI SCROLL STALL. In the delivered state the report cannot be scrolled to. The page does not scroll. Fix: audit the .overlay / fixed layers and the body so the page scrolls once the result is shown. This is the most user-visible break. Lane: Claude Code (or a Cowork CSS pass on the static file).

b. THIN BLUEPRINT. The reveal is missing the Rising sign, more Gene Keys, and a few intro sentences above the blueprint. The live blueprint comes from the backend /api/status blueprint field via renderBlueprint(bp) (the hardcoded renderReport() is only the mock). So Rising and the extra keys need the engine's report generator on the Mac to emit them. Lane: Claude Code (backend report generator).

c. DOWNLOAD BUTTONS POINT AT MOCKS. The buttons must open the real audio_url and pdf_url from /api/status. Today download-report writes a mock txt blob. Wire it to results.pdf_url, and confirm the audio button uses the real audio_url. Lane: Claude Code (small front-end fix).

d. CONSISTENCY CHECK. Compare the on-screen blueprint vs the PDF vs the original baseline so they agree (flagged in the punch list). Lane: Cowork can run the visual compare once the three exist.

4. The post-audio short video (whatsinstore v2 to v3)

Swap the new VO and land the new lines. Full before/after is in Affirmology_WebVideo_Changes_BeforeAfter_v1.md. Concretely:

• Swap in Affirmology_WhatsInStore_VO_Lily_v2.mp3 (71.3s) and use its word anchors (in the handoff doc).
• Make audios plural ("imagine the whole library").
• Land the three-step as three staggered beats: Know yourself / Align to your blueprint / Become who you were written to be.
• New closer: "One blueprint. Many doors. A lifetime of becoming." into "Welcome home to who you already are."
• Keep it lean. Subtle equalizer pulse and a new-moon glyph only.

Lane: Cowork can do this edit directly in the shared whatsinstore.html; Claude Code redeploys.

5. Proposal: an animation while they listen

You asked what if something plays during the audio, not too distracting. My recommendation: yes, but make it ambient, not kinetic. The rules that keep it from competing with the audio:

• No text, no scene changes, no narrative. The film already did the talking. This layer is a held, breathing field, closer to a screensaver than a video.
• Slow and low contrast. Deep emerald base, the living starfield drifting, the aura blobs easing on a 22 to 26s cycle, a single gold ✦ breathing. Everything on the slow sine pulse the brand already uses. Nothing kinetic, nothing bouncing.
• Loosely audio-reactive, gently. A soft concentric aura or waveform ring that swells a few percent with the voice amplitude, so if their eyes are open it feels alive and tuned to them, but it never pulls focus. Tie it to the existing audio element, not a separate clock.
• Their chart, barely. Their own constellation or bodygraph glyphs drifting far back at low opacity, so the thing they are listening to is faintly visible around them. Personal without being busy.
• Always optional. A "dim" or "eyes closed" toggle that fades it to near-black, plus a prefers-reduced-motion fallback that holds a still frame. Default could even start dim and warm slightly toward the end.

Cheapest build: reuse the cosmos film's Three.js scene at very low intensity with the camera nearly still, or a lightweight standalone canvas if we want it to run forever without heating the device. Either way it is a self-contained file Cowork can prototype and hand to Claude Code to wire under the player. Call it the sixth experience.

6. Email (the pieces are set, one switch is off)

From PROJECT_STATE section 5. The architecture is built and the domain is ready. What remains:

• Resend domain affirmology.ai is VERIFIED.
• MISSING: add RESEND_API_KEY and FROM_EMAIL as secrets on the Cloudflare API worker (affirmology-demo-worker). Until then, the result email with the audio and report links does not send.
• After adding the secrets, fire one real submission and confirm the email arrives with working audio_url and pdf_url links.

Lane: Claude Code / Jeff (Cloudflare secrets). This is the single switch that turns delivery on.

7. Ordered execution checklist (when Claude Code finishes the film)

1. Review the B2 cosmos film together, pick variations, list refinements. (Cowork watches, Jeff is the eyes.)
2. Land the post-audio display fixes a through d in section 3, Safari scroll first. (Claude Code)
3. Turn email on: add the two Resend secrets, test one real send. (Jeff / Claude Code)
4. Ship whatsinstore v3 with the v2 VO and new lines. (Cowork edits, Claude Code deploys)
5. Build the pre-form opening in the cosmos direction. (Claude Code, Cowork copy)
6. Prototype the ambient listening layer as a self-contained file, then wire it under the player. (Cowork prototype, Claude Code wire)
7. Full run-through on the laptop with server + funnel up: submit the form, watch the whole flow, confirm audio, report, downloads, and email all land. (Jeff)

8. Lane split and sync rule

• CLAUDE CODE (Mac, self-tests, deploys): the cosmos film and post-audio film renders, the demo-site redesign and Cloudflare deploys, backend changes (Rising sign and more Gene Keys in the report generator, the Sacred Audio Report PDF, the Resend email worker), Remotion and Hyperframes.
• COWORK (iterate, content, lighter): review the films and pick variations, drive small and medium refinements directly in the shared files, the standalone PDFs and reports, copy, scripts, planning, research.
• SYNC RULE: whichever lane does heavy work updates Affirmology_PROJECT_STATE.md and the handoff doc at the end, so the other lane resumes cleanly.