Table of Contents
  1. iOS AR 어플리케이션 개발
    1. 가상 오브젝트의 그림자 캐스팅 방법
    2. 현실과 같은 가상 조명 구현하기
  2. 마치며

ARKit을 이용하여 현실감 있는 iOS AR 어플리케이션 개발 내용을 공유합니다.

1부. 딥러닝으로 더욱 현실감 있는 AR 앱 만들기
✔︎ 2부. ARKit을 이용하여 iOS AR앱 만들기
3부. Custom YOLO v3 모델 만들기
4부. CoreML을 이용하여 iOS에 YOLO v3 모델 탑재하기


iOS AR 어플리케이션 개발

프로젝트에 사용된 어플리케이션은 Apple에서 제공하는 Sample Code인 Placing Objects and Handling 3D Interaction의 일부 코드를 이용하여 만들었습니다.

iOS 어플리케이션은 ARKitSceneKit를 이용하여 구현하였습니다. 기본적인 AR 어플리케이션 개발 방법에 대한 글은 많기 때문에, 이번 프로젝트의 핵심 기능인 가상 오브젝트의 그림자 캐스팅 방법현실과 같은 가상 조명 구현하기 대해서만 설명하도록 하겠습니다.

✔︎ 진행 순서

  • 가상 오브젝트의 그림자 캐스팅 방법
  • 현실과 같은 가상 조명 구현하기

가상 오브젝트의 그림자 캐스팅 방법

먼저 가상 오브젝트의 그림자가 랜더링 되기 위해선 평면 탐지(Plane Detection) 기술이 필요 합니다. 평면 탐지(Plane Detection)는 ARKit의 World Tracking를 이용하면 손쉽게 구현 할 수 있습니다. 탐지하고자 하는 평면을 ARWorldTrackingConfigurationPlaneDetection 옵션을 통해 설정할 수 있습니다.

바닥은 horizontal, 벽은 vertical 입니다.
1
2
let configuration = ARWorldTrackingConfiguration()
configuration.planeDetection = [.horizontal, .vertical]

이후 후면 카메라를 사용하여 관찰하는 모든 Plane 정보를 ARSessionDelegatesession(_:didAdd:) 함수에서 ARPlainAnchor 객체로 받을 수 있습니다. 이렇게 전달받은 정보를 이용하여 그림자를 랜더링할 투명한 SCNPlane을 설치합니다.

투명한 SCNPlane 설치
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
func renderer(_ renderer: SCNSceneRenderer, didAdd node: SCNNode, for anchor: ARAnchor) {
guard let planeAnchor = anchor as? ARPlaneAnchor else { return }
if (planeAnchor.alignment == .vertical) { return }
let width = CGFloat(planeAnchor.extent.x)
let height = CGFloat(planeAnchor.extent.z)
let plane = SCNPlane(width: width, height: height)
let planeNode = SCNNode(geometry: plane)
plane.firstMaterial!.colorBufferWriteMask = [] // transparent

let x = CGFloat(planeAnchor.center.x)
let y = CGFloat(planeAnchor.center.y)
let z = CGFloat(planeAnchor.center.z)
planeNode.position = SCNVector3(x, y, z)
planeNode.eulerAngles.x = -.pi / 2
node.addChildNode(planeNode)
}

그림자가 그려질 바닥이 완성 되었으니 다음으로 조명을 설치하도록 하겠습니다.


현실과 같은 가상 조명 구현하기

먼저 현실과 같은 가상 조명을 만들려면 현실 조명의 위치강도(intensity) 그리고 색 온도(color temperature)가 필요 합니다.

✔︎ 현실과 같은 가상 조명 구현시 필요한 데이터

  • 조명의 3차원 위치
  • 조명의 강도(intensity)와 색 온도(color temperature)

조명의 위치Google Vision APIYOLO 모델을 이용하여 현실 조명의 위치 정보를 수집하였는데, 그 방법에 대해선 1부의 딥러닝을 이용한 조명인식 파트를 참고해주시기 바랍니다.

조명의 강도와 색 온도는 ARKit의 Light Estimation를 이용하여 수집하였는데, Light Estimation 객체는 카메라를 통해 들어오는 빛의 강도(intensity)색 온도(color temperature) 값을 가지고 있습니다.

이렇게 현실 조명의 3차원 위치와 강도 그리고 색 온도를 수집하였고, SceneKit의 SCNLight의 속성으로 넣어주어 현실과 같은 위치에 현실과 같은 강도와 색 온도를 가진 가상 조명을 구현할 수 있습니다. 또한 Light Estimation의 정보를 매 프레임마다 적용하여 현실 조명의 밝기에 따라서 가상 조명도 밝기 정보를 갱신할 수 있습니다.

SCNLight의 경우 다음 네 가지 type을 지원하며, 이 중에서 그림자 캐스팅은 directional 타입과 spot 타입만 지원되며 castsShadow 옵션을 True로 변경해야 그림자가 캐스팅됩니다.

이번 프로젝트에서는 directional 타입을 사용하였습니다. <br>출처 - <a href=https://developer.apple.com/documentation/scenekit/scnlight/lighttype>https://developer.apple.com</a>이번 프로젝트에서는 directional 타입을 사용하였습니다.
출처 - https://developer.apple.com

위와 같은 구성으로 가상 조명을 설치하면 가상 오브젝트가 마치 현실 조명을 인식하여 그림자가 그려진 듯한 현실감을 줄 수 있습니다.


현실 조명의 위치와 강도 그리고 색 온도가 반영되어, 더욱 현실감 있는 AR을 경험할 수 있습니다.현실 조명의 위치와 강도 그리고 색 온도가 반영되어, 더욱 현실감 있는 AR을 경험할 수 있습니다.

마치며

이상으로 현실감있는 iOS AR앱 만들기에 대한 내용을 마치고 다음 3부에서는 조명의 위치를 실시간으로 탐지하는 YOLO 모델을 만드는 방법에 대해 공유하도록 하겠습니다.

1부. 딥러닝으로 더욱 현실감 있는 AR 앱 만들기
✔︎ 2부. ARKit을 이용하여 iOS AR앱 만들기
3부. Custom YOLO v3 모델 만들기
4부. CoreML을 이용하여 iOS에 YOLO v3 모델 탑재하기