[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-1773":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":8,"htmlUrl":8,"language":9,"languages":8,"totalLinesOfCode":8,"stars":10,"forks":11,"watchers":12,"openIssues":13,"contributorsCount":14,"subscribersCount":14,"size":14,"stars1d":15,"stars7d":16,"stars30d":17,"stars90d":14,"forks30d":14,"starsTrendScore":18,"compositeScore":19,"rankGlobal":8,"rankLanguage":8,"license":8,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":22,"hasPages":20,"topics":23,"createdAt":8,"pushedAt":8,"updatedAt":24,"readmeContent":25,"aiSummary":26,"trendingCount":14,"starSnapshotCount":14,"syncStatus":12,"lastSyncTime":27,"discoverSource":28},1773,"hyperframes-launch-video","heygen-com\u002Fhyperframes-launch-video","heygen-com",null,"HTML",190,39,2,1,0,4,5,19,12,4.81,false,"main",true,[],"2026-06-12 02:00:32","# HyperFrames Launch Video\n\n\u003Cp align=\"center\">\n  \u003Cimg src=\"docs\u002Fpreview.gif\" alt=\"First 5 seconds of the launch video\" width=\"600\">\n\u003C\u002Fp>\n\nThe composition source for HeyGen's HyperFrames launch video — a real production project you can clone, preview, and render yourself. Use it as a worked example of how to assemble a non-trivial video in [HyperFrames](https:\u002F\u002Fgithub.com\u002Fheygen-com\u002Fhyperframes).\n\n- **Duration:** 49.77s\n- **Resolution:** 1920×1080 @ 30fps\n- **Structure:** 1 root composition (`index.html`) + 17 sub-compositions wired together\n- **Techniques on display:** CSS animations, GSAP, Lottie, shaders, Three.js, footage compositing, captions, SFX\n\n## Prerequisites\n\n- Node.js >= 22\n- FFmpeg\n\nThat's it. No package install step — HyperFrames runs via `npx`.\n\n## Quick start\n\n```bash\ngit clone git@github.com:heygen-com\u002Fhyperframes-launch-video.git\ncd hyperframes-launch-video\n\nnpx hyperframes preview        # opens the studio in your browser\nnpx hyperframes render         # renders index.html → MP4 in .\u002Frenders\u002F\n```\n\nUseful variants:\n\n```bash\nnpx hyperframes render --quality draft        # ~fast, for iteration\nnpx hyperframes render --workers 1            # sequential capture (stable on video-heavy comps)\nnpx hyperframes lint                          # report issues in compositions\n```\n\nSee the full CLI reference: `npx hyperframes --help` or the [CLI docs](https:\u002F\u002Fhyperframes.heygen.com\u002Fpackages\u002Fcli).\n\n## Project layout\n\n```\nindex.html            Root composition — timeline, audio tracks, sub-composition slots\ncompositions\u002F         Sub-compositions referenced from index.html\n  glass-intro.html    Opening sequence (figma-glass-frame, ~15s)\n  flex-*.html         The \"drop in X\" montage — CSS, GSAP, Lottie, shaders, Three.js…\n  thesis.html, cta.html, engine.html, …\nassets\u002F               Video, audio, and image media\nmeta.json             Duration, resolution, fps\nHANDOFF.md            Production notes — what was changed, why, what's still open\nSCRIPT.md             Voiceover script\nSTORYBOARD.md         Scene-by-scene direction\n```\n\n## Learn more about HyperFrames\n\n- **Repo:** https:\u002F\u002Fgithub.com\u002Fheygen-com\u002Fhyperframes\n- **Docs:** https:\u002F\u002Fhyperframes.heygen.com\n- **Agent skills** (recommended for authoring with Claude Code \u002F Cursor \u002F etc.):\n\n  ```bash\n  npx skills add heygen-com\u002Fhyperframes\n  ```\n\n  Then invoke `\u002Fhyperframes` to author compositions, `\u002Fhyperframes-cli` for CLI help, and `\u002Fgsap` for animation.\n\n## Notes on this project\n\n- The rendered video uses voiceover + SFX but no continuous underscore music track. If you're extending this example, add an `\u003Caudio>` element referencing your music file to `index.html`.\n- `npx hyperframes lint` surfaces a few pre-existing warnings (overlapping clips, GSAP tween overlap). The render still produces correctly; these are documented in `HANDOFF.md` as known punch-list items.\n\n## License\n\nThe HyperFrames framework is [Apache 2.0](https:\u002F\u002Fgithub.com\u002Fheygen-com\u002Fhyperframes\u002Fblob\u002Fmain\u002FLICENSE). This repository's composition source and media are published for reference use.\n","这是一个用于制作HeyGen的HyperFrames发布视频的实际生产项目，你可以克隆、预览和自行渲染。该项目展示了如何使用多种技术如CSS动画、GSAP、Lottie、着色器和Three.js等来组合一个复杂的视频。视频分辨率为1920×1080，帧率为30fps，由1个根组成文件（index.html）和17个子组成文件构成。适用于需要创建高质量宣传或演示视频的场景，特别是当内容涉及复杂的视觉效果和技术展示时。通过简单的命令即可开始预览和渲染，无需额外安装包。","2026-06-11 02:45:59","CREATED_QUERY"]