스킬 자체의 표현으로
HyperFrames 슬라이드쇼를 제작합니다 — 프레젠테이션, 투자 제안 덱, 또는 개별 슬라이드, 프래그먼트 리빌, 분기, 핫스팟 내비게이션과 발표자 노트가 포함된 프레젠터 모드를 갖춘 인터랙티브 덱입니다. 기존 페이지를 덱으로 변환하기도 합니다. 결과물은 렌더링된 MP4가 아니라 hyperframes가 적용된 탐색 가능한 덱입니다. JSON island 스크립트 블록을 사용해 슬라이드와 연결을 선언합니다. 프래그먼트(슬라이드 내 리빌 대기 지점), 핫스팟을 통한 오프라인 시퀀스로의 분기, 편집 가능한 노트가 BroadcastChannel을 통해 동기화되는 프레젠터 모드를 지원합니다.
명시적으로 요청되지 않는 한 제작 전에 확인을 요구합니다. 엄격한 슬라이드 작성 규칙을 적용합니다: 완결된 문장 형태의 주장으로 이루어진 헤드라인, 슬라이드당 하나의 아이디어, 상향식 시장 규모 산정, 최소 30pt 폰트. 이름이 지정된 비주얼을 직접 만들기 전에 라이브 카탈로그를 먼저 검색합니다. 원본 페이지를 옮길 때는 원래의 디자인, 모션, 인터랙션, 미디어 동작을 유지하면서 페이지 이동을 슬라이드 간 전환으로 변환합니다.
산출물
- 장면, 클립, GSAP 타임라인, JSON island 매니페스트로 구성된 HyperFrames 컴포지션
- 발표자 노트가 포함된 프레젠터 모드를 갖춘, hyperframes가 적용된 탐색 가능한 덱
작동 방식
- 01의도 확인
사용자가 명시적으로 슬라이드쇼를 요청한 경우 진행합니다. 그렇지 않으면 잠시 멈추고 HyperFrames 슬라이드쇼가 의미하는 바(실행 가능한 덱, 내비게이션, 프레젠터 모드)를 설명한 후 확인을 요청하십시오.
- 02타이밍 속성으로 장면 선언하기
모든 슬라이드는 장면(scene)을 기반으로 합니다. data-composition-id, data-start, data-duration, data-label을 사용해 각 장면을 선언하십시오.
- 03JSON 아일랜드 추가
컴포지션 HTML에 type이 application/hyperframes-slideshow+json인 스크립트 블록을 정확히 하나 추가합니다.
- 04엄격한 규칙에 따라 슬라이드 작성
헤드라인은 완결된 문장 형태의 주장이어야 합니다. 슬라이드당 하나의 아이디어와 하나의 비주얼만 사용합니다. 핵심 메시지를 먼저 제시합니다. 시장 규모는 상향식(bottom-up) 방식으로만 산정합니다. 폰트는 최소 30pt 상당을 유지합니다.
- 05비주얼을 제작하기 전에 카탈로그 검색
슬라이드에 필요한 룩, 이펙트, 차트, 트랜지션마다 npx hyperframes catalog --query를 평이한 영어로 실행하고, 작성에 앞서 상위 결과를 확인합니다.