스트리밍은 대부분의 브라우저와
Developer 앱에서 사용할 수 있습니다.
-
세상을 증강 현실로 가져오기
Object Capture 및 RealityKit을 사용하여 현실의 사물을 증강 현실 게임으로 가져올 수 있는 방법을 보여드립니다. Object Capture 프레임워크를 사용하여 자세한 항목을 캡처하고, 이를 Xcode에서 RealityKit 프로젝트에 추가하며, 스타일이 지정된 셰이더 및 애니메이션을 적용하여 이를 AR 경험의 일부로 사용하는 방법을 보여드립니다. 또한 ARKit, RealityKit 및 Object Capture 작업을 위한 모범 사례를 공유합니다. 이 세션을 최대한 활용하려면 WWDC21의 ‘Dive into RealityKit 2(RealityKit 2 심층 분석)' 및 ‘Create 3D models with Object Capture(Object Capture로 3D 모델 만들기)'를 시청하시기 바랍니다.
리소스
- Building an Immersive Experience with RealityKit
- Capturing photographs for RealityKit Object Capture
- Creating a Game with Reality Composer
- Creating a Photogrammetry Command-Line App
- RealityKit
- Taking Pictures for 3D Object Capture
- Using object capture assets in RealityKit
관련 비디오
WWDC22
WWDC21
-
다운로드
♪ 부드러운 힙합 음악 ♪ ♪ 안녕하세요, 전 Hao입니다 Object Capture 팀의 엔지니어죠 오늘 제 동료 Risa랑 저는 Object Capture API와 RealityKit을 사용해서 실제 사물의 3D 모델을 만들고 그걸 AR로 가져오는 방법을 보여 드릴 겁니다 시작해 볼까요? 먼저 작년에 macOS에서 RealityKit API로 출시한 Object Capture에 대해서 간략하게 짚고 넘어갈게요 그다음 ARKit의 향상된 카메라 기능 몇 가지를 소개할게요 사물의 고해상도 사진을 캡처할 수 있고 여러분의 AR 앱에 Object Capture를 더 잘 통합할 수 있죠 그 후에 여러분이 계속해서 이 기술을 잘 활용하도록 Object Capture를 잘 사용하는 훌륭한 사례를 소개하겠습니다 마지막 섹션에서는 Risa가 여러분에게 RealityKit에서 Object Capture의 종단 간 워크플로를 소개하고 실제 사물를 어떻게 AR 환경으로 가져올 수 있는지 직접 보여 드릴 겁니다 Object Capture를 짧게 복습하며 시작할까요? Object Capture는 컴퓨터 비전 기술로 실제 사물의 이미지를 세부 3D 모델로 쉽게 변환하는 데 활용할 수 있습니다 우선 iPhone, iPad나 DSLR로 다양한 각도에서 사물의 사진을 찍습니다 그 후 Object Capture를 지원하는 Mac에 사진을 복사하죠 Photogrammetry API를 사용하여 RealityKit는 사진을 3D 모델로 단 몇 분 만에 변환할 수 있습니다 출력 모델에는 기하학적 메시가 담겨 있고 모델에 자동 적용되는 텍스처를 포함한 다양한 재질 맵도 있습니다 Object Capture API를 자세하게 알고 싶다면 Object Capture에 대해 설명한 작년 WWDC 세션을 강력 추천합니다 여러 개발자가 Object Capture를 사용해 놀라운 3D 캡처 앱을 만들었습니다 Unity, Cinema4D, Qlone PolyCam, PhotoCatch가 있고 이것 말고도 많죠 이외에도 이 API를 사용해 만든 아름다운 모델들이 있습니다 Ethan Saadia가 만든 몇 가지 모델들입니다 PhotoCatch 앱 내에서 Object Capture 힘을 이용해 만들어 냈죠 Shopify의 우리 친구 Mikko Haapoja도 이 API를 사용해서 멋진 3D 모델을 잔뜩 만들었습니다 Object Capture를 통한 출력 3D 모델의 품질이 매우 높아서 전자 상거래에서 매우 유용하죠 예시로 GOAT 앱을 볼까요? 여러분이 다양한 신발을 신어 볼 수 있게 해 주죠 이 신발 모델은 전부 Object Capture API로 제작되었고 신발에 대한 세세한 정보까지 캡처했습니다 이 기술은 제품의 구매 결정을 내리는 데 도움이 될 수 있고 여러분이 있는 곳에서 물체가 정확히 맞는지도 알아볼 수 있죠 예를 들어 Plant Story 앱은 공간에 있는 다양한 식물의 실제 3D 모델을 미리 만나 볼 수 있고 이 모든 게 Object Capture로 만들어졌습니다 식물을 위해서 얼만큼의 공간이 필요한지 가늠해 볼 수 있고 단순히 공간 안에서 식물을 사실적으로 볼 수도 있죠 사실적이라고 하니 말인데 이 영상에서 진짜 식물이 뭔지 발견하셨나요? 네, 탁자 맨 왼쪽 모서리에 있는 흰색 화분이 진짜입니다 2021년에 발표한 후로 Object Capture API를 놀라운 방식으로 널리 사용하는 걸 보니 정말 기뻤어요 이제 ARKit에서의 카메라 개선 사항을 얘기해 보죠 Object Capture로 재구성을 할 때 품질에 큰 도움이 될 겁니다 훌륭한 Object Capture 경험은 사물의 사진을 사방에서 잘 찍는 것으로 시작됩니다 이걸 위해 고해상도 카메라를 사용할 수 있겠죠 iPhone이나 iPad 혹은 DSLR이나 미러리스 카메라를 쓸 수 있습니다 iPhone이나 iPad에서 카메라 앱을 사용하면 깊이와 중력 정보를 이용해 고해상도 사진을 찍을 수 있어 Object Capture API가 사물의 실제 크기나 방향을 자동으로 복원할 수 있습니다 게다가 iPhone이나 iPad를 사용하는 경우 ARKit의 추적 기능을 활용해 모델 위에 3D 안내 UI를 덧씌워서 사물을 사방에서 바라볼 수 있습니다 또 다른 중요 사항은 캡처의 이미지 해상도가 높을수록 Object Capture가 생성할 수 있는 3D 모델의 품질이 향상된다는 겁니다 그런 의미에서 올해 ARKit 공개에서는 고해상도 배경 사진을 찍는 완전히 새로운 API를 선보입니다 이 API를 사용하면 ARSession을 실행하는 동안 기본 카메라 해상도로 사진을 캡처할 수 있습니다 이 기능으로 장치의 카메라 센서를 최대한 활용하면서 사물의 표면 위에 3D UI를 덧입힐 수 있죠 iPhone 13의 경우 와이드 카메라의 해상도인 12메가픽셀을 활용할 수 있다는 의미죠 이 API는 방해가 되지 않습니다 현재 ARSession의 연속적인 영상 스트림을 방해하지 않기 때문에 여러분의 앱은 사용자에게 부드러운 AR 경험을 계속 제공하게 될 겁니다 게다가 ARKit 덕분에 EXIF 메타데이터를 사진에서 사용할 수 있고 앱에서 화이트 밸런스, 노출 및 후처리에 유용한 기타 설정에 대해 유용한 정보를 읽을 수 있습니다 ARKit은 앱에서 새 API를 쉽게 사용하게 해 줍니다 ARWorldTrackingConfguration에서 고해상도 프레임 캡처를 지원하는 영상 형식을 쿼리하기만 하면 되고 쿼리에 성공하면 새 영상 형식을 설정하고 ARSession을 실행할 수 있죠 고해상도 사진을 캡처할 땐 ARSession의 새로운 기술인 captureHighResolutionFrame API 함수를 호출하기만 하면 완료 처리기를 통해 고해상도 사진을 비동기로 전송할 수 있습니다 그만큼 간단하죠 또 카메라 설정보다 수동 제어를 선호하는 사례가 있다는 것도 알고 있습니다 초점, 노출, 화이트 밸런스를 직접 조절하는 거죠 그래서 기본 AVCaptureDevice에 직접 접근하고 세밀한 카메라 제어를 위해 속성을 편리하게 변경하는 방법을 제공하고 있습니다 이 코드 예시에서 보듯이 ARWorldTrackingConfiguration에서 configurableCaptureDevice ForPrimaryCamera만 호출하면 기본 AVCaptureDevice에 접근할 수 있습니다 개선 사항에 대한 자세한 내용은 올해 WWDC 세션인 'ARKit 6 소개’ 영상을 보는 걸 추천합니다 자, 이제 Object Capture의 모범 사례를 보면서 안내 사항을 알아볼까요? 먼저, 사물을 고를 때 Object Capture에 적합한 특성이 있는지 살펴야 합니다 적합한 사물은 표면에 적절한 질감이 있습니다 사물의 일부 영역에 텍스처가 없거나 투명하면 그 영역의 세부 정보가 재구성이 어려워집니다 또 적합한 사물은 환한 빛과 반사가 없어야 합니다 사물에 무광 표면이 없으면 확산 조명을 사용해서 물체의 반사를 줄일 수 있죠 사물을 뒤집어서 아래쪽을 캡처하려면 사물이 단단하게 유지되는지 확인하세요 뒤집어도 모양이 변하지 않아야 한다는 얘기입니다 마지막으로 적합한 사물은 미세한 구조를 어느 정도 포함할 순 있지만 고해상도 카메라로 클로즈업 사진을 찍어야 물체의 미세한 세부 사항을 복원할 수 있습니다 다음으로 중요한 점은 이상적인 캡처 환경을 설정하는 겁니다 캡처 환경의 조명 밝기가 양호하고 균일하며 확산된 조명인지 확인하세요 안정적인 배경과 사물 주변에 충분한 공간을 확보하는 게 중요합니다 방이 어두우면 불이 잘 들어오는 턴테이블을 이용할 수도 있죠 다음은 사물의 사진을 잘 찍기 위해 몇 가지 안내 사항을 살펴보겠습니다 그러면 Object Capture에서 고품질의 3D 모델을 얻을 수 있죠 예를 들어 제 동료 Maunesh가 어떻게 iPhone을 사용해서 해적선 이미지를 찍었는지 보여 드리겠습니다 우리가 아끼는 ARKit 엔지니어 Christian Lipski가 만들었죠 Maunesh는 우선 깨끗한 탁자 한가운데에 해적선을 가져다 놓습니다 이렇게 하면 사진에서 배가 분명히 도드라져 보이죠 iPhone을 안정적으로 두 손으로 들고 있습니다 배 주변을 천천히 돌면서 다양한 높이에서 사진을 찍습니다 배가 카메라 시야의 중앙에 커다랗게 위치하는지 확인하죠 그러면 세부 사항을 최대한 자세히 포착할 수 있습니다 항상 인접한 두 장의 사진 사이에 겹치는 부분이 많도록 사진을 찍습니다 사진을 꽤 많이 찍었습니다 여기서는 80장 정도죠 베를 옆으로 눕혀서 배의 바닥 역시 재구성할 수 있습니다 뒤집힌 방향으로도 계속 사진을 늘려 20장 정도를 더 찍었습니다 한 가지 주목할 점은 iPhone을 가로로 들고 있다는 겁니다 길다란 물체를 캡처하기 때문인데요 이 경우 가로 모드는 사물의 세세한 부분까지 최대한 포착하게 도와주죠 하지만 키가 큰 물체를 찍으려고 했다면 세로 모드를 사용해야 할 수도 있습니다
여기까지입니다 과정의 마지막 단계는 사진을 Mac에 복사해서 Object Capture API로 처리하는 겁니다 네 가지 세부 정보 단계를 선택할 수 있는데요 다양한 사용 사례에 최적화된 단계들입니다 축소 및 중간 세부 단계는 웹 기반과 모바일 환경에서 최적화되었습니다 AR QuickLook에서 3D 콘텐츠를 보는 수준이죠 이런 세부 단계로 재구성된 모델은 삼각형과 재질 채널이 더 적어서 메모리를 덜 소비합니다 전체 및 원본 세부 단계는 고급 상호 작용 사례를 위해 만들어졌습니다 컴퓨터 게임이나 영화 후반 제작 워크플로 등이죠 이런 모델은 가장 높은 수준의 기하학적 세부 정보를 포함하고 재질 처리에서 베이크드와 언베이크드를 제공하는 유연성이 있지만 재구성하려면 더 많은 메모리가 필요합니다 사용 사례에 따라서 올바른 출력 단계를 선택하는 게 중요합니다 우리 해적선의 경우 중간 세부 단계를 택했고 M1 Mac에서 처리하는 데 몇 분밖에 걸리지 않았습니다 출력된 3D 모델이 너무 훌륭해서 실제로 해적선이 먼바다를 항해하는 애니메이션 동영상을 함께 만들었습니다 이게 바로 Object Capture의 힘입니다 영차! 이제 Risa에게 넘기겠습니다 RealityKit에서 Object Capture와 함께하는 종단 간 워크플로를 안내할 겁니다 고마워요, Hao Object Capture API에 대해 지금까지 알아봤는데요 전 이제부터 종단 간 개발자 워크플로를 살펴볼 거예요 RealityKit을 사용해 실제 사물을 AR로 가져오는 과정이죠 예시 워크플로를 살펴보며 각 단계를 들여다보겠습니다 데모로 바로 들어가시죠 제 동료 Zach은 가끔 목공 일을 하는데 최근 6개의 거대한 나무 체스 말을 만들었습니다 하나하나 독특한 조각이죠 이 체스 말을 보면서 저는 대화형 AR 체스 게임을 만들어야겠다는 영감을 받았죠 예전에는 실제 사물의 고품질 3D 모델을 만들려면 3D 모델러와 재질 전문가가 필요했습니다 이제 Object Capture API를 사용해 우리는 직접 체스 말을 캡처해서 간단하게 증강 현실로 가져올 수 있습니다 룩을 캡처하면서 시작할게요 제 동료 Bryan이 전문적인 환경에서 작업합니다 이전 섹션에서의 모범 사례를 염두에 두면서요 여기서 Bryan은 턴테이블에 룩을 두고 최종 출력에서 거친 그림자를 피하기 위해 전문가용 조명을 썼습니다 턴테이블과 iPhone 카메라를 사용할 수도 있습니다 iPhone 카메라는 USDZ 출력물에 자동 크기 추정과 중력 벡터 정보를 제공하죠 2021년의 Object Capture 세션을 보고 자세한 내용을 확인하세요 물론 Bryan처럼 정교하게 환경 설정을 못 했다면 그냥 여러분의 iOS 기기를 들고 사물에 다가가서 사진을 찍어도 됩니다 이제 룩 사진을 다 찍었습니다 이 사진을 Mac으로 보낼게요 사진의 처리는 2021년에 소개했던 PhotogrammetrySession API를 사용합니다 모범 사례의 안내 사항에 따라 축소 세부 단계로 재구성할 겁니다 우리 AR 앱 성능을 확보하기 위해서죠 API의 최종 결과물은 USDZ 파일 유형 모델입니다 제가 방금 재구성한 체스 말의 최종 결과물입니다 시간을 아끼기 위해 저는 다른 다섯 개 말도 미리 캡처를 해 두었습니다 체스 말의 색상 구성이 한 가지인데 어떻게 게임을 만들지 궁금하실 거예요 여섯 개의 서로 다른 말을 복제하고 현실 변환기에 끌어다 놓겠습니다 기존 텍스처의 색상을 반전시켰고 복제된 세트를 이 반전 텍스처로 대체했습니다 이렇게 하면 플레이어가 체스 말의 밝은 버전과 어두운 버전을 하나씩 가질 수 있죠 내보내기 메뉴에서 압축 텍스처 옵션을 설정한 상태로 모델을 내보냅니다 텍스처의 메모리 공간을 줄이는 데 도움이 되겠죠
완전한 체스 세트가 이제 준비됐으니 모델을 Xcode 프로젝트로 가져올 수 있습니다 RealityKit로 체스 판을 만들었습니다 Y축의 원시 입방체를 축소하고 검은색과 흰색을 번갈아 가며 사용했죠 제가 재구성한 체스 말들을 체스 판에 늘어놓았습니다 우리 앱에서 실제 사물을 보는 것만으로도 신나지만 몇 가지 기능을 추가해서 실제 대화형 게임으로 만들어 보겠습니다 이 부분을 통해서 기존의 기술을 몇 가지 보여 드리려고 해요 원하는 결과물을 얻기 위해 기술을 결합하는 예를 보여 드리겠습니다 RealityKit의 고급 주제에 대한 실용 사례를 살펴볼 거라서 아직 API에 익숙하지 않다면 2021년의 RealityKit 세션 영상을 먼저 보시는 걸 추천할게요 앱을 처음 열었을 때 시작 애니메이션을 추가하고 싶어요 체스 판의 타일이 마지막 위치보다 살짝 위쪽에서 천천히 떨어져 제자리로 돌아가는 애니메이션을 상상 중이에요 그동안 체스 말도 같이 움직이는 거죠 코드로 이 효과를 복제하기 위해 두 단계가 필요합니다 첫 번째 단계는 두 엔터티를 Y축을 따라 위로 보내는 동시에 체스 말을 균일하게 축소하는 겁니다 두 번째 단계이자 마지막 단계는 두 엔터티가 애니메이션으로 원래대로 돌아오는 겁니다 구현하는 코드는 꽤 간단해요 먼저 체스 판 타일 엔터티를 반복하며 시작할게요 각 엔터티에 대해 체크 판 타일의 현재 변환을 저장합니다 타일이 내려앉는 최종 위치가 되겠죠 그럼 각 정사각형을 Y축으로 10cm씩 올리겠습니다 이제 이동 함수를 활용해서 원래 형태로 다시 애니메이션화할 수 있습니다 저는 체크 판의 윤곽을 그린 경계 USDZ에 애니메이션이 내장돼 있단 것도 알고 있습니다 playAnimation API를 사용해 동시에 애니메이션을 시작할 수 있습니다 체스 말에도 똑같은 애니메이션을 추가했지만 대상에 맞게 규모를 수정했습니다 여기 만들었네요 코드 몇 줄만 있으면 되는 간단한 시작 애니메이션이죠 그런데 체스 말을 움직이는 능력 없이는 실제로 체스를 둘 수가 없습니다 다음엔 그 기능을 구현해 보죠 체스 말들을 움직이기 전에 한쪽 편을 선택할 수 있어야 합니다 이미 ARView에 UITapGestureRecognizer를 추가했습니다 사용자가 특정 위치를 누르면 카메라 원점에서 시작해 해당 2D 지점을 통과하는 광선을 정의합니다 그 광선을 사용해 3D 장면에 레이 캐스팅을 수행하면 엔터티에 도달하는지 확인할 수 있죠 제 장면에선 저 혼자만 체스 말을 선택할 수 있도록 체스 말 충돌 그룹을 마스크로 지정했습니다 레이 캐스팅 함수는 CollisionComponent가 없는 모든 엔터티를 무시한다는 거 기억해 두세요 우리가 체스 말을 찾는다면 드디어 선택할 수 있겠죠 이제 어떤 말이 선택됐는지 알았으니 효과를 더해서 그 말이 빛나는 것처럼 보이게 하고 싶습니다 사용자 지정 재질을 활용하면 목표를 이룰 수 있습니다 더 정확하게 말하면 표면 셰이더죠 표면 셰이더를 사용하면 Metal을 통해서 재질 매개 변수를 계산하거나 지정할 수 있습니다 이때 매개 변수는 RealityKit의 조각 셰이더에 의해 각 픽셀당 한 번씩 호출됩니다 Metal에서 이 화재 효과 같은 표면 셰이더를 쓸 수 있죠 그다음 표면 셰이더를 사용해 사용자 지정 재질을 직사각형 프리즘에 적용하여 셰이더가 엔터티의 모습에 영향을 미치게 합니다 원하는 효과를 얻는 코드를 좀 적어 볼까요? 표면 셰이더에 사용할 노이즈 텍스처를 프로젝트에 이미 추가했습니다 텍스처를 두 번 샘플링합니다 한 번은 효과의 천제 모양이고 다른 한 번은 세부 효과죠 그다음 RGB 값을 가져와서 다시 원하는 모습으로 매핑합니다 방금 추출한 처리 값으로 샘플 포인트의 Y좌표와 이미지 값을 비교하며 샘플 포인트의 불투명도를 계산합니다 효과에 움직임을 주기 위해 시간의 함수로 텍스처의 Y축을 통해 움직일 겁니다 추가로 카메라의 시선 방향과 각 샘플 포인트가 만나서 생기는 면각을 사용해 측면의 효과를 희미하게 만들 겁니다 이렇게 하면 가장자리가 부드러워지고 기본 모델의 규칙적인 특성이 가려지죠 마지막으로 표면 매개 변수 함수를 사용하여 방금 계산한 색상과 불투명도를 설정합니다 여기 선택 셰이더가 적용된 체스 말들이 있습니다 정말 내부에서 빛을 발하는 것처럼 보이죠 자, 우리가 이걸 세 개의 별도로 변환한 애니메이션과 결합하면 이런 결과가 나올 겁니다 체스 말을 움직이는 기능을 구현한 것처럼 상대편의 말도 포착할 수 있습니다 표면 셰이더처럼 형상 수정자 역시 사용자 지정 재질을 사용해 구현할 수 있죠 위치, 정규 분포 텍스처 좌표 같은 정점 데이터를 변경할 수 있어서 아주 강력한 도구입니다 이 Metal 함수들은 정점당 한 번씩 RealityKit의 정점 셰이더에 의해 호출됩니다 이런 수정은 순전히 일시적이고 실제 엔터티의 정점 정보에는 영향을 미치지 않습니다 재밌는 기하학 수정자를 추가해 말을 잡을 때 찌부러뜨릴 수 있을 것 같아요 capturedProgress라는 속성이 캡처 말에 있는데요 캡처 애니메이션의 진행률을 0부터 1까지 나타내는 속성이에요 말을 붙잡는 건 사용자가 시작하는 동작이기 때문에 언제 애니메이션을 시작할지 기하학 수정자에 알려 줘야 합니다 좋은 점은 customMaterial에 사용자 지정 속성을 설정해서 수행할 수 있단 거죠 이걸 통해서 CPU와 GPU 간에 데이터를 공유할 수 있어요 여기서는 특별히 사용자 지정 값 속성을 사용하고 애니메이션 진행률을 기하학 수정자에 전달합니다 Metal 측에서 애니메이션 진행률을 추출하려면 사용자 지정 매개 변수를 균등 분포로 사용하면 됩니다 물체가 다른 말에 의해 찌그러지는 것처럼 물체의 수직 크기를 조정하고 싶기 때문에 조정축을 Y 방향으로 설정합니다 애니메이션에 복잡성을 더하기 위해 X축의 기하학을 변경해 파형 효과를 만들 거예요 정점의 오프셋은 set_model_position_ offset 함수를 사용해 설정할 수 있죠 이게 우리 기하학 수정자의 최종 결과물이에요 X축을 따라 수직으로 늘어나면서 무너지기 전에 약간씩 커지는 게 보일 거예요 저는 체스 초보자라서 선택한 말이 어디로 이동할 수 있는지 나타내는 기능을 추가하면 도움이 될 거라는 생각이 들었어요 체크 판 타일은 각각 자체 모델 구성 요소를 가진 개별 엔터티라서 표면 셰이더를 사용해 펄싱 효과를 적용하면 잠재적인 이동 경로가 다른 것과 구분될 거예요 다음으로 '블룸'이라는 후처리 효과를 해서 효과를 더 돋보이게 할 겁니다 여기서도 우리는 빛이 나는 효과에서 사용하던 표면 셰이더의 사용자 지정 매개 변수를 씁니다 이 경우에는 CPU 측에서 Metal 표면 셰이더로 부울 값을 전달하죠 체크 판 타일이 가능한 경로라면 색상을 변경하면서 펄싱 효과를 주고 싶어요 여기 방사 색상에 특별히 펄스를 더해 볼게요 마지막으로 전체 뷰에 블룸 효과를 더할게요 블룸는 밝은 영역의 경계에서 빛이 깃털 같은 효과를 내는 후처리 효과예요 ARView에서 렌더 콜백 속성을 활용하면 이런 효과를 낼 수 있어요 내장된 Metal 셰이더 수행 함수를 사용해 블룸 효과를 작성할 거예요 다음 렌더 콜백을 설정합니다 방금 정의한 블룸 함수로 프로세스 폐쇄를 수행하죠 체스 판에 흰색으로 펄싱 효과가 날 때 블룸 효과가 함께 사용되면 이제 더 강조될 겁니다 표면 셰이더와 블룸 효과를 함께 사용하면 우리 말을 어디로 옮길 수 있는지 정확히 알게 되죠 마지막으로 AR 앱에서 실제 체스 말이 움직이는 걸 보기 위해 모든 걸 결합해 보시죠 우리가 추가한 모든 기능이 실제 환경 속에서 어떻게 보이는지 알 수 있습니다 여러분의 편의를 위해 캡처 체스 샘플 프로젝트를 세션 리소스에 연결했어요 다운로드한 후 여러분의 환경에서 직접 사용해 보시기 바랍니다 정말 간단하죠? 캡처부터 대형 체스 말의 재구성 그리고 증강 현실 앱까지 거쳤습니다 오늘 이 세션에선 많은 내용을 다뤘어요 몇 가지 핵심만 요약해 보겠습니다 우리는 2021년에 발표한 Object Capture API를 복습하는 것으로 시작했습니다 그다음 활성 ARSession 동안 기존 카메라 해상도에서 언제든 사진을 캡처할 수 있는 ARKit의 새로운 API에 대해서도 알아봤습니다 여러분이 Object Capture 기술을 최대한 활용할 수 있도록 재구성에 적합한 사물의 유형을 나열하고 고품질 이미지를 얻기에 이상적인 환경과 사물을 캡처하는 동안 따라야 할 행동들을 알아봤죠 세션 후반부에서는 종단 간 개발자 워크플로의 예시를 살펴봤습니다 우리는 크기가 큰 체스 말의 사진을 캡처하고 PhotogrammetrySession API에 사진을 입력해서 3D 모델을 만들었어요 모델을 현실 변환기에 불러오고 텍스처를 일부 바꿨습니다 마지막으로 우리는 차근차근 우리의 체스 게임을 만들고 AR에서 체스 말이 움직이는 걸 확인했어요 오늘 우리 세션은 여기까지입니다 봐 주셔서 감사해요 영차! ♪
-
-
6:20 - HighRes capturing
if let hiResCaptureVideoFormat = ARWorldTrackingConfiguration.recommendedVideoFormatForHighResolutionFrameCapturing { // Assign the video format that supports hi-res capturing. config.videoFormat = hiResCaptureVideoFormat } // Run the session. session.run(config) session.captureHighResolutionFrame { (frame, error) in if let frame = frame { // save frame.capturedImage // … } }
-
17:00 - Chessboard animation
// Board Animation class Chessboard: Entity { func playAnimation() { checkers .forEach { entity in let currentTransform = entity.transform // Move checker square 10cm up entity.transform.translation += SIMD3<Float>(0, 0.1, 0) entity.move(to: currentTransform, relativeTo: entity.parent, duration: BoardGame.startupAnimationDuration) } // Play built-in animation for board border border.availableAnimations.forEach { border.playAnimation($0) } } }
-
18:00 - select chess piece
// Select chess piece class ChessViewport: ARView { @objc func handleTap(sender: UITapGestureRecognizer) { guard let ray = ray(through: sender.location(in: self)) else { return } // No piece is selected yet, we want to select one guard let raycastResult = scene.raycast(origin: ray.origin, direction: ray.direction, length: 5, query: .nearest, mask: .piece).first, let piece = raycastResult.entity.parentChessPiece else { return } boardGame.select(piece) gameManager.selectedPiece = piece } }
-
21:16 - capture geometry modifier
// Capture Geometry Modifier class ChessPiece: Entity, HasChessPiece { var capturedProgress: Float get { (pieceEntity?.model?.materials.first as? CustomMaterial)?.custom.value[0] ?? 0 } set { pieceEntity?.modifyMaterials { material in guard var customMaterial = material as? CustomMaterial else { return material } customMaterial.custom.value = SIMD4<Float>(newValue, 0, 0, 0) return customMaterial } } } }
-
23:00 - highlight potential moves using bloom
// Checker animation to show potential moves void checkerSurface(realitykit::surface_parameters params, float amplitude, bool isBlack = false) { // ... bool isPossibleMove = params.uniforms().custom_parameter()[0]; if (isPossibleMove) { const float a = amplitude * sin(params.uniforms().time() * M_PI_F) + amplitude; params.surface().set_emissive_color(half3(a)); if (isBlack) { params.surface().set_base_color(half3(a)); } } }
-
23:20 - Import MetalPerformanceShaders
import MetalPerformanceShaders class ChessViewport: ARView { init(gameManager: GameManager) { /// ... renderCallbacks.postProcess = postEffectBloom } func postEffectBloom(context: ARView.PostProcessContext) { let brightness = MPSImageThresholdToZero(device: context.device, thresholdValue: 0.85, linearGrayColorTransform: nil) brightness.encode(commandBuffer: context.commandBuffer, sourceTexture: context.sourceColorTexture, destinationTexture: bloomTexture!) /// ... } }
-
-
찾고 계신 콘텐츠가 있나요? 위에 주제를 입력하고 원하는 내용을 바로 검색해 보세요.
쿼리를 제출하는 중에 오류가 발생했습니다. 인터넷 연결을 확인하고 다시 시도해 주세요.