2024.02.11

Bubble-UI: 비눗방울을 메타포로 한 공간 UI 시스템

UI 메타포로 비눗방울을 사용하는 연구. 물리 법칙의 제약을 넘는 디지털 세계의 특성을 살리면서도, 사용자가 조작 결과를 예측하기 쉬운 UI 시스템을 제안.

  • Interaction 2024 인터랙티브 발표상 (일반 투표)
제작일
2024.02.11
형태
개인 작업
기술
Unity, VFX Graph, VRHMD
태그

interaction-ipsj.orghttps://www.interaction-ipsj.org/proceedings/2024/data/pdf/1B-35.pdf

버튼 인터페이스
버튼 인터페이스
빔으로 오브젝트를 배치하는 방법
빔으로 오브젝트를 배치하는 방법
AR 동작 모습
AR 동작 모습

기존 XR 사용자 인터페이스에서는 기존 하드웨어의 인터페이스나 물리 현상의 메타포가 널리 쓰인다.

기존 인터페이스나 물리 현상의 메타포를 쓰면 사용자가 인터페이스의 동작을 예측하기 쉬워져 조작성이 좋아진다는 장점이 있다.

그러나 물리 세계를 메타포로 쓰는 데에는 문제점도 있다. 물리 현상의 동작에 얽매여 디지털 공간이라는 이점을 충분히 살릴 수 없게 된다는 것이다.

첫 번째 사례는 널리 보급된 포크(Poke)식 버튼 인터페이스다. 이 인터페이스에서는 사용자가 조작할 때 손가락을 버튼 면에 수직으로 움직여 누르는 동작을 해야 한다는 제약이 있다.

두 번째 사례는 역시 널리 보급된, 빔으로 오브젝트를 옮기는 인터페이스다. 이 빔 인터페이스에서는 조작 대상이 질량을 가진 것처럼 보일 경우, 빔으로 들어 올리는 순간 무게가 사라지는 듯 느껴져 위화감을 일으킨다. 이에 대해 빔이 아래로 처지게 해 의사적으로 질량을 느끼게 하는 방법이 있다. 하지만 이 방법은 직접 조작할 때보다 연출이 끼어들어 조작성이 희생된다는 문제가 있다.

본 연구에서는 이러한 문제를 해결하기 위해 인터페이스 메타포로 비눗방울을 사용한 새로운 조작 기법 "Bubble-UI"를 제안한다.

쓰기 쉬움과 알기 쉬움의 양립

사용자가 비눗방울에 대해 가진 내적 이미지를 빌려 알기 쉬움과 디지털 특유의 조작성을 함께 이루고자 했습니다. 사용자가 UI를 조작하고 피드백을 받는 루프 속에서 "어떻게 조작하면 무엇이 일어나는지"라는 멘탈 모델이 쉽게 만들어지는 디자인을 목표로 했습니다.

Bubble Button — 닿는 순간 반응하는 버튼

XR UI에서는 팔을 들고 있는 시간이 피로로 이어집니다. 기존 기계식 버튼 메타포는 손가락을 눌렀다 떼는 예비 동작이 필요했습니다. 본 제안의 닿기만 해도 반응하는 버튼은 최소한의 동작으로 입력할 수 있어 피로가 줄어듭니다. 또한 비눗방울의 모습 덕분에 닿으면 바로 반응하는 특수한 동작도 이해하기 쉬워지도록 했습니다.

Bubble Holder — 오브젝트를 띄워서 옮기기

시선으로 고른 오브젝트를 탭하면 떠오름·떨어짐 상태가 전환된다
시선으로 고른 오브젝트를 탭하면 떠오름·떨어짐 상태가 전환된다

디지털 공간만의 "띄워서 옮기기"라는 조작을 비눗방울 상태 전환으로 실용적인 UI로 만들었습니다. 비눗방울 모습으로 상태를 시각화해, 디지털 공간의 특성을 살린 조작을 알기 쉽게 구현했습니다.

Bubble Loading — 로딩 인디케이터

로딩이 끝나면 비눗방울이 터지고 안에서 오브젝트가 나온다
로딩이 끝나면 비눗방울이 터지고 안에서 오브젝트가 나온다

현재 XR 디바이스는 오브젝트를 로딩하는 동안 2D 진행 막대 등을 표시합니다. 본 제안은 로딩 중에 비눗방울을 표시하고, 로딩이 끝나면 비눗방울이 터지며 안에서 오브젝트가 나오는 방법입니다. 오브젝트의 크기와 배치를 알기 쉽고, 표현이 매끄럽게 이어져 당황하기 어려운 UX를 실현합니다.