Product & UI · Jul 8, 2026
Day 2 of 30 Days of HyperFrames: Give your brand a motion language (DESIGN.md → FRAME.md)
Day 2 of 30 Days of HyperFrames: Give your brand a motion language (DESIGN.md… by heyaudrey-. Watch the Product & UI video and visit the original Reddit post.
heyaudrey-u/heyaudrey-
View on Reddit*HyperFrames by HeyGen is an open-source framework that turns HTML into video.* *Over the next 30 days, the HeyGen team will be dropping one micro-lesson a day to take you from zero to building launch videos with your AI agent locally, in whatever coding agent you use.* Day 1 was about getting HyperFrames installed and rendering something. Day 2 is about taking your HyperFrames videos past a default template using motion language. **What a motion language actually is** A motion language is a small set of decisions locked in as constants: * Your brand colors as CSS custom properties * Two or three named easing curves that match the feel of your product * Duration tokens that keep every scene at the same rhythm * A consistent entry/exit pattern for text and UI elements Write these once in `:root` and every composition you generate from that point forward will look like yours, not generic. **Try it now** Paste this into the `<head>` of your `index.html` and reference it in every…
The prompt behind it.
The creator has not shared a public prompt. Visit the original post for more about this work.
Video and prompt by heyaudrey-. Original post ↗


