보기: 레코더

레코더는 Viewer에서 Spine 애니메이션을 동영상, 애니메이션 이미지 또는 이미지 시퀀스로 캐처합니다.

녹화 모드

• ⚡ Quick Record — MediaRecorder + captureStream()을 사용한 리얼타임 캐처. WebM 출력만 가능. 빠르지만 리얼타임 프레임 레이트에 제한됩니다.
• 🎬 HQ Export — WebCodecs VideoEncoder + readPixels()를 사용한 오프라인 프레임 단위 렌더링. 모든 포맷을 지원하며 픽셀 퍼펙트 출력을 생성합니다.

출력 포맷

• 동영상: WebM, MP4, AVI, MOV
• 애니메이션 이미지: GIF, Animated PNG (APNG)
• 이미지 시퀀스: PNG Sequence, WebP Sequence

코덱 (HQ Export)

VP8, VP9, H.264 (AVC), AV1, ProRes — 사용 가능한 코덱은 브라우저 지원에 따라 자동 감지됩니다.

품질

• 프리셋: Low (~1 Mbps), Medium (~3 Mbps), High (~5 Mbps), Lossless (~20 Mbps).
• 커스텀 비트레이트 — kbps로 지정하여 세밀하게 제어.

타이밍

• FPS: 24, 30, 60 또는 커스텀 (1–120 fps).
• 워밍업 — 녹화 시작 전에 물리/constraint가 안정되는 시간(초).
• Pause-after — 지정 시간만큼 마지막 프레임을 유지.
• 마지막 프레임 포함 — 토글.

뷰포트와 크롭

• 크롭 활성/비활성 — 크롭 영역 토글.
• 크롭 사각형 — Spine 월드 좌표로 X, Y, 너비, 높이.
• Snap to pair — 설정 가능한 패딩으로 스켈레톤 페어에 크롭을 자동 맞춤.
• 인터랙티브 크롭 오버레이 — 뷰포트에서 직접 모서리/변을 드래그.

해상도

• 스케일 모드 — 퍼센트 슬라이더 (10%–400%).
• 고정 모드 — 명시적 픽셀 치수 (최대 4096px).
• 계산된 출력 해상도가 리얼타임으로 표시됩니다.

렌더 옵션

• Render bones — 디버그 본 오버레이 포함.
• Render images — 어태치먼트 이미지 포함.
• Render others — 바운딩 박스, 패스.
• MSAA — None / 2× / 4× 안티에일리어싱.
• Smoothing — 0–8 레벨, 알고리즘 선택 (Bicubic / Bilinear).

배경

• 투명 — 알파 비대응 포맷(예 GIF, JPEG)에서 자동 비활성화.
• 단색 — 커스텀 컨러 피커.
• 체커보드 — 투명도 시각적 인디케이터.
• 알파 채널 지원: VP9+WebM, AV1+MP4, PNG Sequence, APNG, WebP Sequence.

HUD 오버레이

• 토글: 트랙 정보, 시간, 프레임 번호, FPS, 스켈레톤 라벨.
• 커스텀 텍스트 — 워터마크 문자열.
• 위치 — 4개 모서리(좌상, 우상, 좌하, 우하).
• 폰트 크기 — 8–64px, 텍스트 컨러 피커 포함.

반복과 멀티 스켈레톤

• 반복 횟수 — 1–100 루프 반복.
• 타겟 페어 — 특정 스켈레톤 또는 모두 녹화.
• 스켈레톤 모드 — Combined(단일 파일) / Separate files(스켈레톤당 파일 1개).

파일명 템플릿

변수 포함 템플릿 문자열: {project}, {animation}, {W}, {H}, {fps}. 해결된 파일명의 라이브 미리보기가 표시됩니다.

타임라인 통합

녹화 범위는 타임라인에 빨간/오렌지 파선 클립으로 표시됩니다. 끝을 드래그하여 범위 리사이즈, 본체를 드래그하여 위치 변경, 또는 설정 버튼(⚙️)으로 전체 녹화 설정을 엽니다.