소리꽃 KeyBloom
소리꽃 KeyBloom 바로가기 ↗
소리꽃 KeyBloom 5
소리꽃 KeyBloom YouTube에서 보기 ↗
이 글은 소리꽃 KeyBloom 시리즈의 11번째 기록입니다. (총 21개)

오늘 한 일

  • 실시간 모드 UI 숨김 + 탭 재구성 — 실시간 연주 토글을 화면에서 감추고(코드는 그대로 보존), 패널 탭을 [파일][프로젝트][비주얼]로 정리(내보내기는 파일 탭 자식으로)
    • 이유: 라이브 저지연이 웹에선 안 되니 지금 노출하면 실망만 준다. 코드는 나중에 네이티브로 갈 때 재사용
  • 스크럽 시 큐 미리보기 — 시크 슬라이더나 시퀀서 플레이헤드를 드래그하는 동안 그 시점의 활성 큐로 미리보기, 놓으면 선택(편집) 큐로 복귀
  • 마그넷 스냅 — 시퀀서 🧲 토글. 켜면 큐 배치·드래그가 플레이헤드(재생 커서)에 착 달라붙음
    • 이유: 스크럽으로 원하는 지점을 찾아두고 거기에 큐를 정확히 맞추려고
  • Undo/Redo (Ctrl+Z / Ctrl+Y) — 큐 배치·이동·삭제·변경, 큐 추가/복제/삭제/재정렬, 큐 이름, 모든 비주얼 파라미터 편집을 되돌리기·다시하기. 스냅샷 히스토리
  • 큐 이름 인라인 편집 — 평소엔 텍스트로 보이고, 클릭하면 입력칸으로. Enter나 다른 데 클릭하면 확정 후 다시 텍스트
    • 이유: 상시 입력칸보다 텍스트로 보이는 게 깔끔하고, 확정 시점이 있어야 undo 한 단계로 묶기 좋음

막힌 부분

  • 연속 편집(슬라이더 드래그·이름 타이핑)을 undo 한 단계로 묶기 — 매 틱 스냅샷하면 undo가 수백 개로 쪼개진다. 편집 시작(pointerdown·focus)에 상태를 저장해두고, 확정(change·blur)에 실제로 바뀌었을 때만 한 단계로 등록하게 했다. 이름 세션과 파라미터 세션을 분리해, 이름 편집 도중 슬라이더를 만져도 서로 안 엉키게
  • hidden 속성이 또 안 먹었다 — .cue-title·.mode-bardisplay가 지정돼 있어서 [hidden]의 기본 display:none을 덮어씀. .클래스[hidden] { display: none }으로 명시(전에도 .ctl-row에서 겪은 함정이라 이번엔 바로 알아챔)

다음에 할 일

  • 라이브용 네이티브(하이브리드) — 저지연 연주·연주 녹화(웹 한계라 네이티브 전제)
  • 합성음 피아노틱하게(조사), 고화질 인코딩(ffmpeg.wasm), 모양별 색 지정


Series: 소리꽃 KeyBloom


Suggested Posts