NAVI: 자연스러운 AI 데모 영상은(는) 무엇을 하나요?
NAVI는 "X 데모 만들어줘"라는 요청을 바로 자막이 포함된 MP4 영상으로 바꿔줍니다. 얼굴도, 마이크도 필요 없고, 무언가를 읽는 듯한 느낌이 아닌, 사람이 설명하는 듯한 목소리를 제공합니다.
상태: 개발 중입니다.
ui/폴더의 로컬 앱은 샘플 데이터와 함께 완료되었습니다. 엔진(음성 타임스탬프, 타이밍, 녹화, 블러, 렌더링)은 현재 구축 중입니다. 출시될 때까지는 어떤 단계를 실제로 실행할 수 있고 어떤 단계가 아직 제공되지 않는지 사용자에게 명확히 알려주세요. 단계가 실행된 것처럼 가장하지 마십시오.
먼저: 실행 환경 확인
NAVI는 사용자 본인의 컴퓨터에서 실행되어야 합니다. 사용자 브라우저에서 로컬 앱을 열고, 테스트 계정으로 로그인할 두 번째 브라우저 창을 열며, 화면을 녹화하고 키를 사용자의 키체인에 보관합니다. 이는 Claude Code(터미널, IDE 또는 데스크톱 앱의 Code 탭)에서 작동합니다.
만약 클라우드 샌드박스(일반 claude.ai 채팅 또는 사용자 컴퓨터에 접근할 수 없는 세션)에서 실행 중이라면, 바로 한두 문장으로 알려주십시오: NAVI는 녹화를 위해 사용자 컴퓨터의 Claude Code가 필요하며, 여기서는 나중에 녹화할 준비가 된 스크립트(말하기 버전 + 자막)를 작성하고 다듬을 수 있다고 말입니다. 샌드박스에서 설치, 녹화 또는 ElevenLabs 호출을 시도하지 마십시오.
사용 시기
- "<사이트 또는 앱>의 데모 영상 / 워크스루 / 제품 둘러보기 / 튜토리얼 만들어줘"
- "<웹 앱>에서 <작업>하는 방법을 음성 해설과 함께 녹화해줘"
- "내 데모의 3번째 섹션 다시 해줘", "좀 더 차분하게 만들어줘", "1분 20초에 있는 이메일 블러 처리해줘"
해당 없음: 데스크톱 앱, 실제 사람이 카메라에 나오는 영상, 음성 복제.
기본 규칙 (항상)
- 사이트에 비밀번호, 코드 또는 키를 절대 입력하지 마십시오. 브라우저가 열리면 사용자가 직접 로그인하며, 이상적으로는 가짜 데이터가 있는 테스트 계정을 사용합니다.
- ElevenLabs 키를 절대 출력, 로그 또는 커밋하지 마십시오. 키체인 또는 사용자의 로컬 키 파일에서만 읽고, ElevenLabs로만 보냅니다.
- 무언가를 설치하기 전에 먼저 물어보십시오 (Playwright, ffmpeg, 타이밍 모델). 무엇이고 대략적인 크기가 얼마인지 말합니다.
- 크레딧을 사용하기 전에 크레딧 비용을 보여주십시오 (샘플, 녹화, 재작업).
- 프라이버시 등급은 선택 사항이 아닙니다. 1등급은 항상 블러 처리됩니다. 사용자가 금액 또는 다른 사람의 데이터를 켤 때 경고합니다.
- 영상에 맞추어 음성을 절대 일시 중지하거나 속도를 높이지 마십시오. 대신 영상이 대기하거나 늘어납니다.
- 블러 처리는 위험을 줄여주지만 완전히 없애주지는 않는다고 명확히 말합니다. 사용자는 게시 전에 반드시 시청해야 합니다.
워크플로우
0. 첫 실행 (한 번만)
- ElevenLabs API 키(Starter 플랜 이상, 텍스트 음성 변환 접근 권한)를 요청합니다. 테스트하고 남은 크레딧을 보여줍니다. 시스템 키체인(macOS) 또는 스킬 폴더 외부의 로컬 파일(Linux, 사용자만 읽을 수 있음)에 저장합니다.
- Playwright, ffmpeg 및 타이밍 모델이 있는지 확인합니다. 물어본 후 누락된 것을 설치합니다.
- 먼저 데모할 사이트를 묻고 사용자가 로그인할 수 있도록 브라우저를 엽니다. 사이트별로 세션을 저장합니다.
- 재방문 사용자는 이 모든 단계를 건너뜁니다. 데모마다 사이트만 변경됩니다.
1. 브리핑
최소한의 질문으로 다음을 파악합니다: 무엇을 보여줄지, 어떤 사이트인지, 시청자 수준(초보자 / 약간의 경험 / 전문가), 길이(1, 3, 5 또는 8분), 화면에서 숨길 내용, 그리고 어떤 음성을 사용할지. 자막 및 모서리 레이블은 사용자가 따로 지정하지 않는 한 저장된 기본값(자막은 영상에 포함, 모서리 레이블 없음)을 사용합니다. 사용자가 요청하지 않은 워터마크, 브랜드 이름, "예시" 태그 또는 기타 오버레이를 절대 추가하지 마십시오. 모든 것을 묻기보다는 합리적인 기본값을 사용하십시오. 새 사이트는 일회성 로그인이 필요합니다.
사용자가 중간에 방향을 바꾸면("대신 지급 페이지 데모로 만들어줘"), 현재 데모를 초안으로 유지하고 사용자가 말한 내용을 바탕으로 새 브리핑을 시작합니다.
2. 탐색
저장된 세션을 사용하여 Playwright로 사이트를 엽니다. 정확한 클릭 위치, 작업에 필요한 필드, 느리게 로드되는 항목 및 화면을 매핑합니다. 실제 데이터를 변경하지 말고 테스트 계정에 그대로 두십시오.
3. 스크립트
비디오를 짧은 섹션(약 15초에서 35초)으로 나눕니다. 각 섹션에 대해 두 줄을 작성합니다:
- 말하기 버전(음성이 말하는 내용): 사람이 실제로 소리 내어 설명하는 방식입니다. 화면이 필요할 때 작은 재시작, 반응 및 의견을 포함하지만, 불필요한 말은 최소화합니다.
- 자막 버전(화면에 표시되는 내용): 깔끔하고 짧으며 불필요한 말이 없습니다.
reference/voice-rules.md를 따릅니다. 두 버전을 나란히 보여주고 크레딧을 사용하기 전에 승인을 받습니다.
4. 음성
- 데모 종류(코스 워크스루, 빠른 SaaS 데모, 제품 둘러보기)에 맞는 음성의 권장 설정으로 시작합니다.
- 슬라이더 및 안전 범위: 캐주얼함 3
8, 에너지 16, 속도 0.94x1.08x, 머뭇거림 03, 숨소리 02, 욕설 02(지시문 내에서는 절대 사용 금지, 사용자가 요청하지 않는 한 자막은 깔끔하게 유지). - 텍스트 미리보기는 무료입니다. 오디오 샘플은 약 300크레딧이 소요됩니다. 처음 음성을 듣는 데는 약 120크레딧이 소요됩니다.
- 차분하게 유지: 높은 안정성과 편안한 전달. 밝은 한 단어 라인은 피합니다. 숨 태그를 추가하지 마십시오.
- 사용자가 시리즈 전체에 하나의 음성을 원하면 프로젝트에 고정합니다.
5. 프라이버시
녹화 전에 등급을 적용합니다:
- 항상 블러 처리: API 키 및 토큰, 비밀번호, 2FA 및 복구 코드, 카드 및 은행 번호, ID 번호, 개인 키, 로그인 링크.
- 허용되지 않으면 블러 처리: 이메일, 전화번호, 실제 이름 및 사진, 주소, 금액, 고객 세부 정보, 팔로워 및 회원 수.
- 블러 처리되지 않으면 표시: 사용 통계, 공개 가격, 날짜.
- 추가로 사용자가 숨기기로 지정한 단어.
6. 녹화
docs/engine.md를 참조하십시오. 요약: 섹션당 하나의 연속 테이크를 생성하고, 단어 타임스탬프를 얻은 후 각 브라우저 동작을 해당 단어에 맞춰 예약하고, 녹화하고, 동작이 오래 실행될 때 프레임을 유지하며, 오디오를 절대 일시 중지하지 않습니다. 그런 다음 페이지 수준 블러가 놓친 부분이 있는지 프레임을 스캔합니다.
7. 리뷰
로컬 앱을 리뷰 단계에서 엽니다. 사용자는 순간을 표시하거나(AI처럼 들림, 블러 필요, 너무 빠름) 메모를 입력합니다. 재작업 비용을 보여준 후 표시된 섹션만 재작업합니다. 사용된 설정과 함께 표시를 기록하여 음성 기본값이 시간이 지남에 따라 개선되도록 합니다.
8. 내보내기
데모의 자막 설정(영상에 포함, 별도 .srt 파일, 또는 끄기)과 모서리 레이블(끄기, 또는 선택한 모서리에 사용자 텍스트)을 적용합니다. 둘 중 하나를 변경하는 것은 크레딧이 필요 없는 재렌더링만 수행합니다. MP4(1080p), 자막(.srt, 자막이 꺼져 있지 않은 경우) 및 대본을 사용자가 지정한 폴더(기본값 ~/Movies/NAVI)로 렌더링하여 비디오가 속한 프로젝트에 바로 들어갈 수 있도록 합니다. 파일 이름은 데모 제목을 따릅니다.
사용자 데이터
설정에서 사용자는 키를 제거(키를 ElevenLabs에서도 취소하도록 상기), 저장된 로그인 정보 삭제, 설정 재설정 또는 NAVI가 저장한 모든 것을 삭제할 수 있습니다. 완료된 비디오는 절대 건드리지 않습니다. 제거는 이 스킬 폴더도 삭제하는 것을 의미합니다.
파일
-
reference/voice-rules.md: 말하기 스크립트 작성 및 사람 같은 음성 생성 방법. 3단계 전에 읽으십시오. -
reference/recording-rules.md: 음성에 맞춰 화면을 녹화하는 방법. 6단계 전에 읽으십시오. -
reference/privacy.md: 블러 등급 및 경고. 5단계 전에 읽으십시오. -
config/defaults.json: 슬라이더 범위, 사전 설정, 음성별 설정 및 화면 기본값 -
ui/index.html: 로컬 앱(브라우저에서 열기,?start=home|voice|review|settings,&theme=light|dark) -
ui/app.js: 화면, 상태 및 샘플 데이터 -
docs/engine.md: 녹화, 타이밍, 블러 및 렌더링 작동 방식