Repository navigation
Add course overview video - #24
Merged
Merged
Conversation
- videos/copilot-app-for-beginners-overview.mp4: 98.5 s, 1920x1080, with music - videos/overview: data-driven HyperFrames project (config, build, motion, dark-mode app captures, Pick & Polish clip, beat-matched music edit) - .github/skills/overview-video: skill to rebuild and update the video Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
There was a problem hiding this comment.
Copilot review overview
🟡 Changes recommended
Loudness normalization neutralizes the volume control, and the rebuild documentation incorrectly states that renders are silent.
Review effort: Balanced
Findings: 1
Open (2)
What changed in this PR
Adds the course overview video, its HyperFrames source project, media assets, and rebuild skill.
Changes:
- Adds the 98.5-second rendered overview video and source assets.
- Adds data-driven build, animation, music, and export tooling.
- Documents the rebuild and validation workflow.
| File | Description |
|---|---|
.github/skills/overview-video/SKILL.md |
Video maintenance workflow |
videos/copilot-app-for-beginners-overview.mp4 |
Finished course video |
videos/overview/.gitignore |
Excludes generated artifacts |
videos/overview/.media/preferences.json |
HyperFrames preferences |
videos/overview/AGENTS.md |
Project authoring guidance |
videos/overview/BRIEF.md |
Creative brief |
videos/overview/README.md |
Build and scene documentation |
videos/overview/frame.md |
Visual design system |
videos/overview/hyperframes.json |
HyperFrames configuration |
videos/overview/index.html |
Generated composition |
videos/overview/meta.json |
Project metadata |
videos/overview/package.json |
Build and render commands |
videos/overview/video.config.json |
Copy, timing, shots, and music |
videos/overview/scripts/add-music.mjs |
Music mixing and normalization |
videos/overview/scripts/build.mjs |
Composition generator |
videos/overview/scripts/prepare-shots.mjs |
Screenshot frame preparation |
videos/overview/src/motion.js |
GSAP animation timeline |
videos/overview/src/styles.css |
Composition styling |
videos/overview/assets/clips/pick-polish.mp4 |
Pick & Polish recording |
videos/overview/assets/fonts/MonaSansVF.woff2 |
Display font |
videos/overview/assets/fonts/MonaSansMonoVF.woff2 |
Monospace font |
videos/overview/assets/fonts/OFL.txt |
Font license |
videos/overview/assets/music/futuristic-dawn.mp3 |
Background music |
videos/overview/assets/frames/*.webp |
Prepared video frames |
videos/overview/assets/shots/*.webp |
Sanitized app captures |
videos/overview/assets/icons/*.svg |
Primer UI icons |
videos/overview/assets/icons/LICENSE |
Icon license |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Comment on lines
+96
to
+99
| `volume=${volume}`, | ||
| `afade=t=in:st=0:d=${fadeIn}`, | ||
| `afade=t=out:st=${Math.max(0, duration - fadeOut)}:d=${fadeOut}`, | ||
| "loudnorm=I=-14:TP=-1.5:LRA=11", |
Comment on lines
+65
to
+70
| The video renders without sound. To add music, do one of these: | ||
|
|
||
| - Run `npm run music -- <file> --start <seconds>` after `npm run render`. This | ||
| is fast and does not render the video again. | ||
| - Set `music.src` (and `music.start`) in `video.config.json`, then run | ||
| `npm run render`. |
The decoded audio is unchanged (same MD5). Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.


Adds a 98.5-second overview video for the course, the project that builds it, and a skill to rebuild it.
Video
videos/copilot-app-for-beginners-overview.mp4(1920x1080, 30 fps, H.264 + AAC, about 21 MB, -13 LUFS)Project:
videos/overviewvideo.config.jsonholds all copy, timing, screenshots, camera focus boxes, and the music edit.npm run build | check | render | music | export. Seevideos/overview/README.md.demopersona (Streamer Mode, profile name replaced). The Pick & Polish recording was checked frame by frame for private data.Skill:
.github/skills/overview-videoExplains how to update the video when the course or app changes: config fields, screenshot capture rules, glyph and frame checks, music alignment, and export.
Validation
npx hyperframes lint: 0 errors.npx hyperframes check: passed.