marketing-explainer-video

Define the message flow, then build HTML/CSS slide states with question-then-explanation reveals, write one narration turn per row in manifest.tsv, synthesize audio with a TTS engine, and concatenate segment videos into the final MP4.

Render each slide state as HTML with a shared diagram.css, then capture full-page PNGs using Playwright or the repository's established screenshot method. Inspect representative slides such as the title, definition, example, and credit slides before building the video.

VOICEVOX runs locally but requires explicit credit slides and visible voice attribution in the video. Azure Speech reads AZURE_SPEECH_KEY and AZURE_SPEECH_REGION from environment variables and suits cloud-based synthesis with multiple voices.

Yes, the workflow recommends distinct voices for question and answer roles when the TTS engine supports multiple speakers. This lets you remove visible speaker labels from slides since voice and timing distinguish the roles.

Timestamp and fps problems occur when segment videos are concatenated directly. Generate each segment from a still PNG plus audio, then concatenate and re-encode the final MP4 to normalize timing.

Commit the final MP4, source scripts, manifests, slide assets, and preview files. Keep intermediate audio and segment files out of commits unless explicitly requested, and never commit API keys or secrets.