거울 상자 없이 거울 치료: 브라우저 탭으로 환상 팔다리 치료

발행: (2026년 6월 11일 AM 06:49 GMT+9)
5 분 소요
원문: Dev.to

Source: Dev.to

1990년대 노벨상 인접 치료법, 웹캠, 그리고 21개의 손 키포인트 — 물리적 장비 없이도 거울 상자 착시를 재현해 환상 팔다리 통증을 완화합니다.
1990년대에 신경과학자 V.S. 라마찬드란은 놀라운 사실을 발견했습니다. 환상 팔다리 통증을 겪는 절단 환자들은 사라진 팔다리가 다시 움직이는 모습을 보기만 해도 통증이 완화된다는 것이었습니다. 그의 장치는 거의 코미디 수준으로 단순했는데, 거울이 붙은 상자 하나였습니다. 건강한 손을 넣고, 거울에 비친 손이 사라진 손이 될 자리에 보이게 한 뒤 움직이면, 뇌는 “사라진” 손이 다시 명령에 따르는 모습을 보고 통증을 낮추는 경우가 많았습니다.
제한점은 과학이 아니라 상자였습니다. 물리적인 장치였기에 클리닉에서만 사용 가능했고, 확장하기도, 측정하기도 어려웠습니다.

웹캠과 실시간 손 트래킹만으로도 같은 착시를 더 나은 특성으로 구현할 수 있습니다:
webcam frame → hand landmark model (21 keypoints, on-device)
→ reflect: phantom[i] = { x: 1 − x, y, z }
→ render real hand (solid) + phantom twin (ghost) on canvas

반사는 한 줄의 수식으로 처리됩니다. 그 주변의 모든 것이 착시를 현실감 있게 만드는 요소입니다:

const phantom = real.map(p => ({ x: 1 - p.x, y: p.y, z: p.z }));

시각적 치료 효과는 예상보다 더 중요했습니다. 환상 손은 유령 같은 시안 색 골격에 반투명한 손바닥 채움, 약 3초 주기로 맥동하는 “숨쉬는” 빛, 그리고 마지막 몇 프레임을 남기는 흐릿한 잔상 트레일로 렌더링됩니다. 이는 존재하지만 비현실적인 느낌을 주어 거울 치료가 전달해야 할 인지적 이야기를 정확히 표현합니다. 프레임 중앙에 점선으로 된 거울 평면을 두어 반사 관계를 한눈에 알아볼 수 있게 했습니다.

Tracking: MediaPipe HandLandmarker (구글 사전 학습 모델 — 출처 표기 필요), WebAssembly와 GPU delegate를 통해 실행. 노트북에서 약 30 FPS.
Privacy by architecture: 모든 프레임이 디바이스 내에서 처리됩니다. 의료 관련 애플리케이션에서 “영상이 브라우저를 떠나지 않는다”는 것은 선택 사항이 아니라 필수 조건입니다.
Lazy loading: 사용자가 “Start the Mirror”(거울 시작) 버튼을 클릭할 때만 모델을 다운로드합니다. 참여하지 않은 방문자는 대역폭을 전혀 사용하지 않습니다.
Lifecycle hygiene: 카메라 트래킹이 중지되고 모델이 언마운트 시 닫히며, 메모리 누수가 없습니다.

소프트웨어가 유리(거울)로는 할 수 없는 일을 더합니다: 가이드된 운동 시퀀스, 세션 추적, 시간에 따른 관절 가동 범위 측정(키포인트가 이미 수치이기 때문) 그리고 거울 상자를 직접 방문하지 못하는 환자에게 원격으로 제공할 수 있습니다. 브라우저 데모는 핵심 인터랙션을 보여주며, 완전 3D 팔다리를 렌더링한 WebXR 버전이 자연스러운 다음 단계가 될 것입니다.

시도해 보세요 (카메라 선택 사항, 온디바이스만 사용): rs-03.github.io/portfolio-website/demos
Source: github.com/rs-03/portfolio-website

인터랙션 개념을 보여주는 시연 — 의료 기기가 아니며, 의료 조언도 아닙니다.

0 조회
Back to Blog

관련 글

더 보기 »

Eidentic 소개

Today we're releasing Eidentic, an open-source TypeScript SDK for building AI agents with self-improving memory and the production fundamentals built in — not b...

Typescript의 타입

Introdução Tipos são uma forma de definir a “forma” ou o contrato dos dados que estamos usando no código. Pensando em Javascript puro, ele é dinâmico: você pode...