Three.js 인터랙션
질문
3차원이 정보 구조를 만드는가, 배경을 만드는가. 정보 구조를 만들지 않으면 쓰지 않는다.
왜 이 질문인가
웹의 3D는 대부분 스크롤에 반응하는 장식이다. 화면은 무거워지고 읽을 것은 늘지 않는다. 3차원이 필요하려면 2차원으로 못 하는 일을 해야 한다. 거리가 곧 유사도이고 이동이 곧 선택인 공간이 그렇다.
근거
- 좌표에 뜻이 있는 경우 – Distance of Thinking – Three.js로 언어 모델의 다음 토큰 확률장을 세웠다. 토큰마다 4,096차원 임베딩을 3차원으로 투영하고, 가까운 토큰끼리 선으로 잇는다. 매 단계 상위 6개 후보가 확률 순서로 놓여 터널을 이룬다. 가장 확률 높은 후보가 정면, 낮은 후보가 바깥 고리다. 관람객이 통과한 토큰이 그대로 답으로 확정된다. 4일 22커밋으로 만든 프로토타입이다(산출물).
- 2차원으로 충분한 경우 – Synthetic Vision Fund – p5.js로 만든 생성 이미지를 배경이 아니라 상품의 얼굴로 썼다. 같은 질문에 3차원이 답이 아니었던 경우다. 여기서는 공간이 아니라 절차가 신뢰를 만들었다.
- 이 사이트 – 3D가 하나도 없다. 프로젝트를 읽는 데 좌표가 필요하지 않다. three.js 의존성 자체를 넣지 않았다.
지금까지의 답
좌표에 뜻이 있을 때만 3차원이 낫다. 확률장에서는 가까울수록 그럴듯한 다음 단어다. 이 규칙 하나로 화면에 설명을 붙일 필요가 없어졌다.
이동이 곧 선택이어야 한다. 보여 주는 것과 실제로 일어나는 것이 다르면 3차원은 그림이 된다. 그래서 샘플링에 직접 개입해 비행 경로가 답이 되게 했다. 가만히 날면 가장 확률 높은 경로를 따른다.
장식이면 빼는 게 낫다. 이 사이트에 3D가 없는 이유다. 읽는 일에 좌표가 필요하지 않으면 무게만 늘어난다.
아직 모르는 것
- 하드웨어 조종 – 기울기 센서로 가지를 고르는 구조는 만들었지만 아두이노 컨트롤러의 실제 연결 테스트를 마치지 못했다. 공개한 녹화는 마우스와 휠로 조작했다.
- 장시간 안정화 – 전시 모드는 75초 동안 입력이 없으면 스스로 도는 화면으로 넘어간다. 장시간 전시에서의 안정성은 확인하지 않았다.
- 배포 제약 – 센서를 읽는 Web Serial은 보안 페이지가 필요해 사설 네트워크의 HTTPS 주소 하나로 운영했다. 일반 배포 환경에서 같은 조종을 붙이는 방법은 아직 없다.