WebVR 실험실의 핵심 상호작용

VR 실험실

실습 보기

웹사이트 디자이너는 스마트폰, 태블릿, 컴퓨터 등 다양한 기기 및 다양한 화면 해상도 및 픽셀 비율에서 작동하는 반응형 디자인이라는 개념에 익숙합니다. WebVR은 반응형 디자인 개념에 새로운 도전과제를 도입합니다.

WebVR 환경은 몰입도 수준과 입력 수준이라는 두 가지 측정항목으로 분류할 수 있습니다. 이러한 수준은 '자유도'(DOF)로 구분됩니다. 6 DOF는 위치와 방향을 모두 추적하는 것을 의미하고 3 DOF는 방향만 추적하며 0 DOF는 위치와 방향을 추적하지 않습니다.

몰입 수준

  • VR 사용 불가 - 모니터 또는 모바일 디스플레이가 있어야 합니다.
  • 고정 VR - 3DOF 추적 기능이 있는 기기입니다.
  • 좌석 VR: 6DOF 추적이 가능하지만, 제한된 범위와 각도 범위에서만 지원됩니다.
  • Room Scale VR - 방 크기의 환경에서 6DOF 추적

입력 수준

  • 0 DOF - 클릭 또는 탭 기능만 입력할 수 있습니다. 이 입력 방법은 사용자가 향하는 방향과 관련이 있습니다. 이를 시선 컨트롤러라고도 합니다.
  • 3 DOF - 방향을 추적하는 컨트롤러는 레이저 포인터처럼 방향이나 위치를 지정하는 데 사용할 수 있습니다. 컨트롤러의 위치는 사용자의 시점을 기반으로 추정됩니다. 여기에는 Daydream 컨트롤러가 포함됩니다.
  • 6 DOF: 위치와 방향을 추적하는 컨트롤러입니다. 이는 VR에서 손을 근접하게 시뮬레이션하는 데 사용할 수 있습니다.

따라서 단일 애플리케이션이 한 번의 클릭만으로 비 VR 모바일 디스플레이의 모든 것을 지원하여 완전히 추적되는 2개의 핸드 컨트롤러가 포함된 전체 회의실 규모의 환경에 이르기까지 모든 것을 지원할 수 있음을 알 수 있습니다.

WebVR 실험실

Google은 PlayCanvas WebVR Lab에서 애플리케이션에 필요할 수 있는 몇 가지 핵심 상호작용을 구현하여 다양한 수준의 경험으로 이를 확장했습니다.

상호작용 작동 방식

WebVR 실험실에서 상호작용이 작동하는 방식의 기본 메커니즘은 광선 교차입니다. 바닥, 방, 상호작용할 수 있는 모든 객체는 세 가지 도형 프리미티브 중 하나로 정의됩니다.

  • 축 정렬 경계 상자 (AABB) - 회전되지 않는 상자입니다.
  • 방향 지정 경계 상자 - 회전할 수 있는 상자입니다.
  • 구체 - 공간 내 한 지점 주변의 반경입니다.

어떤 동작이 가능한지 알아보기 위해 세상에 광선을 발사하고 세상에 있는 물체의 모양과 교차하는지 확인합니다. 광선이 발생한 위치 (카메라 또는 컨트롤러)와 광선의 길이 (근접에서 조작하거나 멀리 가리키는 행위)에 따라 다양한 유형의 상호작용이 가능합니다.

간단한 작업

먼저 몇 가지 간단한 작업과 이러한 작업이 다양한 컨트롤러에서 사용되는 방식을 정의합니다.

강조표시

위치 또는 객체를 강조표시하려면 시선 컨트롤러를 사용하여 이를 보거나 손 컨트롤러로 가리키면 됩니다. 버튼을 누르지 않았거나 버튼을 누른 상태에서만 실행할 수 있습니다.

클릭

위치나 객체를 클릭하면 먼저 강조표시한 다음 버튼을 누르거나 버튼에서 손을 뗍니다. 시선 컨트롤러를 사용하면 객체를 보고 버튼이나 화면을 눌러 클릭합니다. 손 컨트롤러를 사용하여 이 메서드는 객체를 가리키고 버튼을 클릭하는 것입니다.

핵심 상호작용

강조표시 및 클릭을 사용하여 WebVR 실험실에서 몇 가지 핵심 상호작용을 구현했습니다.

순간이동

순간이동

사용자가 탐색할 수 있는 가상 환경을 구축할 경우 환경은 사용자가 이동하지 않고도 볼 수 있는 작은 영역보다 클 가능성이 높습니다. 예를 들어 WebVR 실험실에는 세 개의 섹션이 있습니다. 메인 룸, 복층 구조의 바닥, 하이파이 음악 플레이어용 사이드룸이 있습니다.

사용자의 표시 영역을 전 세계로 이동하면 불편함을 느끼는 경우가 많습니다. WebVR 실험실에서는 사용자가 위치를 강조표시하고 클릭하여 즉시 순간이동할 수 있습니다. 사용자의 시점은 움직이지 않으므로 사용자는 즉각적으로 움직이는 다소 부자연스러운 느낌에도 불편함 없이 넓은 공간을 돌아다닐 수 있습니다.

손 컨트롤러의 경우 사용자가 버튼을 길게 눌러 순간 이동 타겟을 활성화해야 합니다. 이렇게 하면 사용자가 주위를 둘러보는 동안 시야를 깔끔하게 유지할 수 있습니다.

사용자 시점 이동

시점을 꼭 옮겨야 하는 경우도 있습니다. 예를 들어 정지형 VR 또는 앉아 있는 VR을 사용할 때는 현실 세계를 돌릴 수 없는 상태로 벽을 마주 볼 수 있습니다. 사용자가 컨트롤러를 사용하여 카메라를 회전할 수 있습니다. WebVR 실험실에서 Daydream 컨트롤러의 왼쪽 또는 오른쪽 패드를 사용하면 카메라가 회전합니다.

이렇게 카메라를 움직일 때 불편함을 느끼지 않도록 카메라 전체에 제한된 뷰를 적용하여 주변 시야를 줄입니다. 이는 Ubisoft의 작업을 기반으로 하며 화면 중앙에만 뷰에 초점을 맞추면 불편함이 줄어드는 것으로 확인되었습니다.

활성화

활성화

활성화는 웹페이지의 버튼을 클릭하는 것과 같습니다. WebVR 실험실에서는 이를 문자 그대로 가져와서 활성화할 수 있는 간단한 버튼을 제공했습니다.

0DOF 및 3DOF 컨트롤러의 경우 강조표시 및 클릭만으로 활성화됩니다. 6DOF 컨트롤러의 경우 핸드 컨트롤러가 버튼 안에 있는지 직접 확인하여 버튼을 '누를' 수 있도록 환경을 업그레이드할 수 있습니다.

Grab

Grab

WebVR 실험실에는 '잡을 수 있는' 항목이 많이 있습니다. 이 동작을 사용하면 객체가 활성화될 때 객체를 선택하고 이동할 수 있습니다. 지원하려는 입력 수준에 따라 두 가지 명백한 동작이 있습니다.

6 DOF 컨트롤러의 경우 입력 버튼을 길게 누르면 캡처 가능한 항목이 컨트롤러에 연결됩니다. 그런 다음 세밀하게 제어된 상태로 이동하고 배치할 수 있습니다. 버튼을 놓으면 항목과 결합 또는 드롭 작업이 활성화됩니다.

조작하기 어려운 컨트롤러의 경우 클릭하면 항목이 선택되어 사용자의 표시 영역에 연결됩니다. 일반적으로 항목의 한 부분이 디스플레이의 '하단 1/3'에 표시되도록 합니다. 두 번째 클릭하면 항목이 삭제되거나 결합됩니다.

결합

결합

결합은 항목을 다른 항목과 함께 '사용'할 때 발생하는 작업입니다. 이는 매우 다양한 사용 사례를 다룹니다. WebVR 실험실에서는 이것을 사용하여 하이파이 레코드를 재생합니다. 항목을 선택하면 가져온 항목을 다른 항목과 결합할 수 있게 됩니다. 모든 유형의 컨트롤러에서 타겟 항목을 강조표시하면서 다른 항목을 가져온 다음 손을 떼면 두 항목이 결합됩니다.

삭제 / 복원

다른 항목이 강조 표시되지 않은 상태에서 가져온 항목을 누른 상태에서 클릭하면 항목이 드롭됩니다.

WebVR 실험실에서는 항목에 물리 시뮬레이션을 사용하지 않으므로 성능 요구사항을 낮게 유지했습니다. 즉, 항목을 지면에 떨어뜨리는 대신 떨어뜨린 위치에 떠다닐 수 있습니다. 항목을 삭제한 후 일정 시간 내에 활성화되지 않으면 원래 위치로 '복원'됩니다. 이러한 복원 기능을 통해 입력 수준이 낮은 (0DOF 또는 3DOF) 사용자가 많은 항목에서 작업하고 사용 가능한 작업 영역을 유지할 수 있습니다. 이전 항목은 자동으로 삭제됩니다.

6DOF 입력을 사용하면 항목을 더 쉽게 옮길 수 있습니다. 복원 작업이 지연되면 6DOF 사용자가 항목을 이리저리 이동할 수 있지만, 여전히 해당 영역의 자체 청소는 용이합니다.

요약

WebVR 실험실은 PlayCanvas팀에서 제공하는 실시간 프로젝트입니다. 즉, WebVR 애플리케이션 빌드에 관한 추가 연구를 진행하면서 API가 지속적으로 개발되고 있으며 환경이 추가 및 업데이트됩니다.

'매직 창' 스타일의 모바일 환경에서 데스크톱 대화형 놀이 공간으로 확장됩니다. 사용자가 자신의 프로젝트에 사용할 수 있는 핵심 상호작용 세트를 정의하기 시작했습니다. WebVR 랩이 WebVR로 3D 세상을 구현하려는 모든 사람에게 좋은 학습 경험이 되기를 바랍니다.

PlayCanvas 계정이 있는 경우 WebVR 실험실 프로젝트로 바로 이동하여 자세히 알아볼 수 있습니다.