Lab — 2026년 3월 23일
0 files+0-0
# Lab 프로젝트 업데이트: 인터랙티브 라이팅 맵과 모션 그래픽 실험
이번 개발 사이클에서는 **Motion Graphics Lab**이라는 새로운 실험 공간을 구축했습니다. 핵심은 **Writing Map**이라는 인터랙티브 시각화 도구로, 글쓰기 과정에서 개념들 간의 관계를 동적으로 표현할 수 있는 환경입니다. 사용자가 태그를 클릭하면 패널이 열리고, 캔버스 영역을 클릭하면 자동으로 닫히는 방식으로 직관적인 상호작용을 구현했으며, AI와의 협업을 통해 사용자 경험을 예측하고 자연스러운 인터페이스 플로우를 설계할 수 있었습니다.
인터페이스의 부드러움을 높이기 위해 여러 물리 기반 애니메이션을 조정했습니다. 호버 모션의 강도를 절반으로 줄여 과도한 움직임을 방지했고, 스프링 상수를 조정하여 자석 같은 흡착력(magnet retention)을 제어했습니다. 특히 **뷰포트 크기에 독립적인 동적 궤도 반경(viewport-adaptive orbits)** 시스템을 도입해, 다양한 화면 크기에서도 일관된 시각적 경험을 제공하도록 했습니다. 이러한 세밀한 조정들이 모여 사용자가 화면 크기나 기기를 바꿔도 자연스러운 인터랙션을 경험하게 됩니다.
또한 태그 체계를 **93개에서 75개로 통합**하여 정보 구조를 단순화했고, Vite 빌드 파이프라인과의 호환성을 확보하며 프로덕션 배포를 위한 기반을 마련했습니다. 버그 수정과 기능 개선이 이루어졌으며, 이제 더욱 안정적이고 반응성 높은 라이팅 맵 경험을 제공할 준비가 완료되었습니다.
커밋 기록
fix: don't close panel when clicking a tag node
13:59feat: halve hover motion intensity
13:58feat: close panel on canvas click (click outside)
13:57fix: halve magnet retention by doubling K_HOME spring constant
13:56feat: consolidate tags 93→75 by merging similar categories
13:53feat: viewport-adaptive orbits (W/H independent radii)
13:50fix: fix SyntaxError from duplicate const baseR + add back button
13:47fix: move writing-map.html to public/ for Vite build inclusion
13:44feat: add Writing Map to experiment list
13:41init: motion graphics lab + writing map
13:39