Quick Look 공간형 경험을 위한 3D 모델 만들기

♪ 감미로운 인스트루멘탈 힙합 ♪ ♪ 안녕하세요 저는 Shuai Song입니다 AR Quick Look 팀의 엔지니어이고요 오늘 저는 Quick Look 공간 경험을 위한 3D 모델 만드는 법을 알려드리겠습니다 들어가기 전에 먼저 Quick Look이 무엇인지 우리의 새 플랫폼에서 3D 콘텐츠를 제시할 때 어떻게 사용할 수 있는지 함께 살펴보도록 하죠 또 다른 세션 '공간 컴퓨팅을 위한 Quick Look 발견하기'에서 새로운 Room Plan API를 사용해 만든 사랑스러운 방의 3D 보여드렸는데요 저희는 이 모델을 Quick Look으로 가져왔는데 앱 윈도우에서 USDZ 파일을 드래그해 꺼낸 겁니다 드롭한 곳에 Quick Look 미리보기가 바로 열리죠 여기서부터 여러분은 친숙한 제스처를 사용해 Quick Look 및 제 콘텐츠와 상호작용을 시작할 수 있습니다 이 모델에 대한 이야기로 더 들어가기 전에 시스템이 Quick Look에서 3D 콘텐츠를 제시하는 방법을 조금 더 살펴보겠습니다 이 플랫폼에서 Quick Look은 볼륨 윈도우로 3D 모델을 나타냅니다 볼륨 윈도우에는 지정된 경계가 있어 다른 앱과 그 경계를 공유할 수가 있죠 공간에 볼륨을 재배치할 수 있고 다른 각도에서 볼 수도 있습니다 3D 모델은 항상 볼륨의 중앙에 배치되는데요 모델이 처음 나타나면 Quick Look은 콘텐츠가 직접 여러분에게 향할 수 있도록 방향을 설정할 겁니다 여기서부터 3D 모델 아래 볼륨 윈도우 바를 사용해 공간에 콘텐츠를 자유롭게 재배치할 수 있습니다 Quick Look은 사람들이 미리보기 세션에 있을 때 모델의 크기를 조절하는 방식을 기반으로 하여 볼륨의 크기를 자동으로 조정할 겁니다 콘텐츠에 애니메이션이 사용되고 있다면 모든 애니메이션을 Quick Look 볼륨의 경계 안에 유지하시길 권합니다 Quick Look이 3D 콘텐츠를 어떻게 제시하는지 기본 내용을 살펴봤는데요 Quick Look의 모델 사이즈 및 스케일 사용 방식에 있어서는 고려할 게 더 많습니다 한번 보시죠 3D 모델을 로딩할 때 Quick Look은 USDZ의 메타데이터에 정의된 metersPerUnit을 존중하여 실제 세계와 관련된 스케일 유닛을 결정할 겁니다 에셋의 스케일 시각화에 도움이 될 수 있도록 Quick Look은 처음에 100% 스케일로 모델을 제시하려 할 겁니다 특정 사이즈 범위 내에 있으라고 쓰여 있다면 말이죠 예시를 하나 볼게요 Quick Look이 이 장난감 자동차와 같이 아주 작은 스케일의 물체 조차도 모든 콘텐츠를 즐길 수 있도록 최소 스케일을 부과합니다 또한 다른 앱 옆에 너무 많은 공간을 차지하지 않도록 매우 큰 객체를 보여주는 경우 상한선을 사용하고 있고요 이 찻주전자와 같이 중간 사이즈 객체의 경우 Quick Look은 공간에 처음 개시될 때 모델의 실제 사이즈를 사용할 겁니다 볼륨 윈도우 아래에 있는 버튼을 탭하여 실제 사이즈 모델을 볼 수 있다는 걸 기억하세요 Quick Look이 모델 사이즈를 처리하는 방법도 알았으니 여러분의 콘텐츠를 제시할 때 Quick Look이 추가하는 '평면도'와 '그림자'를 살펴보도록 하겠습니다 Quick Look은 모델 아래에 자동으로 이 두 가지를 보여 모델 크기, 그리고 땅과 연관지은 모델의 위치를 더 잘 이해할 수 있게 해줍니다 Quick Look이 이걸 해주고 있기 때문에 모델에 평면도와 그림자를 추가하지 마시기를 권장합니다 지금까지 Quick Look의 3D 콘텐츠 제시 방법의 기본 내용을 살펴 보았는데요 이번 세션의 나머지 시간 동안 어떤 의제를 다룰지 한번 살펴보고 가겠습니다 먼저 3D 모델을 만드는 몇 가지 방법을 살펴볼 거고요 다음으로 콘텐츠의 시각 품질을 검사하고 필요할 경우 조정하는 방법을 알아보도록 하겠습니다 마지막으로 3D 콘텐츠를 렌더링해 아주 좋은 성능으로 실행될 수 있는 방법을 다뤄보도록 할게요 우선 3D 콘텐츠 준비부터 시작해 보겠습니다 Quick Look은 3D 모델 처리에 있어서 USDZ를 주요 포맷으로 받아들이는데요 USDZ는 Apple 플랫폼에 대한 3D 콘텐츠의 핵심이고 가볍고 음영에 최적화되도록 디자인되었습니다 USDZ 파일 만드는 법을 살펴보도록 하죠 여기에는 다양한 방법이 있는데요 먼저 이전에 iOS용 USDZ 파일을 만들었었다면 이 새 플랫폼에서도 Quick Look에 대해 동일 파일 사용이 가능합니다 새 USDZ 파일을 처음부터 만들고 싶다면 전문 디지털 콘텐츠 크리에이션 툴을 사용해 3D 콘텐츠를 만들고 USDZ 파일로 내보낼 수 있고요 3D 모델을 스캔하여 현실의 물체를 USDZ 파일로 만들 수 있습니다 RealityKit Object Capture API를 사용해서 말이죠 Object Capture는 여러분에게 샘플 앱과 함께 엔드투엔드 사진 측량 앱을 제공해 다양한 디테일의 3D 모델을 만들 수 있게 도와줍니다 iOS, macOS 기기에서 모두 지원되고요 마지막으로 집에서 2D나 3D 평면도 만들 수 있는 방법을 찾고 계시다면 RoomPlan API를 기억해 보세요 제가 말씀드렸던 걸요 제가 이전에 보여드렸던 3D 방 모델에 뒷 이야기가 있다고 그랬죠? 먼저 3D 디자이너 Jerry가 이 3D 모델을 만들기 위해 사용했던 작업 흐름에 대해 자세히 알려드릴 겁니다 Jerry는 RoomPlan이라는 샘플 앱을 사용해 이 방을 스캔하는 것부터 시작했는데요 Jerry는 아주 단순간에 자기 방의 3D 레이아웃을 미리 볼 수 있었습니다 그리고 USDZ 파일을 Mac에 내보내고 드롭할 수 있었죠 그리고 3D 모델을 3D 콘텐츠 크리에이션 툴로 가져와 디자인 콘셉트를 생생하게 만들었죠 이게 그 작업의 결과물입니다 참 괜찮은 모델이죠? 벽, 바닥, 방의 기타 요소에 머티리얼과 텍스처가 추가된 게 보이실 겁니다 이제 그가 만든 방 모델은 Quick Look에서 미리 볼 수 있는 준비가 거의 다 됐는데요 운 좋게도 이 단계를 아주 쉽게 해줄 수 있는 Reality Composer Pro라는 새 툴이 등장했습니다 Quick Look을 위한 3D 모델 미리 보기는 콘텐츠 창작 작업 흐름에서 아주 중요한 단계인데요 모델의 실제 품질을 검사하고 필요한 경우 조정하려면 말이죠 더 자세히 살펴보겠습니다 다음은 Reality Composer Pro에서 우리의 3D 모델을 메인 뷰로 로딩한 건데요 우측 상단에 위치한 이 버튼을 클릭하기만 하면 아주 간편하게 3D 모델을 여러분의 기기에서 Quick Look을 통해 미리 볼 수 있습니다 이건 Quick Look에서 작동하는 동일한 모델의 모습입니다 보자마자 알 수 있는 것은 최초 모델 방향이 바르지 않다는 겁니다 논의했던 것처럼 3D 모델의 가장 흥미로운 부분은 여러분을 향한 채로 제시되어야 합니다 그래야 매력적인 경험을 만들어낼 수 있죠 그럼 이걸 어떻게 고칠까요? Quick Look은 오른손 좌표계를 사용합니다 이걸 알면 콘텐츠 크리에이션 툴에서 모델 방향을 쉽게 바꿀 수 있습니다 아니면 Reality Composer Pro에서도 바로 바꿀 수 있고요 이 경우 수직축을 기준으로 모델을 회전해야 합니다 모델의 거실이 화면에 보이도록 말이죠 여기 있는 y축에 90도를 입력하면 됩니다 그럼 이렇게 되죠 Reality Composer Pro에서 기기 미리보기를 다시 사용해 모델에 대한 변화를 확인해 보도록 합시다 방향이 고쳐졌네요 이 멋진 모델이 훨씬 더 잘 보입니다 이제 이 에셋을 더 살펴보고 다른 시점에서 보는 것은 물론 더 상세한 부분들을 알아봅시다 핀치 앤 드래그 제스처를 사용하면 3D 모델을 회전하고 다른 면을 볼 수 있습니다 방의 여러 부분이 아주 잘 보이죠? 두 손가락으로 핀치 제스처를 사용해 모델 크기를 조정하고 더 자세하게 볼 수도 있습니다 기기에서 Quick Look으로 3D 모델 확인하는 법을 살펴봤는데요 이제 콘텐츠의 시각적 품질 향상을 위해 고려해야 할 것들을 알아보죠 동일한 위치에 여러 객체가 렌더링되면 깜박이는 객체 하나로 보이거나 오버랩이 나타납니다 이 문제를 줄이기 위해 3D 만들기 툴을 사용해 오버랩을 줄이거나 깜박이는 객체 간 거리를 늘려서 메시 지오메트리를 최적화할 수 있습니다 우선 고주파 보통 지도는 사용하지 않을 건데요 앨리어싱 문제가 생기기 때문입니다 그럼 원치 않는 시각적 인공물이 생깁니다 특히 당신이 움직이고 있거나 3D 모델 바로 앞에 있을 때는요 나뭇잎처럼 작거나 얇은 객체를 렌더링 할 때 시스템은 가변 래스터화 속도에 따라 시간이 흐르며 지속적으로 샘플링될 겁니다 그럼 주변부에 깜박거림이 발생할 수 있고요 이 문제를 최소화하기 위해 불투명한 텍스처에 미세한 지오메트리 디테일을 저장하고 나서 더 큰 삼각 그리드 지오메트리를 사용해 렌더링하는 방법을 사용할 수 있습니다 가변 래스터화 속도에 대해 더 알아보고 싶다면 아래 표시되는 우리의 또 다른 세션을 확인해 주세요 다음으로 성능에 집중해 봅시다 여기서는 Quick Look 3D 콘텐츠 구조를 살펴볼게요 부드럽고 매끄러운 공간 경험을 보장하기 위해 뭘 할 수 있는지도 알아보고요 시작합시다 Quick Look에 렌더링되는 콘텐츠의 3D 성능을 결정하는 요소는 다양한데요 3D 모데 파일 크기나 텍스처의 수나 해상도라던가 심지어는 모델에 사용하고 있는 머티리얼의 복잡성도 이에 해당되죠 성능을 위한 3D 모델 최적화의 시작점을 알아보기 위해서는 먼저 에셋 내에 존재할지 모르는 잠재적인 한계부터 식별해야 합니다 우리는 올해 이를 단순화 하기 위해 새로운 툴을 몇 가지 도입했는데요 작업흐름이 상당히 개선될 겁니다 어디 한번 볼까요? Statistics 패널을 보여드리려고 Reality Composer Pro로 다시 돌아왔는데요 이 패널은 3D 모델의 특징에 대해 도움이 되는 정보들을 제공합니다 삼각형의 갯수나 콘텐츠에서 사용 중인 텍스처 메모리의 양 등을요 또 다른 툴은 RealityKit Trace입니다 이 툴로 훨씬 더 개선된 런타임 프로파일링이 가능합니다 RealityKit Trace는 특정 렌더링 파이프라인에 인사이트를 제공하는데요 이를 통해 더 많은 정보를 3D 콘텐츠의 개별 렌더링 프레임에 넣을 수 있습니다 여러 캡처 프레임을 분석함으로써 이 툴은 잠재적 성능 문제나 한계를 식별하고 진단하여 권고안을 제시하는 데에 사용될 수 있습니다 Xcode에서도 구축이 유지되고요 Quick Look에서 콘텐츠 프로파일링에 사용하려면 Quick Look 프로세스에 첨부해야 합니다 Reality Composer Pro와 RealityKit Trace에 관한 더 많은 정보를 원하신다면 아래 세션을 시청해 주세요 이렇게 잠재적인 성능의 한계에 대해 프로파일링을 할 수 있는 툴 몇 가지를 살펴 보았는데요 성능을 위해 3D 최적화를 돕는 우수 사례 몇 가지를 살펴 보도록 합시다 앞서 Quick Look의 3D 콘텐츠 성능을 결정하는 요소가 다양하다고 말씀드렸었는데요 이제 그에 따라 콘텐츠 최적화를 위해 무엇을 할 수 있는지 하나하나 살펴 보죠 먼저 파일 크기에 맞는 모델 최적화가 필요합니다 파일 크기가 더 작을수록 더욱 빠른 다운로드와 빠른 로딩 시간을 특징으로 합니다 사용자가 콘텐츠와 상호작용하기 전에 너무 긴 시간을 기다리길 원치는 않으시잖아요 여기서 어려운 점은 에셋 품질과 파일 크기 사이의 최적화된 균형을 찾는 겁니다 가령 덜 세밀한 텍스처나 저품질 오디오 소스를 사용할 수 있죠 간혹 에셋은 여러 주기에 걸쳐 발전합니다 종종 여기에는 에셋과 연결된 기본 오디오 애니메이션, 텍스처의 변화가 포함되죠 파일 크기를 최소로 유지하기 위해서는 배포될 최종 패키지에서 실제로 사용되는 것만을 포함하도록 해야 합니다 에를 들어 더 이상 씬에서 사용하지 않는 오디오 파일의 기존 버전들은 배포 전에 최종 에셋에서 제거되어야 할 겁니다 마지막으로 더 나은 공유 경험을 보장하기 위해 파일 크기를 25MB 미만으로 유지하기를 추천합니다 다음으로 성능을 위해 3D 콘텐츠 지오메트리를 최적화하는 방법을 살펴보도록 하겠습니다 여기서 또 어려운 점은 최고 수준의 디테일을 보여주고 최고 성능을 달성하는 것 그 사이에서 올바른 균형을 찾는 건데요 모델이 다른 지오메트리 때문에 숨겨져 있거나 완전히 가려진 부분을 사용하는 경우에는 그 부분이 스크린에 전혀 나타나지 않습니다 그러니 성능 예산 절약을 위해 삭제하는 것이 좋겠죠 또 더 작은 메시를 더 큰 메시 하나에 병합하세요 시스템 부하를 줄이기 위해서 말이죠 단일 모델에 대해 메시 부분 200개 미만 정점 10만 개 미만을 유지하기를 추천합니다 메시 디테일과 씬 내 다른 에셋의 균형 맞추기를 기억하세요 다음으로 '텍스처'를 보죠 텍스처는 큰 메모리 사용의 원인이 됩니다 자동화 텍스처는 메모리를 덜 써서 더 많은 에셋이 동시에 업로드될 수 있게 하죠 복잡한 씬도 매끄럽게 작동하도록 도와주고요 텍스처 예산 절약의 한 가지 방법은 논컬러 입력 정보에 흑백을 사용하는 겁니다 어떤 경우에는 흑백 이미지를 하나의 컬러 텍스처에 대한 개별 채널로 통합할 수 있죠 그럼 다양한 흑백 지도를 하나의 텍스처에 저장할 수 있게 됩니다 가능한 경우 머티리얼에서 상수 값을 사용하세요 텍스처에서 로딩하는 대신에 말이죠 모델이 단일 PBR 머티리얼만 사용하는 경우 최대 텍스처 크기는 2K X 2K로 설정하고 채널 텍스처당 16비트 대신 8비트를 사용하길 추천합니다 마지막으로 텍스처 예산은 항상 3D 모델에 가장 큰 가치와 현실감을 주는 영역에 사용하세요 다음은 '머티리얼'입니다 머티리얼은 3D 모델의 공간적 특성을 정의합니다 시스템의 모델 렌더링 방식을 지정하죠 객체가 반짝거리거나 반사되는 모습으로 나타날지도 컬러도 지정하죠 3D 모델 머티리얼의 최적화를 하면 메시 부분을 결합해 동일한 머티리얼을 공유함으로써 로딩 시간을 줄일 수 있습니다 이게 도움이 되는 이유는 3D 모델의 머티리얼이 커스텀인 경우게 시스템이 처음 로딩하면서 컴파일을 할 때입니다 머티리얼의 복잡성과 스크린 크기의 균형을 잘 맞춰주세요 예를 들어 스크린에서 아주 작은 부분만 투명하거나 코팅이 필요한 경우 그 작은 영역에만 다른 머티리얼을 사용하는 것이 더 효율적일 겁니다 항상 투명도 오버랩을 유의하셔야 합니다 투명한 객체를 실시간으로 렌더링하려면 보통은 불투명한 객체보다 더 많은 계산이 필요하거든요 그러니 투명도 오버랩은 꼭 필요한 경우에만 사용하시길 바랍니다 조명을 베이크한 경우 아니면 메시의 일부분에 조명이 아예 필요하지 않은 경우에는 MaterialX Unlit 표면을 사용하시길 추천합니다 실시간 조명 계산에 필요한 시간을 절약하기 위해서요 다음은 '물리적 현상'입니다 물리적 현상 시뮬레이션은 종종 계산 소모가 심합니다 특히 물리 시스템이 충돌 감지를 수행하거나 현실적인 효과를 시뮬레이션하는 경우에는요 중력이나 스프링처럼 말이죠 물리적 현상을 이용해 콘텐츠 성능을 최적화하려면 사용 중인 콜라이더의 총 갯수를 줄이면 됩니다 간혹 콘텐츠의 물리적 현상 시뮬레이션 참여를 원하는데 콘텐츠에 움직이면 안 되거나 다른 객체에 의해 영향을 받으면 안 되는 엔티티가 포함된 경우가 있죠 가상의 공이 튕겨 나오게 하는 벽처럼 말이죠 이 경우에는 정적 콜라이더를 사용하시길 권장합니다 물리적 계산을 줄일 수 있도록 말이죠 다음은 '애니메이션'에 대한 이야기인데요 3D 모델에 애니메이션을 추가하는 건 콘텐츠를 생동감 있게 만들 수 있는 좋은 방법이죠 가끔은 뚜렷하지 않은 애니메이션이 필요할 때도 있죠 이 경우에는 애니메이션에 대해 정점 당 무게 중심의 수를 제한하세요 효율적이고 현실적인 애니메이션을 만들기 위해서요 변형이나 노출된 애니메이션의 지오메트리를 최적화하고자 한다면 이전에 보여드렸던 지오메트리 가이드라인을 그대로 따라하시면 됩니다 다음은 콘텐츠에 입자 시스템을 사용하는 겁니다 이건 정교한 시각 효과를 구축할 수 있는 가장 강력한 도구인데요 연기가 나는 불이나 로켓 발사 연기 같은 것들이 해당됩니다 부적절하게 사용될 경우 오히려 그 입자가 Quick Look 3D 경험에 장애물이 될 수 있어요 그러니 입자 이미터의 사용을 제한하고 화면 입자의 수를 최소로 유지하기를 권장합니다 종종 더 적은 입자로도 유사한 시각 효과를 만들어 낼 수도 있거든요 더 단순하거나 작은 모양과 스타일로도 유사한 효과를 낼 수 있도록 실험해 보시길 바랍니다 시스템의 오버드로를 줄일 수 있을 겁니다 오늘 상당히 많은 것들을 다뤄 보았는데요 오늘 안내드린 권장 사항을 요약해 보도록 하죠 Quick Look 3D 콘텐츠 성능에 영향을 미치는 요인은 굉장히 많습니다 이 새로운 플랫폼은 서로 함께 작동하는 다양한 앱과 콘텐츠의 일부에 참여할 수 있도록 디자인되었습니다 이건 콘텐츠의 성능이 사람들이 하고 있는 다른 앱이나 스크린에 의해서도 영향을 받을 수 있다는 거죠 그러니 다양한 시나리오에 대해 3D 모델 테스트를 해보는 것이 좋습니다 이번 세션에서 공유한 것처럼 콘텐츠의 시각적 품질을 확인하고자 하거나 3D 성능에 영향을 미칠 수 있는 한계를 찾을 때 재량껏 이용할 수 있는 툴도 많습니다 여기서 가장 중요한 점은 더 큰 시각적 효과와 Quick Look에 대한 매끄러운 보기 경험의 균형을 맞춤으로써 두 가지 모두를 보장해야 한다는 겁니다 Quick Look, 그리고 앱, 웹사이트 보기용으로 이용할 수 있는 3D 모델에 대해 알아보려면 처음에 말씀드렸던 아래 세션을 시청해 주시기 바랍니다 시청해 주셔서 감사합니다! ♪