# HTML Is All Agents Need — James Russo, HeyGen

## Executive summary

The presentation argues that HTML, CSS, and JavaScript are the native languages of Large Language Models (LLMs), making them the ideal foundation for agent-generated video content. The speaker introduces Hyperframes, an open-source framework designed to turn agents' generated HTML into deterministic MP4 videos. Key technical challenges addressed include overcoming browser asynchronous rendering issues by freezing time and seeking frame-by-frame, ensuring that complex elements like WebGL and SVGs are consistently rendered in the final video output.

## Key takeaways

- HTML as LLM Native Language: LLMs' training data is predominantly HTML, CSS, and JavaScript. Forcing them to use custom DSLs or JSON structures hinders performance compared to letting them operate in their native language.
- Hyperframes Framework: This open-source framework converts an agent's generated HTML into a video format, allowing anything renderable in a browser (e.g., 3.js, SVGs) to be included in the final MP4 output.
- Deterministic Video Rendering: Since browsers are designed to load asynchronously (great for web performance but bad for video consistency), Hyperframes solves this by freezing the clock and deterministically seeking frame-by-frame to ensure all assets are loaded before capturing each frame.
- Focus on Taste, Not Language: Instead of teaching agents a new framework language, the focus is placed on 'skills' that teach good video principles (taste), allowing for higher quality output from single-shot prompts.

## Technical details

- Video Composition Layers: Great videos require multiple layers beyond the main subject (A-roll). These include B-roll (images, assets), animations, captions, and music, all needing careful composition.
- LLM Output Format Preference: HTML, CSS, and JavaScript are preferred over custom formats like Lottie or Rive because they represent the LLMs' native language, leading to better output quality.
- Deterministic MP4 Rendering Process: To ensure consistent video frames, the process involves freezing the browser clock and deterministically seeking through time, waiting for all assets (fonts, images) to load before capturing a screenshot for each frame.
- Framework Architecture: The framework is designed around minimal wrappers, allowing agents to author workable code using plain HTML with metadata attributes for timing and structure.

## Practical implications

- Build engineers can integrate Hyperframes into existing agent pipelines, allowing product features built with coding agents to be easily turned into professional launch videos.
- The open-source nature of the framework means it is accessible and usable by any coding agent that understands HTML/CSS/JS.
- The focus on 'skills' allows engineering teams to improve video quality (the 'taste') without needing to retrain LLMs on a new, complex DSL.

## Topics

AI, Build Engineering, Web Development, LLM Integration, Hyperframes, Gemini Flash, DesignMD / FrameMD

Source: https://www.youtube.com/watch?v=Cz4v1WHVyZc