HeadsUpAI

HeyGen Adds Shaders and 3D Device Blocks to HyperFrames Catalog

HeyGen, an AI video generation platform specializing in digital twins, updated its open-source HyperFrames framework with a catalog of textures and shaders. This follows the release of HyperFrames HTML-in-canvas effects (rendering live web content inside 3D objects). The update includes a 3D showcase featuring GLTF (standard 3D file format) models of an iPhone and MacBook.
License
Apache 2.0
CLI command
npx hyperframes add <name>
3D models
iPhone 15 Pro Max and MacBook Pro
Visual effects
Textures, shaders, and HTML-in-canvas
Preview requirement
Chrome flag canvas-draw-element

This expansion shifts HyperFrames into a modular library for agentic video engineering. By providing pre-built blocks with automated camera choreography, HeyGen is removing the need for manual motion graphics work. AI agents can now assemble professional product reveals by calling specific visual components from the catalog.

You can now pull these effects into projects using the new npx hyperframes add <name> command. The 3D device models support live screen content, though a Chrome flag is required for live previews. The framework remains open source under the Apache 2.0 license and is available on GitHub.

View the full update on hyperframes.heygen.com
HeyGen
HeyGen
@HeyGen
X

Another @HyperFrames_ catalog update Wednesday: html-in-canvas effects Today: textures and shaders Every effect is one command to add for your next video npx hyperframes add &lt;name&gt; Comment + RT "shader" for this videos source code (must follow) https://t.co/X5wWTkQLBp

130retweets465likes
View on X

Still wondering? A few quick answers below.

HyperFrames is an open-source framework created by HeyGen that allows developers and AI agents to generate videos using web technologies like HTML, CSS, and JavaScript. It treats video as code, enabling deterministic rendering of MP4 files. This approach allows for programmatic control over video compositions, making it easier for automated systems to build professional motion graphics.

You can add new visual effects, textures, or shaders to your local project using the command-line interface. By running the command npx hyperframes add followed by the name of the specific component, the framework automatically downloads and integrates the asset into your composition. This modular system allows for rapid assembly of complex video blocks without manual file management.

The latest catalog update introduces high-fidelity 3D models of the iPhone 15 Pro Max and MacBook Pro. These models use the GLTF file format and feature live HTML-in-canvas screens, allowing you to render dynamic web content directly onto the device displays. They also include pre-configured camera choreography and morphing glass lenses for professional product showcases.

Yes, HyperFrames is an open-source framework released under the Apache 2.0 license. The source code and the full catalog of visual blocks are hosted on GitHub, allowing developers to use, modify, and contribute to the project. This open nature is designed to support a community of builders creating agent-native video workflows and programmable motion graphics.

To see live previews of advanced features like HTML-in-canvas screen content, you must use the Google Chrome browser with a specific technical flag enabled. Users need to activate the canvas-draw-element flag in their browser settings. However, when rendering videos through the command-line interface, the framework handles these requirements automatically to ensure the final MP4 file renders correctly.

Share this update