1. 어디에 위치해야 하는가?
[ VR 화면은 2D로 그린 UI요소를 3D공간에 재배치하는 과정을 통해 구현된다. ]
[ 사용자가 편안함을 느낀느 상하좌우 시야각을 고려하여 캔버스(UI) 사이즈를 정해야 한다. ]
[ 사용자가 집중할 수 있는 편안한 시선 범위를 지정해야 한다. ]
모든 360도 영역의 공간 모두를 디자인 하게 되면 사용자가 혼란이 있을 수 있으므로 집중할 수 있는 편안한 시선 범위를 지정해야 한다.
사용자의 관심 영역은 360도 환경에 9분의 1에 해당된다. 직사각형 이미지의 중앙에 위치하며 크기는 4K 해상도(2840k x 2180k) 기준 대략 1200x600 픽셀입니다. 이 공간을 크게는 컴포터블 존과 세이프티 존으로 나뉩니다.
* TIP 위 수치는 대략적인 작업 공간을 확보하기 위한 가이드입니다. 꼭 직접 디바이스에 적용해 보고 작업을 하세요.
1. 컴포터블 존(Comfortable Zone)
[ 서비스를 제공하는 대부분의 콘텐츠가 위치하는 영역 ]
2. 세이프티 존(Safety Zone)
[ 사용자가 집중해야 할 핵심 콘텐츠가 위치하는 영역 ]
3. 그 외(Look Left, Top, Right, Bottom)
[ 사용자 시야 밖에 있어 찾아보아야 하는 부가적인 콘텐츠가 위치하는 영역 ]
2. 확보한 공간에 UI 디자인을 해야한다.
확인된 문제 사항
- 분산된 콘텐츠를 찾다 보니 어지럽다.
- 스크롤에 사용성에 대한 어려움이 있다.
- 버튼이 너무 작아 선택이 어렵다.
- 배경 이미지에 따라 콘텐츠 집중이 어렵다.
이러한 문제점을 확인 후 개선하여 VR 콘텐츠 사용성을 높일 수 있는지 파악 후 디바이스의 한계를 보완할 수 있는 디자인을 해야 한다.
3. 디테일한 UI 요소들을 투명도를 적용하기보단 색상으로 표현한다.
- 해상도의 주변부 왜곡 현상 등으로 디테일한 UI 요소와 Text 중심의 UI는 가독성이 떨어진다.
가상환경에서는 선명한 UI 요소가 모두 픽셀로 표시되기 때문에 얇은 라인과 Opacity를 사용하면 지글거림이 심해 화면이 깨져 보일수 있다. 그러므로 디테일한 UI 요소는 배제해야 하지만 최대한 투명도를 적용하는것보다 색상으로 명확하게 표현하는 것이 더 깨끗한 화면으로 보일 수 있습니다.
- HDRI 배경을 적용한다.
가상환경에서는 HDRI이라는 이미지를 배경으로 적용한다. 아래는 왜곡된 파노라마 이미지이다.
배경은 프로젝트 초반에 결정을 해야한다. 배경의 명도, 채도에 따라 UI 디자인 분위기나 컨셉이 결정되기 때문이다. 배경을 결정할 때에는 더욱더 생생한 경험을 위해 제공하는 콘텐츠에 적합한 배경을 설정해야한다. 즉 배경을 통해서 콘텐츠에 집중할 수 있는 환경을 만들어 한다.
4. 사용성을 고려한 UI 배치
콘텐츠를 보기 위해 신체를 움직인다면 몰입에 방해가 되며 조작에 어려움을 느끼게 됩니다. 이를 위해 UI와 콘텐츠 요소는 가능한 시선이 닿는 컴포터블 존내에 배치하여 신체의 움직임을 최소화하여 피로도를 줄여야 한다. 사용자의 자유도는 적절한 수준으로 제약하여 탐색 > 인지 > 선택까지의 콘텐츠 접근성을 높일 수 있어야 한다.
UI 디자인으로 사용자의 컨트롤러와 헤드 트레킹의 사용성도 고려해야 한다. 가상환경에는 마우스 터치보다 정확도가 떨어지기 때문에 Context Menu, Horizon View, Gaze Scrolling 등의 UI 요소를 사용하여 사용성을 높이고, 정확도가 떨어지는 부분을 보완할 수 있는 UI의 크기와 형태, 위치를 고민하여 결정해야한다.
5. 명확하고 일관적인 피드백을 제공해야 한다.
콘텐츠의 규모, 색상의 변화 및 애니메이션을 통해 사용자에게 명확한 피드백을 반영해야 한다.
지속해서 콘텐츠에 활용하기 위해서는 규칙을 세워 일관성을 유지해야 합니다.
피드백의 일관성을 유지하여 사용성의 혼란을 주지 않아야 한다.