HyperFrames 진입점
HyperFrames는 HTML에서 비디오를 렌더링합니다. 컴포지션은 DOM이 data-* 속성으로 타이밍을 선언하고, 애니메이션 런타임을 탐색할 수 있으며, 미디어 재생이 프레임워크에 의해 제어되는 HTML 파일입니다. 전체 제작 계약은 /hyperframes-core에 있습니다. 컴포지션 HTML을 작성하기 전에 반드시 읽으십시오.
1. 프로젝트 상태에서 시작
일치하는 첫 번째 행을 적용하고, 아래 상태 행을 평가하지 마십시오.
| 상태 | 조치 |
|---|---|
| 기존 Remotion 소스를 HyperFrames로 명시적으로 포팅 | references/routes/remotion-to-hyperframes.md를 읽은 후 해당 워크플로우로 직접 라우팅하십시오. 의도 레이어를 건너뜁니다. |
| 기존 HyperFrames 프로젝트에 대한 특정 작업: 검사, 진단, 검증, 미리보기, 렌더링, 게시 또는 일괄 렌더링 | 해당 작업만 수행하십시오. 의도 및 워크플로우 라우팅을 건너뛰고, /hyperframes-cli 및 필요한 도메인 스킬을 로드하십시오. |
| 기존 프로젝트에 대한 특정 편집 | 편집을 수행하십시오. 의도 레이어를 실행하지 마십시오. |
BRIEF.md가 존재함 | workflow 및 flow를 읽으십시오. 해당 워크플로우를 실행하고, flow: companion은 항상 /general-video에서 실행됩니다. 브리프 관련 질문을 하지 마십시오. |
브리프는 없지만 hyperframes.json 또는 STORYBOARD.md가 존재함 | 프로젝트 파일과 기록된 기본 설정에서 재개하십시오. 기존 아티팩트에서 소유 워크플로우를 추론하십시오. 고유하게 결정할 수 없는 경우 라우팅 전용 질문 하나만 하고, 의도 인터뷰를 실행하지 마십시오. |
| 새로 생성 | 의도 레이어(references/intent-interview.md)를 실행한 후 § 2의 테이블을 사용하여 한 번 라우팅하십시오. |
새 요청이 주제나 입력을 식별하지 못하면 라우팅 전에 비디오의 내용을 물어보십시오. 질문하기 전에 기본 설정과 레시피를 확인하십시오(references/intent-interview.md, 1단계). figma.com 입력 또는 명명된 레시피는 인테이크를 변경할 뿐 라우팅을 변경하지 않습니다. 인터뷰의 "직교 입력 적응" 섹션이 둘 다 처리합니다.
프로젝트의 CLI를 최신 상태로 유지
스캐폴딩된 프로젝트는 package.json 스크립트에 hyperframes@<version>을 고정하여 렌더링이 재현 가능하도록 합니다. 핀은 자체적으로 업데이트되지 않으며, 이전 CLI의 고정된 실행은 이에 대한 경고를 출력하지 않습니다. 스크립트에 핀이 있는 프로젝트를 재개할 때, 렌더링에 영향을 주는 첫 번째 명령 전에 한 번 프로브하십시오.
npx hyperframes@latest upgrade --project . --check
프로브는 읽기 전용이며 핀을 최신 릴리스와 비교합니다. 명시적인 .을 유지하십시오. 이전 CLI 릴리스에서는 --project 뒤에 다른 플래그가 오면 해당 플래그를 디렉토리 값으로 사용합니다. 프로젝트가 뒤처져 있다고 보고하면(또는 CLI 출력에 이미 This project pins hyperframes@… (latest …)와 같은 stderr 알림이나 고정된 스크립트의 --json 결과에 _meta.updateAvailable: true가 표시되면), npx hyperframes@latest upgrade --project .로 적용한 후 npx hyperframes check로 확인하십시오. 확인 통과는 프로젝트의 컴포지션이 새 버전에서 여전히 유효함을 확인하는 것이지 렌더링 출력이 이전 핀과 프레임 단위로 동일하다는 것을 의미하지 않습니다. 따라서 성공적인 범프는 절대 조용하지 않습니다. 실행 요약에서 이전 버전과 새 버전의 이름을 명시하십시오. 컴포지션이 없는 프로젝트는 확인이 필요하지 않습니다. 확인이 실패하면 package.json 변경 사항을 되돌리고 고정된 버전을 계속 사용하며 프로젝트가 머무는 버전과 그 이유를 보고하십시오. 신호를 사용자에게 전달하지 말고 신호에 따라 조치하십시오. 범프된 핀을 확인하지 않은 상태로 두지 마십시오.
2. 새 생성 라우팅
첫 번째 일치하는 행을 사용하십시오. 요청된 결과물을 일치시키고, 단순히 언급된 단어나 파일 형식이 아닙니다.
| 우선순위 | 요청 | 워크플로우 |
|---|---|---|
| 1 | 기존 Remotion 소스를 명시적으로 포팅 | /remotion-to-hyperframes |
| 2 | 프레젠테이션, 피치 덱 또는 탐색 가능한 대화형 덱 제작 | /slideshow |
| 3 | 기존 인물 영상에 (변경 없이) 일반 자막 또는 자막 추가 | /embedded-captions |
| 4 | 기존 인물 영상, 인터뷰 또는 팟캐스트 영상에 (영상 변경 없이) 디자인된 그래픽 오버레이 추가 | /talking-head-recut |
| 5 | 음악 트랙에서 내레이션이나 웹사이트 캡처 없이 비트 동기화 비디오 제작 | /music-to-video |
| 6 | 명시적으로 짧고, 내레이션이 없으며, 모션 중심의 단위(일반적으로 10초 미만) 생성 | /motion-graphics |
| 7 | PR 참조에서 GitHub 풀 리퀘스트 또는 코드 변경 설명 | /pr-to-video |
| 8 | URL 또는 사이트별 브리프에서 웹사이트, 제품 사이트, 앱 또는 회사 마케팅 또는 홍보 | /product-launch-video |
| 9 | 발명된 비주얼과 제품/사이트 캡처 없이 주제, 기사 또는 노트 설명 | /faceless-explainer |
| 10 | 기타 모든 사용자 지정 비디오 또는 컴포지션 | /general-video |
경로를 확정하기 전에 references/routes/<workflow>.md를 읽으십시오. 각 경로에 대한 하나의 작은 파일로, 표준 입력/출력/트리거 계약(지연 설치된 워크플로우 스킬이 있기 전에 사용 가능)과 해당 경로의 인터뷰 항목이 포함되어 있습니다. 후보가 계약을 충족하지 않으면 일치를 강제하지 말고 계속 라우팅하십시오. 일치하는 경로의 파일만 읽으십시오.
일반적인 모호성 해결
- 짧은 애니메이션 타이틀, 로고 스팅, 통계 히트, 차트 히트, 지도 히트 또는 독립형 하단 써드(thirds)는 내레이션이 없고 모션이 메시지인 경우
/motion-graphics입니다. 정적 타이틀 카드, 내레이션이 포함된 시퀀스, 더 긴 몽타주 또는 사용자 지정 루프는/general-video입니다. - 명시적으로 짧은 모션 그래픽은 URL, 트윗, 기사 또는 스크린샷을 소스 자료로 사용할 수 있습니다. 일반적인 "이 사이트에서 비디오를 만들어 주세요" 요청은
/product-launch-video입니다. - 자막이 있는 기존 영상은
/embedded-captions로 라우팅되고, 디자인된 정보 카드가 있는 영상은/talking-head-recut으로 라우팅됩니다. 영상의 재타이밍, 재정렬, 색상 변경, 재구성 또는 리믹스는 사용자 지정 편집이며/general-video로 라우팅됩니다. - 음악 파일은 비트 그리드가 작품을 주도하는 경우에만
/music-to-video를 선택합니다. 배경 음악으로 사용되는 음악은 주제 일치 경로를 재정의하지 않습니다. - "스토리보드를 원합니다"는 워크플로우가 아닌 검토 프로세스를 변경합니다. 다른 라우팅 신호가 없으면
/general-video를 사용하십시오. 확인된 스케치 보드 자체가 요청된 결과물일 수 있습니다. 검토 루프가 해당 중지 지점을 정의합니다. - 전문 내러티브 워크플로우는 약 3분까지 지원하며 30-90초에서 가장 강력합니다. 분명히 더 긴 작품은
/general-video로 라우팅하십시오. 길이는 명시적인 포트, 덱, 자막, 오버레이 또는 음악 기반 결과물을 재정의하지 않습니다.
3. 한 번 라우팅한 후 종료
새 생성의 경우 의도 레이어(references/intent-interview.md)가 전체 대화(메모리, 분류, 피치 라운드, 필수 사항, 실행 형태, 전달)를 실행하고 BRIEF.md를 작성하여 종료합니다. 브리프는 워크플로우가 읽는 유일한 라우팅 아티팩트입니다; 이후에 이 스킬이나 인터뷰를 다시 열지 않습니다. 이후 "경로에 무엇이 필요했는지"에 대한 모든 질문은 BRIEF.md에서 답하십시오.
4. 워크플로우 설치 및 진입
선택한 워크플로우를 읽기 전에 해당 워크플로우와 핵심 도메인 스킬을 설치하거나 새로 고치십시오.
npx hyperframes skills update <workflow-name>
/ 없이 기본 이름을 사용하십시오. 명령이 실패하면 오류를 표시하고 메모리에서 워크플로우를 재구성하지 마십시오. 설치에 관한 기타 모든 사항(핵심 대 지연 분할, init이 새로 고치는 내용, 진단, CI 옵트아웃, CLI 없는 대체)은 references/skill-lifecycle.md에 있습니다.
5. 필요 시 도메인 스킬 로드
| 필요 | 스킬 |
|---|---|
| 컴포지션 구조, 타이밍 속성, 트랙, 변수, 결정론 | /hyperframes-core |
| 모션 규칙, 씬 청사진, 전환, 런타임 어댑터 | /hyperframes-animation |
탐색 안전 GSAP, CSS, Anime.js, WAAPI, FLIP, 경로, 마스크, SVG, 3D 키프레임 또는 hyperframes keyframes 진단 | /hyperframes-keyframes |
| 디자인 사양, 콘셉트, 팔레트, 타이포그래피, 나레이션, 비트 계획 | /hyperframes-creative |
| 이미지, 아이콘, 로고, 오디오, 캡션, 그레이딩, LUT, 재사용 가능 미디어 | /media-use |
| 보이스오버 분할, 오디오 이펙트 체인, 오토메이션 엔벨로프, 또는 여러 트랙(서브믹스 버스)에 걸친 하나의 체인/페이더 | /hyperframes-audio |
| 초기화, 린트, 확인, 스냅샷, 비교, 배치 렌더, Studio, 렌더, 게시 또는 진단 | /hyperframes-cli |
| 레지스트리 블록 및 컴포넌트 | /hyperframes-registry |
| Figma 애셋, 토큰, 컴포넌트 또는 재구성된 모션으로서의 스토리보드 프레임 | /figma |
크리에이터 편집 구문은 도메인 간 요청입니다. 일치하는 행에 명명된 모든 스킬을 로드하십시오.
| 크리에이터 요청 | 필요한 도메인 |
|---|---|
| "이 영상 잘라내기", 하드 컷, 트림, 접합, 재정렬 또는 소스 범위 사용 | /general-video + /hyperframes-core; core는 data-start, data-duration, data-media-start 및 트랙 레이아웃을 소유합니다. |
| 여기 확대, 펀치 인/아웃, 부드러운 다중 상태 확대/재구성, Ken Burns 또는 카메라 이동 | /general-video + /hyperframes-core + /hyperframes-keyframes; 시간이 지정된 클립이 아닌 내부 시각적/크롭 래퍼에 애니메이션을 적용합니다. |
| 매치 컷 또는 휩 팬 카메라 전환 | /general-video + /hyperframes-animation + /hyperframes-keyframes + /hyperframes-registry; 수동 제작 전에 전환 프리미티브를 검색/설치합니다. |
| 페이드, 크로스페이드, 트랙 게인/볼륨, 오토메이션, 덕/분할, 오디오 효과 또는 여러 트랙에 걸친 하나의 효과 | /general-video + /hyperframes-core + /hyperframes-audio; core는 클립을 배치하고, 오디오 믹스는 배치된 트랙(그룹에 대한 서브믹스 버스 포함)을 믹싱합니다. |
| 컷과 카메라 모션 또는 믹싱을 결합한 사진 및 사운드 편집 | /general-video + /hyperframes-core + 시각적 모션이 있는 경우 /hyperframes-keyframes + 사운드가 페이드, 믹스, 덕, 오토메이션 또는 처리되는 경우 /hyperframes-audio |
| 미디어 소싱 또는 생성, 또는 지원되지 않는 속도 램프/소스 내 정지 전처리 | /media-use; 소싱/생성/전처리만, 배치된 트랙 믹싱은 안 됨. |
상수 data-playback-rate는 사진 및 피치 보존 사운드에 대해 렌더링 안전합니다. 소스 속도 램프를 키프레임 가능하게 만들지 않습니다. 램프를 전처리하십시오. 복사 가능한 편집 계약을 보려면 /hyperframes-core → references/creator-editing-recipes.md를 로드하십시오.