demo-video — URL→Remotion 런치

데모 비디오 제작 스킬

회사 URL 또는 제품 자산으로부터 정제된 제품 데모 비디오를 제작합니다. 기본 출력은 60-90초 1080p+ 비디오이며, 머신, 자산 및 전달 대상이 지원하는 경우 4K로 렌더링합니다.

운영 기준

• 실제 제품 표면(웹사이트 페이지, 앱 화면, 로그인된 워크플로, 스크린샷, 사용자 제공 자산 또는 확인된 공개 데모)을 기반으로 비디오를 제작합니다.
• URL만 입력으로 제공되어도 시작하기에 충분합니다. 사이트에서 제품, 대상 고객, 핵심 워크플로 및 브랜드 시스템을 추론한 후, 누락된 액세스 또는 영향력이 큰 선호 사항에 대해서만 질문합니다.
• 일반적인 마케팅보다는 제품 관리자 스토리텔링을 선호합니다. 사용자가 가진 문제, 제품 내에서 수행하는 작업, 화면에 나타나는 변화, 그리고 그 결과가 중요한 이유를 보여줍니다.
• 모션 컴포지션에는 실용적인 경우 Remotion을 사용하고, 검사, 인코딩, 콘택트 시트, 오디오 처리 및 전달 변환에는 FFmpeg를 사용합니다.
• 주장은 방어 가능하게 유지합니다. 출처 자료에서 확인되지 않은 메트릭, 고객 로고, 탐지기 결과, 통합, 규정 준수 상태 또는 가격을 만들어내지 마십시오.
• 이전 클라이언트에 과적합하지 않도록 합니다. 워크플로, 품질 게이트 및 모션 패턴은 재사용하되, 클라이언트별 스크린샷, 카피, 색상, 가격, 페르소나 또는 버전별 수정 사항은 재사용하지 마십시오.

입력

사용자가 웹사이트 URL만 제공하는 경우:

1. 브라우저에서 사이트를 열고, 내비게이션, 가치 제안, 제품 페이지, 가격, 도움말 문서 및 표시되는 대화형 상태를 매핑합니다.
2. 제품을 가장 잘 설명하는 페이지 및 UI 표면의 고해상도 스크린샷을 캡처합니다.
3. 사이트에서 발견된 가장 강력한 제품 루프를 중심으로 내러티브를 구축합니다.
4. 로그인된 제품 영역이 필요한 경우 액세스 경계를 명시합니다.

사용자가 더 많은 컨텍스트를 제공하는 경우, 이를 사용하여 품질을 높입니다.

• 대상 고객, 캠페인 플랫폼, 종횡비, 선호 지속 시간, CTA, 출시 목표.
• 제품 워크플로 단계, 데모 계정 액세스, 샘플 입력 또는 예상 전후 출력.
• 브랜드 자산, 스크린샷, 비디오 참조, 글꼴, 음악 방향, 금지된 주장 및 법적 참고 사항.

참조 라우팅

• 브라우저 조사, 로그인된 캡처 또는 스크린샷 작업 전에 references/capture-workflow.md를 읽습니다.
• 스크립트, 스토리보드, 샷 목록 또는 제품 내러티브를 작성하기 전에 references/storytelling.md를 읽습니다.
• 모션 언어, 타이포그래피, 전환, 레이아웃 또는 음악을 선택하기 전에 references/visual-system.md를 읽습니다.
• 비디오 프로젝트를 구현하거나 파일을 렌더링하기 전에 references/remotion-ffmpeg.md를 읽습니다.
• 비디오 완료를 선언하기 전에 references/qc-checklist.md를 읽습니다.

제작 워크플로

1. 전달물 범위 설정

   • 가능한 경우 대상 지속 시간, 종횡비, 해상도, 언어 및 전달 플랫폼을 확인합니다.
   • 기본값은 16:9, 60-90초, 30fps, H.264 MP4, 최소 1080p입니다.
   • 요청 시 또는 비디오가 출시, 투자자, 컨퍼런스 또는 유료 광고 배포에 사용될 경우 4K를 사용합니다.

2. 제품 조사

   • 홈페이지 약속뿐만 아니라 핵심 루프를 식별하기 위해 웹사이트 및 제품 페이지를 충분히 깊이 탐색합니다.
   • 빠른 기능 맵을 구축합니다: 주요 사용자, 진통점, 기본 작업, 표시되는 제품 출력, 증거, CTA.
   • 제품이 로그인 뒤에 있는 경우 사용자의 활성 브라우저 세션을 사용하거나 로그인을 요청한 다음 인증된 UI에서 계속합니다.

3. 제품 증거 캡처

   • 가능한 경우 2배 이상의 장치 배율로 데스크탑 스크린샷을 캡처합니다.
   • 변환을 설명하는 채워진 상태와 빈 상태를 모두 캡처합니다.
   • dashboard-empty.png, workflow-result.png, pricing.png와 같이 장면 및 상태별로 자산 이름을 지정합니다.
   • URL, 페이지 제목, 캡처 시간, 뷰포트, 파일 이름 및 메모가 포함된 매니페스트를 유지합니다.

4. 제품 스토리 작성

   • 사용자의 문제 또는 원하는 결과를 평이한 언어로 시작합니다.
   • 다음 순서로 제품 루프를 진행합니다: 설정, 작업, 변환, 검토/증거, 더 넓은 워크플로, CTA.
   • 텍스트는 동영상에 충분히 짧게 유지합니다. 자막을 앵커로 사용하고 단락으로 사용하지 마십시오.
   • 대상 고객에게 자연스러운 카피를 사용합니다. 제품이 실제로 그렇게 말하지 않는 한 "생산성 잠금 해제"와 같은 일반적인 AI 문구는 피하십시오.

5. 모션 시스템 설계

   • 브랜드의 실제 색상과 타이포그래피를 기본으로 사용하고, 계층 구조를 개선하는 경우 절제된 디스플레이 글꼴 또는 악센트 페이스를 하나 추가합니다.
   • 제품 스크린샷을 히어로 자산으로 사용합니다. 브라우저 프레임, 커서 경로, 확대/축소, 마스크, 스캔 라인, 비교 패널 또는 운동 타이포그래피는 워크플로를 명확히 하는 경우에만 추가합니다.
   • 제품과 일치하는 전환을 선택합니다: 유체 변환에는 액체/리플, 분석에는 스캔 와이프, 증거에는 스포트라이트 공개, 탐색에는 공간 푸시, 전후 비교에는 분할 비교.
   • 모션을 연속적으로 유지합니다. 장면 전환은 별도의 슬라이드가 아닌 카메라 또는 인터페이스가 하나의 제품 스토리를 통해 이동하는 것처럼 느껴져야 합니다.

6. 빌드 및 렌더링

   • 프로젝트 스캐폴드가 유용한 경우 assets/remotion-starter/의 스타터 템플릿을 사용합니다.
   • 최종 비디오를 렌더링하기 전에 리뷰 스틸 또는 콘택트 시트를 렌더링합니다.
   • QA를 위해 먼저 1080p를 렌더링한 다음 요청 시 4K 최종본을 렌더링합니다.
   • FFmpeg 또는 ffprobe를 사용하여 지속 시간, 해상도, 코덱, 프레임 속도 및 오디오 스트림을 확인합니다.

7. 전달 전 QA

   • 텍스트가 겹치거나, 어색하게 잘리거나, 빠른 컷에서 읽을 수 없게 되는지 확인합니다.
   • 버튼, 커서, 콜아웃 및 마스크가 기본 UI와 정렬되는지 확인합니다.
   • 모든 스크린샷이 최종 크기에서 충분히 선명한지 확인합니다.
   • 음악이 기악이며, 권리 문제가 없고, 보이스오버나 SFX 아래에서 균형이 잡혀 있는지 확인합니다.
   • 최종 MP4와 함께 유용한 제작 아티팩트(스토리보드, 자산 매니페스트, 콘택트 시트, 관련된 경우 소스 프로젝트)를 제공합니다.

재사용 가능한 스크립트

• scripts/create_demo_brief.py는 URL과 선택적 제품 컨텍스트에서 구조화된 브리프를 생성합니다.
• scripts/qc_video.py는 ffprobe로 최종 비디오 메타데이터를 검사하고 해상도, 지속 시간, 코덱 및 오디오 문제를 플래그합니다.
• scripts/make_contact_sheet.py는 FFmpeg로 빠른 검토를 위한 시각적 콘택트 시트를 생성합니다.

프로젝트 폴더 또는 절대 경로로 스크립트를 실행합니다. 이들은 시각적 판단을 대체하는 것이 아니라 도우미입니다.

스타터 템플릿

새 비디오를 시작할 때 assets/remotion-starter/를 작업 프로젝트로 복사합니다. src/demoConfig.ts의 플레이스홀더 구성을 교체하고, public/ 또는 Remotion 정적 자산에 스크린샷을 추가하고, 장면을 제품 내러티브에 맞게 조정합니다.

스타터는 의도적으로 일반적입니다.

• 오프닝, 워크플로, 증거 및 CTA 장면이 포함된 제품 스토리 컴포지션이 포함됩니다.
• 실제 스크린샷 슬롯을 사용하지만 깔끔한 UI 플레이스홀더로 대체됩니다.
• 페이드, 줌, 레일 이동, 커서 강조 및 비교 패널을 위한 모션 프리미티브가 포함됩니다.
• 클라이언트별 카피, 색상 또는 자산을 피합니다.

완료 기준

다음 조건이 충족될 때까지 비디오가 완료되었다고 간주하지 마십시오.

• 제품 스토리가 실제 제품 증거에서 파생되었습니다.
• 최종 렌더링이 최소 1080p이거나 사용자가 명시적으로 낮은 대상을 수락했습니다.
• 비디오가 스틸, 미리보기 렌더링 또는 콘택트 시트를 통해 시각적으로 검사되었습니다.
• FFmpeg/ffprobe 메타데이터가 해상도, 지속 시간, 비디오 코덱 및 오디오 상태를 확인했습니다.
• 음악, 글꼴, 스톡 푸티지 또는 타사 페이지에 대한 모든 라이선스 또는 소스 경계가 문서화되었습니다.
• 사용자가 계획이나 스크립트뿐만 아니라 구체적인 비디오 파일을 받습니다.