Holographic 디스플레이용 콘텐츠 디자인



Unity 용 mrtk (혼합 현실 Toolkit)의 어두운 UI 예제

Mrtk 는 짙은 색 체계를 기반으로 다양 한 UI 빌딩 블록 예제를 제공 합니다.



참조

Ulnar 사이드 위치

Holographic에 대 한 콘텐츠를 디자인할 때 최상의 환경을 달성 하기 위해 고려해 야 하는 몇 가지 요소가 있습니다. 아래 권장 사항 중 일부를 나열 하 고 색, 조명 및 자료 페이지에서 holographic 디스플레이의 특징에 대해 자세히 알아볼 수 있습니다.


넓은 표면에서 밝은 색을 사용 하는 문제

HoloLens 환경 연구 및 테스트에 따라 디스플레이의 많은 영역에서 밝은 색을 사용 하면 몇 가지 문제가 발생할 수 있습니다.

아이 피로

Holographic display는 가감 되므로 밝은 색의 holograms는 더 밝은 색을 사용 합니다. 밝은 영역에서 단색을 사용 하면 사용자에 게 눈에 피로 쉽게 나타날 수 있습니다.

손 폐색

밝은 색을 사용 하면 개체와 직접 상호 작용할 때 사용자가 손을 볼 수 있습니다. 사용자가 손을 볼 수 없기 때문에 손 모양/손가락 간의 깊이/거리를 대상 화면으로 인식 하기가 어려워집니다. 손가락 커서는이 문제를 보정 하는 데 도움이 되지만 밝은 흰색 표면에서는 여전히 어려울 수 있습니다.

색 및 손 폐색밝은 색이 지정 된 콘텐츠 backplate에서 손 모양 보기

색 균일성

Holographic 디스플레이의 특징으로 인해 디스플레이의 밝은 영역이 blotchy 될 수 있습니다. 짙은 색 구성표를 사용 하면이 문제를 최소화할 수 있습니다.

색 선택에 대 한 디자인 지침

UI 배경에 짙은 색 사용

진한 색 구성표를 사용 하 여 눈 피로 최소화 하 고 직접 상호 작용에 대 한 신뢰도를 높일 수 있습니다.

콘텐츠 배경에사용 되는 짙은 색의콘텐츠 배경 예제에 사용 되는 짙은 색의 예

Semibold 또는 굵은 글꼴 두께 사용

HoloLens를 사용 하 여 멋진 고해상도 텍스트를 표시할 수 있습니다. 그러나 세로 스트로크가 작은 글꼴 크기로 지터 될 수 있으므로 밝은 글꼴 가중치 (예: 밝은 글꼴 또는 반투명)를 사용 하지 않는 것이 좋습니다.

굵게 또는 반 굵은 글꼴 두께 (위쪽 패널)는굵은 글꼴 또는 반투명 글꼴 두께 (위쪽 패널)를 개선 하 여 가독성을 향상 시킵니다 .

MRTK의 HolographicBackplate 재질 사용

HolographicBackplate 재질은 HoloLens 셸에서 여러 UI 패널에 적용 됩니다. 이러한 기능 중 하나는 패널을 기준으로 위치를 이동할 때 사용자에 게 표시 되는 iridescence 효과입니다. 배경 플레이트 색은 미리 정의 된 스펙트럼에서 조금씩 이동 하 여 콘텐츠 가독성을 방해 하지 않고 뛰어난 동적 시각적 효과를 만듭니다. 이러한 미세한 이동 색은 보조 색 탐지할을 보정 하는 데도 사용 됩니다.

투명 또는 반투명 UI 백 판금 관련 챌린지

투명 한 ui 예제투명 한 ui 백 판의 예

시각적 복잡성 및 접근성

Holographic 개체는 물리적 환경에 혼합 되므로 투명 하거나 투명 한 창의 콘텐츠나 UI 가독성이 저하 될 수 있습니다. 또한 투명 한 개체 들이 서로 위에 중첩 된 경우에는 사용자가 혼동을 holographic 때문에 상호 작용 하기가 어려울 수 있습니다.

성능

투명 하거나 투명 한 개체가 올바르게 렌더링 되려면 백그라운드에 있는 개체와 정렬 하 고 혼합 해야 합니다. 투명 한 개체를 정렬 하는 데는 CPU 비용이 많이 듭니다. 혼합은 고르기 (즉, 깊이 테스트)를 통해 GPU가 숨겨진 화면 제거를 수행할 수 없으므로 GPU 비용이 많이 듭니다. 숨겨진 표면 제거를 허용 하지 않으면 렌더링 된 최종 픽셀에 필요한 작업 수가 늘어납니다. 그러면 더 많은 압력 채우기 빈도 제약 조건이 적용 됩니다.

깊이 LSR 기술에서 홀로그램 안정성 문제

Holographic reprojection 또는 홀로그램 안정성을 향상 시키기 위해 응용 프로그램은 렌더링 된 모든 프레임에 대 한 깊이 버퍼를 시스템에 제출할 수 있습니다. Reprojection에 깊이 버퍼를 사용 하는 경우 모든 색으로 렌더링 된 픽셀에 해당 하는 깊이 버퍼를 작성 해야 합니다. 깊이 값이 있는 모든 픽셀에도 색 값이 있어야 합니다. 위의 지침을 따르지 않는 경우에는 유효한 깊이 정보가 없는 렌더링 된 이미지 영역이 아티팩트를 생성 하는 방식으로 다시 프로젝션 될 수 있으며,이는 물결 모양의 왜곡으로 표시 되기도 합니다.

투명 한 요소에 대 한 디자인 지침

불투명 UI 배경 사용

투명 하거나 투명 한 개체는 기본적으로 적절 한 혼합을 위해 깊이를 쓰지 않습니다. 이러한 문제를 완화 하는 방법으로는 불투명 한 개체를 사용 하 여 투명 한 개체를 불투명 한 개체 (예: 불투명 한 판 앞의 반투명 단추)에 가깝게 표시 하거나 투명 한 개체를 사용 하 여 깊이 (모든 시나리오에서 적용 되지 않음)를 적용 하거나, 프레임의 끝에 깊이 값을 적용 하는 프록시 개체를 렌더링 합니다.

MRTK-Unity의 솔루션:/windows/mixed-reality/mrtk-unity/performance/hologram-stabilization # 심층 분석

단색 및 불투명 백 판을 사용 하 여 가독성 및 상호 작용 신뢰도를 안전 하 게 보호할 수 있습니다.

영향을 받는 픽셀 수 최소화

프로젝트에서 투명 개체를 사용 해야 하는 경우 영향을 받는 픽셀 수를 최소화 하십시오. 예를 들어, 개체가 특정 조건 에서만 표시 되는 경우 (예: 가산적 네온 효과) 개체가 완전히 표시 되지 않는 경우 (추가 색을 검정으로 설정 하는 대신) 개체를 사용 하지 않도록 설정 합니다. 알파 마스크를 사용 하 여 쿼드를 사용 하 여 만든 간단한 2D 모양의 경우 불투명 셰이더를 사용 하 여 모양의 망상 표시를 만드는 것이 좋습니다.