
이 Skill로 렌더링한 결과
분해 레이어 스택 v1.0.0
아이소메트릭 판 네 장이 분리되며 층마다 라벨이 붙고, 잠시 머문 뒤 다시 하나로 착 합쳐집니다.
- 포맷
- 영상 · 16:9
- 길이
- 0:05
5초짜리 "안에 뭐가 들었나" 장면을 위한 무료 HyperFrames 블록입니다. 아이소메트릭 판 네 장이 위아래로 벌어지며 각각 번호 라벨과 고유한 그림을 얻고, 잠시 머문 뒤 다시 하나의 스택으로 합쳐집니다. 제목, 네 층의 이름, 강조색, 배경은 변수입니다.
2026년 11월 3일 업데이트
받게 되는 것
- 5초 길이의 1920×1080 MP4
- 분리됐다 다시 쌓이는, 라벨이 붙은 아이소메트릭 층 네 개
- 제목, 층 이름, 색상 두 가지 변수
잘 맞는 경우
- "안에 뭐가 들었나" 제품 장면
- 아키텍처, 시스템 다이어그램
- 기능 설명과 온보딩
맞지 않는 경우
- 실제 제품 층을 찍은 사진
- 네 개가 넘는 층
이 Skill에 대하여
/exploded-stack "Inside the Halden Solace"라는 제목으로 분해 스택을 만들어 줘. 층은 Knit upper, Foam midsole, Carbon plate, Grip outsole. 강조색 #E2552B, 배경은 따뜻한 오프화이트.
무엇으로 만들어졌는지 보여 주면 신뢰가 빠르게 쌓입니다. Exploded Layer Stack은 제품이나 시스템을 라벨이 붙은 네 층으로 분해했다가 다시 조립합니다. 단 5초면 됩니다. 소프트웨어 아키텍처용으로 만들어졌지만 신발, 매트리스, 스킨케어 루틴, 요금제에도 똑같이 잘 어울립니다.
작동 방식
- 요청: 제목과 위에서 아래 순서의 층 이름 네 개, 강조색을 에이전트에게 알려 줍니다.
- 채우기: 문구와 색을 블록 변수에 넣고, 텍스트는 레이아웃이 설계된 길이에 가깝게 맞춥니다.
- 렌더링:
npx hyperframes render로 초안을 렌더링해 몇 프레임을 확인한 뒤 최종 MP4를 렌더링합니다. - 재사용: 변수는 작은 JSON 파일 하나에 들어 있어, 다음 버전도 렌더링 한 번이면 됩니다.
팁
- 층 이름은 각각 두세 단어로 쓰세요.
- 제품이 실제로 만들어진 순서대로 위에서 아래로 배치하세요.
- 강조색은 브랜드 색으로 고르세요. 활성화된 층을 비춥니다.
- 긴 설명 영상 속 "작동 방식" 장면으로 넣어 보세요.
오픈소스
HyperFrames 레지스트리 블록입니다. HeyGen과 HyperFrames 기여자들이 만들어(heygen-com/hyperframes) Apache License 2.0으로 공개했습니다. 다운로드에는 에셋이 포함된 블록과 Reelity가 작성한 SKILL.md가 들어 있어 에이전트가 바로 채우고 렌더링할 수 있으며, HyperFrames 자체는 npm에서 실행됩니다.
시작 전에 필요한 것
- 준비물
- 제목, 층 이름 네 개, 강조색.
- 의존성
- Node.js 22 이상 — 필수 · FFmpeg — 필수
- 외부 비용
- 없습니다. HyperFrames는 무료 오픈소스이며 내 컴퓨터에서 렌더링됩니다.
- 마지막 테스트
- v1.0.0 —
사용자 리뷰
아직 리뷰가 없습니다. Skill을 설치하고 첫 평가를 남겨 보세요.
자주 묻는 질문
층을 네 개보다 많이 쓸 수 있나요?
블록에는 네 층이 있습니다. 더 필요하면 에이전트가 층을 바꿔 두 번 렌더링하고 이어 붙일 수 있습니다.
판에 제품 사진을 넣을 수 있나요?
아니요. 판은 단순한 그림이고, 의미는 라벨이 전합니다.
왜 무료인가요?
HeyGen과 HyperFrames 기여자들의 오픈소스 HyperFrames 블록입니다. 그대로 소개하며, 에이전트가 쓸 수 있도록 SKILL.md를 더하고 저희 하우스 브랜드 중 하나인 Halden Solace로 만든 샘플을 함께 올렸습니다.






