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

오늘 한 일

  • 실시간 연주 모드 (Web MIDI + 컴퓨터 키보드) — 파일 재생 대신 라이브 건반 입력으로 치는 순간 이펙트. 비주얼 엔진은 그대로 두고 노트 소스만 교체(noteOn/noteOff 공통 핸들러). 모드 토글, MIDI 장치 선택, 컴퓨터 키보드(Musical Typing) 연주, 숫자키 1~6 큐 전환, 라이브 수동 녹화(영상)
    • 이유: 원래부터 최종 목표가 실시간 연주였고, 미리 만든 MIDI 재생은 그걸 위한 기반. 이제 입력만 실시간으로 얹음
  • 오디오 지연 개선·진단 — 최소 버퍼(latencyHint), 콜드스타트 방지, 빠른 어택. 실측 지연(내부+장치 ms)을 화면에 표시
    • 이유: 실시간 연주는 지연이 생명이라 줄여보려 함
  • 프로젝트 저장/불러오기 — 큐·큐포인트·트랙·원본 MIDI(base64)를 JSON 한 파일로 저장·복원
    • 이유: 큐·시퀀스를 아무리 만들어도 새로고침 한 번에 다 날아가서

막힌 부분

  • 지연을 줄이려 했지만 실측해보니 장치 48ms가 브라우저 바닥이었다 — 브라우저는 Windows WASAPI 공유모드로만 출력하고 오디오 인터페이스의 ASIO(저지연 드라이버)를 못 쓴다. 웹앱 근본 한계라 여기가 바닥(내부 10 + 장치 48 = 58ms). 라이브 저지연 연주는 추후 네이티브로 가기로 방향을 정했다
  • 라이브 모드에서 컴퓨터 키보드 d가 성능 오버레이 토글과 겹쳤다 — 오버레이는 파일 모드에서만 뜨게(라이브에선 d가 E음)
  • 브라우저는 파일 경로로 MIDI를 재오픈 못 한다 — 그래서 프로젝트에 원본 MIDI를 base64로 임베드해야 불러오기가 서버 없이 자기완결됨

다음에 할 일

  • 라이브용 네이티브(또는 하이브리드) — 저지연 연주와 “연주하며 녹화”는 웹 한계라 네이티브 전제(방향 결정됨). 화면은 지금 TS 재사용, 소리만 네이티브(ASIO)
  • 합성음 피아노틱하게(조사), 고화질 인코딩(ffmpeg.wasm), 모양별 색 지정, 스크럽 시 큐 미리보기


Series: 소리꽃 KeyBloom


Suggested Posts