TL;DR

HyperFrames는 HTML과 CSS, 시간 속성(data-start·data-duration 등)으로 영상 구성을 정의하고 이를 헤드리스 크롬으로 프레임 단위 캡처한 뒤 FFmpeg로 인코딩해 항상 같은 입력이 같은 결과를 내는 결정론적 렌더링을 만든다. GSAP·Lottie·Three.js·CSS 등 다양한 애니메이션 런타임을 어댑터로 붙일 수 있고, 라우터 스킬 `/hyperframes`가 제품 소개 영상·PR 설명 영상·자막 삽입·모션 그래픽 등 목적별 생성 워크플로로 안내한다. CLI로 로컬 미리보기·렌더링을 할 수 있고 HeyGen이 실제 서비스에 쓰며 AWS Lambda로 분산 렌더링도 지원한다. React 없이 순수 HTML로 작성해 에이전트가 코드를 직접 다루기 쉽다는 점이 리모션 같은 React 기반 도구와의 핵심 차이다.

핵심 포인트

• React 컴포넌트 대신 순수 HTML+CSS로 영상을 정의해 빌드 단계 없이 index.html이 그대로 재생된다는 점이 Remotion과의 핵심 차이다.
• 19개 스킬이 제품 홍보 영상, PR 설명 영상, 자막·오버레이, 모션 그래픽, 슬라이드 등 목적별로 나뉘어 있고 라우터 스킬이 알맞은 워크플로로 안내한다.
• GSAP·Lottie·Three.js·Anime.js·WAAPI 등 여러 애니메이션 런타임을 어댑터로 바꿔 끼울 수 있어 특정 라이브러리에 종속되지 않는다.
• 로컬 렌더링 외에 AWS Lambda 분산 렌더링 경로를 제공해 대량 영상 파이프라인으로 확장할 수 있다.