콘텐츠로 이동

에디터 개요

VoiceScriptPlayer의 에디터(Editor) 는 프로젝트를 구성하고 리소스를 편집하는 핵심 도구입니다.
이 페이지에서는 에디터의 전체 인터페이스 구성과 각 탭의 역할을 소개합니다.

1. 에디터 시작하기

프로젝트를 생성하거나 불러오면 자동으로 에디터가 열립니다.
에디터는 여러 편집 탭으로 구성되어 있으며,
각 탭은 서로 다른 리소스(사운드, 비디오, Live2D 등)를 관리합니다.

💡 참고:
VoiceScriptPlayer는 동시에 하나의 프로젝트만 열 수 있습니다.
새로운 프로젝트를 열려면 현재 에디터를 닫고 홈 화면으로 돌아가야 합니다.

2. 인터페이스 구성

VoiceScriptPlayer 에디터는 좌측의 리소스 목록, 중앙의 플레이어(미리보기),
하단의 트랙 및 재생 제어부로 구성되어 있습니다.

editor-overview

영역 설명
상단 메뉴 바 파일, 설정 등의 기본 메뉴가 있으며, 프로젝트 저장·게시, 환경설정 등을 관리합니다.
왼쪽 패널 (리소스 목록) 현재 탭의 리소스(예: 사운드, 비디오, Live2D 등)가 표시됩니다.
새 리소스를 추가하거나 제거할 수 있습니다.
중앙 영역 (플레이어) 선택된 사운드나 비디오, Live2D 모델이 실시간으로 재생되는 미리보기 화면입니다.
플레이어 크기 조정 및 전체 화면 전환이 가능합니다.
하단 영역 (트랙 / 타임라인) 사운드나 이벤트의 시간축을 표시하며, 재생 구간 및 시작 트랙을 설정할 수 있습니다.
재생, 일시정지, 반복 구간 등의 제어 버튼도 여기에 위치합니다.
프로젝트 정보 표시줄 상단 중앙에는 현재 프로젝트 제목과 불러온 DLsite 작품명 등이 표시됩니다.
상태 표시줄 (우측 상단) 연결된 장치 상태(예: TCode, Intiface)가 표시되며, “연결된 장치 없음” 등의 상태를 확인할 수 있습니다.

🎮 주요 요소 설명

  • 플레이어 영역
    비디오, Live2D, UI 요소 등이 모두 이 영역에 표시되며
    실제 게임처럼 동기화된 미리보기가 가능합니다.
    영상 재생, Live2D 애니메이션, UI 인터랙션 등이 실시간으로 반영됩니다.

  • 트랙 설정
    하단의 타임라인에서는 트랙을 추가하거나 시작 구간을 지정할 수 있습니다.
    시작 트랙 설정 버튼을 누르면 해당 트랙을 프로젝트의 시작점으로 설정 할 수 있습니다.

  • 리소스 목록
    좌측에는 텝에 맞는 리소스들이 표시됩니다.

💡 팁:
사운드, 비디오 탭의 구조는 모두 동일한 형태를 사용합니다.
리소스 목록 → 미리보기 → 트랙 설정의 흐름을 익히면
다른 탭에서도 동일한 방식으로 편집할 수 있습니다.

3. 편집 탭 구조

VoiceScriptPlayer의 에디터는 다음과 같은 탭으로 구성되어 있습니다:

탭 이름 설명
🎵 사운드 오디오 파일(.mp3, .wav)을 불러오고 자막 생성 및 편집, 번역, 음성 생성(TTS) 등을 수행할 수 있습니다.
🎬 비디오 영상 파일(.mp4, .mov)을 추가하고 자막 생성, 번역, 동기화 편집을 할 수 있습니다.
🧍 Live2D 캐릭터 모델(.model3.json) 및 모션 파일을 불러와 배치하고 설정합니다.
🧩 UI 버튼, 이미지, 텍스트 등 사용자 인터페이스 구성 요소를 배치 및 편집합니다.
💬 스크립트 변수, 트리거, 조건문 등을 사용해 상호작용 동작을 정의하고 제어합니다.
✏️ 스트로크 타임라인 기반 스트로크 패턴을 불러오고 설정합니다.
✨ 특수 이벤트 미리 정의된 특수 이벤트들을 제공합니다.
📦 리소스 관리 프로젝트 전반에 사용되는 공용 리소스(변수, 이미지, Live2D, 번역 사전 등) 을 통합 관리합니다.
🧰 런타임 도우미 프로젝트를 테스트 하면서 디버깅에 도움을 주는 내용등을 표시합니다.

4. 기본 편집 흐름

VoiceScriptPlayer의 편집 과정은 사운드 트랙을 중심으로 모든 요소를 동기화하는 구조로 되어 있습니다.
아래 순서대로 작업하면 가장 자연스럽게 프로젝트를 완성할 수 있습니다.

  1. 🎵 사운드 탭에서 트랙 구성하기
    음성 또는 배경음 파일(.wav, .mp3)을 불러옵니다.
    필요 시 자막 생성(STT) 기능으로 대사를 텍스트로 변환합니다.
    구간을 나누거나 불필요한 부분을 잘라내어 정리합니다.
  2. 🎬 비디오 또는 Live2D 탭에서 장면 연동하기
    비디오나 Live2D 모델을 불러와 사운드와 타이밍을 맞춥니다.
    Live2D의 모션, 표정, 애니메이션 등을 사운드 구간에 맞춰 조정할 수 있습니다.
    비디오의 경우 자막을 추가하거나, 기존 자막을 자동 번역할 수 있습니다.
  3. 🧩 UI 탭에서 인터페이스 구성하기
    버튼, 텍스트, 이미지 등 상호작용 요소를 배치합니다.
    UI 요소에는 스크립트 이벤트를 연결할 수 있습니다.
    예: “버튼 클릭 시 다음 트랙으로 이동” 또는 “선택지 표시” 등.
  4. 💬 스크립트 탭에서 로직 정의하기
    변수, 트리거, 조건문 등을 통해 프로젝트의 동작 흐름을 구성합니다.
    예: 특정 구간이 끝난 뒤 Live2D 애니메이션 실행, 음성 전환 등.
    UI와 스트로크, 사운드 간의 상호작용을 한눈에 제어할 수 있습니다.
  5. ✏️ 스트로크 / 특수 이벤트 탭에서 물리 효과 동기화하기
    스트로크(Stroke) 편집기로 패턴이나 움직임 타이밍을 설정합니다.
    특수 이벤트 탭에서는 클라이맥스 이벤트 등을 구성할 수 있습니다.
    사운드 트랙과 동일한 시간축을 공유하므로 정밀하게 싱크 조정이 가능합니다.
  6. ▶️ 전체 미리보기 및 디버깅
    하단 재생 버튼 ▶을 눌러 전체 시퀀스를 확인합니다.
    미리보기 중 이벤트나 변수를 런타임 도우미에서 확인합니다.

💡 팁:
타임라인을 수정하는 부분만 저장이 필요하며, 리소스는 추가나 수정이 별도의 “저장” 명령 없이 즉시 반영됩니다.

5. 주요 단축키

단축키 기능
Ctrl + S 현재 프로젝트 저장

6. 에디터 설정 및 초기화

  • 프로그램 설정 (Settings)
    상단 메뉴의 설정 → 프로그램 설정에서
    UI 테마, 언어, 마이크 설정, AI 설정, 단축키 등을 할 수 있습니다.

7. 다음 단계

VoiceScriptPlayer의 모든 편집은 타임라인(트랙) 을 중심으로 이루어집니다.
사운드, 비디오, Live2D, UI, 스크립트, 특수 이벤트 등은
모두 타임라인의 시간축을 기준으로 동기화됩니다.

다음 문서에서는 트랙과 타임라인의 구조를 먼저 이해하고,
그 위에 리소스를 배치하는 방법을 배워봅니다.

🎞️ 타임라인 및 트랙 구조

🎵 리소스별 편집 가이드

타임라인을 이해한 뒤, 각 리소스 탭에서 세부 편집을 진행하세요.