사례 연구 - HoloSketch 빌드, HoloLens용 공간 레이아웃 및 UX 스케치 앱
HoloSketch는 홀로그램 환경을 빌드하는 데 도움이 되는 HoloLens용 디바이스 내 공간 레이아웃 및 UX 스케치 도구입니다. HoloSketch는 페어링된 Bluetooth 키보드와 마우스뿐만 아니라 제스처 및 음성 명령에서도 작동합니다. HoloSketch의 목적은 빠른 시각화 및 반복을 위한 간단한 UX 레이아웃 도구를 제공하는 것입니다.
HoloSketch: HoloLens용 공간 레이아웃 및 UX 스케치 앱
빠른 시각화 및 반복을 위한 간단한 UX 레이아웃 도구
기능
빠른 연구 및 스케일 프로토타이핑을 위한 기본 형식
빠른 매싱 연구 및 배율 프로토타입 생성을 위해 기본형 셰이프를 사용합니다.
OneDrive를 통해 개체 가져오기
OneDrive를 통해 PNG/JPG 이미지 또는 3D FBX 개체(Unity에서 패키징 필요)를 혼합 현실 공간으로 가져옵니다.
개체 조작
친숙한 3D 개체 인터페이스를 사용하여 개체(이동/회전/배율)를 조작합니다.
Bluetooth, 마우스/키보드, 제스처 및 음성 명령
HoloSketch는 Bluetooth 마우스/키보드, 제스처 및 음성 명령을 지원합니다.
배경
디바이스에서 디자인 경험의 중요성
HoloLens용으로 디자인할 때는 디바이스에서 디자인을 경험하는 것이 중요합니다. 혼합 현실 앱 디자인의 가장 큰 과제 중 하나는 특히 전통적인 2D 스케치를 통해 규모, 위치 및 깊이의 감각을 얻기 어렵다는 것입니다.
2D 기반 통신 비용
UX 흐름과 시나리오를 다른 사용자에게 효과적으로 전달하기 위해 디자이너는 Illustrator, Photoshop 및 PowerPoint와 같은 기존 2D 도구를 사용하여 자산을 만드는 데 많은 시간을 할애할 수 있습니다. 이러한 2D 디자인은 3D로 변환하기 위해 추가적인 노력이 필요한 경우가 많습니다. 이 번역에서 2D에서 3D로의 일부 아이디어가 손실됩니다.
복잡한 배포 프로세스
혼합 현실은 우리에게 새로운 캔버스이기 때문에 본질적으로 많은 디자인 반복과 시행 착오가 포함됩니다. Unity 및 Visual Studio와 같은 도구에 익숙하지 않은 디자이너의 경우 HoloLens에서 항목을 함께 배치하는 것은 쉽지 않습니다. 일반적으로 디바이스에서 2D/3D 아트워크를 보려면 아래 프로세스를 거쳐야 합니다. 이는 디자이너가 아이디어와 시나리오를 빠르게 반복하는 데 큰 장벽이었습니다.
배포 프로세스
HoloSketch를 사용하여 간소화된 프로세스
HoloSketch를 사용하면 개발 도구 및 디바이스 포털 페어링을 포함하지 않고 이 프로세스를 간소화하려고 했습니다. 사용자는 OneDrive를 사용하여 2D/3D 자산을 HoloLens에 쉽게 배치할 수 있습니다.
HoloSketch를 사용하여 간소화된 프로세스
3차원 디자인 사고 및 솔루션 장려
이 도구는 디자이너가 진정한 3차원 공간에서 솔루션을 탐색하고 2D에 갇히지 않을 수 있는 기회를 제공할 것이라고 생각했습니다. HoloLens의 경우 배경이 실제 세계이기 때문에 UI에 대한 3D 배경을 만드는 것에 대해 생각할 필요가 없습니다. HoloSketch는 디자이너가 HoloLens에서 3D 디자인을 쉽게 탐색할 수 있는 방법을 열어줍니다.
시작하기
HoloSketch로 2D 이미지(JPG/PNG)를 가져오는 방법
- ONEDrive 폴더 'Documents/HoloSketch'에 JPG/PNG 이미지를 업로드합니다.
- HoloSketch의 OneDrive 메뉴에서 이미지를 선택하고 환경에 배치할 수 있습니다.
OneDrive를 통해 이미지 및 3D 개체 가져오기
HoloSketch로 3D 개체를 가져오는 방법
OneDrive 폴더에 업로드하기 전에 아래 단계에 따라 3D 개체를 Unity 자산 번들에 패키지합니다. 이 프로세스를 사용하여 Maya, Cinema 4D 및 Microsoft 그림판 3D 같은 3D 소프트웨어에서 FBX/OBJ 파일을 가져올 수 있습니다.
중요
현재 자산 번들 만들기는 Unity 버전 5.4.5f1에서 지원됩니다.
Unity 프로젝트 'AssetBunlder_Unity'을 다운로드하여 엽니다. 이 Unity 프로젝트에는 번들 자산 생성을 위한 스크립트가 포함되어 있습니다.
새 GameObject를 만듭니다.
콘텐츠에 따라 GameObject의 이름을 지정합니다.
검사기 패널에서 '구성 요소 추가'를 클릭하고 'Box Collider'를 추가합니다.
3D FBX 파일을 프로젝트 패널로 끌어서 가져옵니다.
개체를 새 GameObject 아래의 계층 구조 패널로 끌어옵니다.
개체와 일치하지 않는 경우 충돌체 차원을 조정합니다. 개체를 Z축을 향하도록 회전합니다.
개체를 계층 구조 패널에서 프로젝트 패널로 끌어 프리팹으로 만듭니다.
검사기 패널 아래쪽에서 드롭다운을 클릭하고 새 고유한 이름을 만들고 할당합니다. 아래 예제에서는 AssetBundle 이름에 'brownchair'를 추가하고 할당하는 방법을 보여 줍니다.
모델 개체에 대한 썸네일 이미지를 준비합니다.
Unity 프로젝트의 'Asset' 폴더 아래에 'Assetbundles'라는 폴더를 만듭니다.
자산 메뉴에서 '자산 빌드Bundles'를 선택하여 파일을 생성합니다.
생성된 파일을 OneDrive의 /Files/Documents/HoloSketch 폴더에 업로드합니다. asset_unique_name 파일만 업로드합니다. 매니페스트 파일 또는 AssetBundles 파일을 업로드할 필요가 없습니다.
.
개체를 조작하는 방법
HoloSketch는 3D 소프트웨어에서 널리 사용되는 기존 인터페이스를 지원합니다. 제스처 및 마우스를 사용하여 개체 이동, 회전, 크기 조정을 사용할 수 있습니다. 음성 또는 키보드를 사용하여 다양한 모드 간에 빠르게 전환할 수 있습니다.
개체 조작 모드
개체를 조작하는 방법
상황에 맞는 및 도구 벨트 메뉴
상황에 맞는 메뉴 사용
두 번 탭하여 상황에 맞는 메뉴를 엽니다.
메뉴 항목:
- 레이아웃 화면: 여러 개체를 레이아웃하고 그룹으로 관리할 수 있는 3D 그리드 시스템입니다. 레이아웃 화면을 두 번 탭하여 개체를 추가합니다.
- 프리미티브: 대량 연구를 위해 큐브, 구, 실린더 및 원뿔을 사용합니다.
- Onedrive: OneDrive 메뉴를 열어 개체를 가져옵니다.
- 도움말: 도움말 화면을 표시합니다.
상황에 맞는 메뉴
도구 벨트 메뉴 사용
이동, 회전, 크기 조정, 저장 및 로드 장면은 도구 벨트 메뉴에서 사용할 수 있습니다.
키보드, 제스처 및 음성 명령 사용
키보드, 제스처 및 음성 명령
앱 다운로드
|
Microsoft Store에서 HoloSketch 앱을 무료로 다운로드하여 설치 |
알려진 문제
- 현재 자산 번들 만들기는 Unity 버전 5.4.5f1에서 지원됩니다.
- OneDrive의 데이터 양에 따라 OneDrive 콘텐츠를 로드하는 동안 앱이 중지된 것처럼 표시될 수 있습니다.
- 현재 저장 및 로드 기능은 기본 개체만 지원합니다.
- 상황에 맞는 메뉴에서 텍스트, 소리, 비디오 및 사진 메뉴를 사용할 수 없습니다.
- 도구 벨트 메뉴의 재생 단추는 조작 기즈모를 지웁니다.
스케치 공유
HoloLens에서 '안녕 코타나, 녹화 시작/중지'라고 말하면 비디오 녹화 기능을 사용할 수 있습니다. 볼륨 위쪽/아래쪽 키를 함께 눌러 스케치 사진을 찍습니다.
작성자 정보
 |
박윤선 UX Designer @Microsoft |
| 패트릭 세브링 개발자 @Microsoft |