Add promo video assets and rendering pipeline - #22
steveseguin wants to merge 5 commits into
Conversation
promo/index.html is a two-minute animated introduction to CAPTION.Ninja (hook, three-step setup, translation, TTS, pro tools, self-hosting and a call to action). Every frame is a pure function of time, so the page plays live in a browser and renders frame-exact video. promo/soundtrack.py synthesises an original 120 BPM soundtrack and places sound effects from the cue list the page exports. promo/render.mjs renders the page with headless Chromium and ffmpeg into an MP4 plus a 30-second teaser. Fonts are Bricolage Grotesque and Inter (OFL); icons are Lucide (ISC). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01R8j3iT76b2oSLLnei6fzme
End the opening and reveal scenes exactly on the slash flash so the white frame never shows the previous scene, and fix the player's big Play button to start from the beginning. render.mjs now also cuts a 30-second teaser (the opening spliced onto the call to action on the same downbeat) and writes partial --from/--to previews to the temp folder so they never replace the finished video. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01R8j3iT76b2oSLLnei6fzme
caption-ninja-promo.mp4: 1:54, 1920x1080, 30 fps, H.264 + AAC, -14.9 LUFS. caption-ninja-teaser-30s.mp4: the opening spliced onto the call to action. poster.jpg is the thumbnail; soundtrack.mp3 is used by the live page. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01R8j3iT76b2oSLLnei6fzme
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 042bb184a2
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
- Read the playback position before clearing `playing`, so pausing keeps the current frame instead of jumping back to the last seek point. - Keep the transport at 0:00 on load (the logo frame is only shown as a poster), so the bottom Play control starts from the beginning. - render.mjs falls back to the global Playwright install from `npm install -g playwright`, as the README documents, when no local install resolves. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01R8j3iT76b2oSLLnei6fzme
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 977982e698
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01R8j3iT76b2oSLLnei6fzme
This branch has not been deployed
2 participants
Summary
Adds a complete promotional video package for CAPTION.Ninja, including a 1:54 main video, 30-second teaser, live browser-based animation, and original synthesized soundtrack.
Key Changes
promo/index.html- Interactive HTML5 animation that mirrors the video content, playable in-browser with synchronized soundtrackpromo/soundtrack.py- Python script that synthesizes the entire 114-second soundtrack from scratch (no samples):promo/render.mjs- Node.js rendering pipeline that:promo/README.md- Complete documentation of the video content, script breakdown, and rendering instructionsImplementation Details
The soundtrack uses scipy signal processing for band-limited synthesis and dynamic filtering. The rendering pipeline is fully automated:
render.mjsorchestrates Playwright for frame capture, Python for audio generation, and ffmpeg for encoding. The HTML animation is self-contained and can be viewed standalone atcaption.ninja/promo/with the same visual and audio experience as the video.https://claude.ai/code/session_01R8j3iT76b2oSLLnei6fzme