Skip to main content

Acceptance Spec — Real Call-Clip Set ("Hear how our AI handles real calls")

Status: partial — VIDEO layer LIVE (2026-06-17); audio clips still coming-soon Owner: CWA · Created: 2026-06-16 · Updated: 2026-06-17 · Origin: founder Feature Registry: cwa-demo-call-clip-set

1. What this is​

A customer-facing, click-to-play multi-clip player that lets a visitor hear our voice AI handle four REAL, generic recorded call scenarios:

Clipcall_typeRoleStorage key (in demo-call-clips bucket)
BenevolencebenevolenceFeatured / hero (first, larger card, gold "Featured" chip)benevolence.mp3
PrayerprayerStandard cardprayer.mp3
GivinggivingStandard cardgiving.mp3
Who is the pastor/priest?who_is_pastorStandard cardwho-is-pastor.mp3

These are GENERIC, SHARED recordings (the founder records them once). They are NOT per-church. They COEXIST with — and never replace — the personalized per-church premium_churches.sample_call_audio_url clip.

Video layer (added 2026-06-17)​

Each clip can also carry an optional youtubeId (src/lib/demo/call-clip-set.ts). When present, the card renders a YouTube click-to-play explainer video (reuses the PromoVideoEmbed / youtube-nocookie pattern, no autoplay) ABOVE the audio SampleCallPlayer. The four videos are LIVE now; the audio mp3 layer stays gated behind NEXT_PUBLIC_CALL_CLIPS_LIVE (so a card can show video while audio is still "coming soon"). A clip with no youtubeId shows only the audio path (backward compatible).

ClipyoutubeId
benevolence1Wfqe2PpVcA
prayerTTfdAtm8cMg
givingM7EpY6mgxv8
who_is_pastor5om-ehjrM-s

2. Surfaces (all four are required)​

  1. churchwiseai.com/voice — replaces the VideoPlaceholder in the "Hear It in Action" section.
  2. churchwiseai.com/ (homepage) — additive section near the final CTA.
  3. churchwiseai.com/demo — additive section above/around the demo wizard.
  4. Every per-church demo /s/[slug] (DemoExperience) — additive section; the personalized single-clip modal + sample_call_audio_url path stay UNTOUCHED.

Marketing surfaces (1–3) use the pseudo-slug voice-marketing for funnel events so they don't pollute per-prospect funnels. Per-church surface (4) uses the real church slug.

3. Behavior​

  • Click-to-play, NOT autoplay. Each card has a play/pause button (reuses SampleCallPlayer).
  • Benevolence is featured — rendered first, visually larger, gold accent, "Featured" chip, subtitle "Real recorded call".
  • Coming-soon pre-launch state. A global env switch NEXT_PUBLIC_CALL_CLIPS_LIVE gates the live player. When it is not exactly 'true', every card renders a non-interactive "Coming soon" state (clear copy, disabled control) — never a broken/404 player. This is the state that ships now, before any mp3 exists.
  • Graceful fallback when a clip 404s. When live but an individual clip fails to load, that card shows a calm "This clip isn't available yet" message rather than a dead control. (SampleCallPlayer already degrades on error.)
  • Funnel events. On first play: demo_voice_call_started. On completion: demo_voice_call_completed. Both carry properties.surface (call_clip_set on /s/[slug], voice_marketing on marketing surfaces) and properties.call_type (one of the four).

4. Design​

Navy #1B365D, Sacred Gold #D4AF37, Cream, stone scale. Playfair heading "Hear how our AI handles real calls". Featured card larger with gold accent; other three in a responsive grid. Reuses existing card styling (rounded-2xl border border-stone-200 bg-white shadow-sm).

5. NON-REGRESSION assertions (hard gate)​

  • premium_churches.sample_call_audio_url is NOT renamed, repurposed, or left unpopulated. The personalized per-church clip pipeline (src/lib/demo/sample-call-audio.ts, church-sample-audio bucket) is untouched.
  • The variant-B send preflight gate is untouched: src/lib/outreach/demo-verification.ts and src/lib/outreach/campaign-preflight.ts are NOT modified.
  • SampleCallPlayer changes are backward-compatible: existing per-church modal callers keep the prior behavior (default surface: 'sample_call_audio').
  • No sends, no Stripe, no voice deploy.

6. Storage​

  • Public Supabase Storage bucket: demo-call-clips (distinct from church-sample-audio). Fixed keys: benevolence.mp3, prayer.mp3, giving.mp3, who-is-pastor.mp3.
  • Founder uploads via scripts/upload-call-clips.mjs <dir> once the four mp3s exist. Idempotent bucket-create + upsert:true.

7. Deployed-URL verification​

On a local prod server (pnpm build + pnpm start, port 3002), in the coming-soon state (no files):

  1. /voice — section renders with the heading, benevolence featured first + 3 cards, all in coming-soon state. Assert real content (heading text + 4 labels), not just HTTP 200.
  2. / — same section renders.
  3. /demo — same section renders.
  4. A real demo /s/[slug] — the additive section renders AND the existing personalized modal/sample_call_audio_url path still works.

Once clips are live (NEXT_PUBLIC_CALL_CLIPS_LIVE=true + mp3s uploaded), repeat with Playwright: assert each card plays (audio currentTime advances at ≥2 timepoints), benevolence is first, and a 404'd clip degrades gracefully.