I Made a Promo Video Using Hyperframes Keyframes + Three.js + Hermes

The creator demonstrates producing a polished 45-second promotional video for their OnChain Agent project by combining HyperFrames, keyframes with arc motion, Three.js, and Hermes Agent, highlighting smooth animations, AI-generated assets, and 3D visual enhancements. Despite initial challenges, iterative feedback and integration of new tools result in a visually appealing video showcasing the potential of AI-driven animation workflows.

In this video, the creator explores making a promotional video for their new project, OnChain Agent, using a combination of HyperFrames, keyframes with arc motion, Three.js, and Hermes Agent. HyperFrames is highlighted as a popular tool for creating videos with AI agents, and the recent open-sourcing of keyframes allows for smoother, more natural motion in animations. The creator plans to incorporate a robot icon central to the project, generate additional assets using GPT image generation, and experiment with integrating 3D elements via Three.js to enhance the visual appeal of the promo.

The process begins with brainstorming and planning the video concept using Hermes Agent. The creator inputs a detailed prompt outlining the desired 45-second cinematic promo, featuring a robot guiding a human through a 3D node graph tunnel representing blockchain data flows. The plan includes using arc motion for smooth animations, image generation for character assets, and a call to action featuring a recurring character named Tone B. The creator emphasizes the importance of providing exact documentation links to Hermes Agent to ensure it uses the correct skills and tools during production.

After setting up the necessary software and dependencies, including HyperFrames, FFmpeg, and the keyframe skill, the creator initiates the image generation and animation process. The initial preview reveals some issues such as awkward character poses, overlapping text, and misaligned elements. The creator iteratively provides feedback to Hermes Agent, requesting fixes like replacing stick-figure humans with generated images, repositioning characters, and improving the integration of 3D elements. Despite some challenges, the robot animation and arc motion effects show promise.

Subsequent revisions improve the video significantly, with better positioning of elements, clearer visuals, and a more convincing use of 3D effects through Three.js, although the integration is somewhat simulated rather than fully native. The arc motion keyframes add smooth, curved movements that enhance the overall animation quality. The creator expresses satisfaction with the progress, noting that the video style is now suitable for various ad formats and that the workflow demonstrates the potential of combining these AI and animation tools effectively.

In conclusion, the creator successfully produces a polished 45-second promo video within about two hours, primarily using free tools except for a paid Codex subscription. They highlight the value of experimenting with new features like arc motion and integrating 3D elements to elevate video quality. The video ends with an invitation for viewers to share their experiences with HyperFrames and suggestions for further enhancements, signaling ongoing exploration and content creation using these innovative AI-driven video production tools.