CodeFest 2019. Иван Порошин (Яндекс) — Android. ARCore + Sceneform: как создавать дополненную реальность

Несмотря на то, что прошёл уже почти год с момента релиза ArCore, есть разработчики, которые до сих пор не работали с этой технологией. В докладе мы посмотрим, какие возможности открывает ArCore не только в сфере развлечений, но и перед бизнесом, и какие изменения претерпел фреймворк с момента первого релиза. Также я расскажу о процессе создания Android-приложения с дополненной реальностью и о проблемах, с которыми можно при этом столкнуться.

Transcript

2. ARCore + Sceneform Как создавать дополненную реальность? Порошин Иван
3. 1 Примеры использования AR 2 ARCore и Sceneform 3 Как сделать своё приложение с AR Содержание
4. ARCore + Sceneform Примеры использования AR
5. › Дополненная реальность – больше не фантастика 5
9. ARCore + Sceneform ARCore и Sceneform: ключевые возможности
10. Что такое ARCore 10
11. Что умеет ARCore › Вычисление позиции устройства › Поиск ключевых объектов › Трекинг ключевых объектов › Оценка уровня освещения 11
12. Требования › minSdkVersion >= 24 › Доступ к камере › Приложение ARCore › Устройство из списка поддерживаемых 12
13. Абстракции ARCore 13
14. Абстракции ARCore › Camera 14
15. Абстракции ARCore › Camera › Pose 15
16. Абстракции ARCore › Camera › Pose › Frame 16
17. Абстракции ARCore › Camera › Pose › Frame › Point 17
18. Абстракции ARCore › Camera › Pose › Frame › Point › Plane 18
21. Абстракции ARCore › Camera › Pose › Frame › Point › Plane 21
22. Абстракции ARCore › Camera › Pose › Frame › Point › Plane › Anchor 22
24. Что появилось после релиза? › Cloud anchors › Augmented images › Augmented faces 24
25. Cloud anchors 25
26. Cloud anchors 26
27. Cloud anchors 27 Point cloud Anchor pose
28. Cloud anchors 28 Point cloud Anchor pose
29. Cloud anchors 29 Point cloud Anchor pose
30. Cloud anchors 30 Point cloud Anchor pose
31. Cloud anchors 31 Point cloud Anchor pose
32. Cloud anchors 32 Point cloud Anchor pose
33. Cloud anchors 33 Point cloud Anchor pose Point cloud
34. Cloud anchors 34 Point cloud Anchor pose Point cloud
35. Cloud anchors 35 Point cloud Anchor pose Loading...
36. Cloud anchors 36 Point cloud Anchor pose Anchor pose
37. Cloud anchors 37 Point cloud Anchor pose
38. Cloud anchors: ограничения › Anchor жив только в течение 24 часов › Матчинг происходит на серверах Google › Нельзя получить назад облако точек › Нет привязки к геоданным 38
39. Augmented Images 39
40. Augmented Images 40
41. Augmented Faces 41
42. Сравнение с ARKit 42 ARCore ARKit
43. Рендеринг 43
44. Рендеринг 44
45. Рендеринг 45
48. Sceneform › Высокоуровневое API над ARCore 48
49. Sceneform Высокоуровневое API над ARCore: › › › 49
50. Sceneform Высокоуровневое API над ARCore: › Реалистичный рендерер › › 50
51. Sceneform Высокоуровневое API над ARCore: › Реалистичный рендерер › Граф объектов › 51
52. Sceneform Высокоуровневое API над ARCore: › Реалистичный рендерер › Граф объектов › Плагин для Android Studio 52
53. Sceneform Высокоуровневое API над ARCore: › Реалистичный рендерер › Граф объектов › Плагин для Android Studio 53
54. Sceneform › Позволяет делать AR без глубоких знаний OpenGL › Достаточно гибкий для тех, кто знаком с OpenGL 54
57. ARCore + Sceneform Talk is cheap, show me the code!
59. ARCore + Sceneform Этап 1: Подготовка
61. build.gradle проекта buildscript { dependencies { classpath 'com.google.ar.sceneform:plugin:1.7.0' } } 61
62. build.gradle приложения dependencies { implementation 'com.google.ar:core:1.7.0' implementation 'com.google.ar.sceneform:core:1.7.0' implementation 'com.google.ar.sceneform.ux:sceneform-ux:1.7.0' } apply plugin: 'com.google.ar.sceneform.plugin' 62
63. AndroidManifest.xml <manifest> <uses-feature android:name="android.hardware.camera.ar" android:required="true" /> <uses-permission android:name="android.permission.CAMERA" /> <application> <meta-data android:name="com.google.ar.core" android:value="required" /> </application> </manifest> 63
64. ARCore + Sceneform Этап 2: Пустая сцена
65. activity_main.xml <fragment android:name="com.google.ar.sceneform.ux.ArFragment" android:id="@+id/main_ar_fragment" android:layout_width="match_parent" android:layout_height="match_parent" /> 65
66. ArFragment › Проверяет наличие ArCore › Запрашивает runtime permissions › Инициализирует ArCore › Содержит ArSceneView 66
67. ArSceneView 67
68. ArSceneView SceneView 68
69. activity_main.xml val availability = ArCoreApk.getInstance().checkAvailability(ctx) if (availability.isSupported()) { // Показать ArFragment } else { // Показать SceneView } 69
71. ARCore + Sceneform Этап 3: Граф объектов
72. Граф объектов › Дерево › Орграф › Корень дерева – Scene › Узлы дерева – Node 72
73. Граф объектов › У каждого узла есть Pose › При отрисовке применяются Pose всех родителей › Это эффективно реализовано с помощью матриц 73
74. Граф объектов 74 Scene
75. Граф объектов 75 Scene Balloon
76. Граф объектов 76 Scene Balloon Portal
77. Граф объектов 77 Scene Balloon Portal Speed indicator
78. Граф объектов 78 Scene Balloon Portal Speed indicator Anchor Node
79. Сборка графа объектов val anchor /* пусть Anchor уже существует */ val portalNode = Node() val speedNode = Node() val ballonNode = Node().apply { addChild(speedNode) } val anchorNode = AnchorNode(anchor).apply { addChild(portalNode); addChild(balloonNode) } mArFragment.arSceneView.scene.addChild(anchorNode) 79
80. ARCore + Sceneform Этап 4: Поиск и импорт моделей
81. Добавление моделей › Каждому узлу в дереве можно задать Renderable 81
82. Добавление моделей › Каждому узлу в дереве можно задать Renderable › Renderable может быть 3d модель или View 82
83. Где взять 3d модели? › › › › › 83
84. Где взять 3d модели? › Найти художника › › › › 84
85. Где взять 3d модели? › Найти художника › Google Poly › Unity Asset Store › И другие подобные ресурсы › 85
88. Где взять 3d модели? › Найти художника › Google Poly › Unity Asset Store › И другие подобные ресурсы › 88
89. Где взять 3d модели? › Найти художника › Google Poly › Unity Asset Store › И другие подобные ресурсы › Сделать самому 89
90. Где взять 3d модели? › *.obj › *.glTF › *.fbx 90
91. Где взять 3d модели? › *.obj - формат без анимаций › *.glTF - анимации есть, но импортировать нельзя › *.fbx - анимации есть и импортировать можно 91
92. Где взять 3d модели? › Обычно ещё есть *.mtl, *.jpg, *.png, etc. 92
93. Импорт моделей 93
94. Импорт моделей /* build.gradle */ sceneform.asset('src/main/assets/balloon/balloon.obj', 'src/main/assets/balloon/balloon.mtl', 'src/main/assets/balloon/balloon.sfa', 'src/main/res/raw/balloon') 94
95. Импорт моделей 95
97. Импорт моделей 97
98. Загрузка моделей в приложении val balloonRenderable = ModelRenderable.builder() .setSource(context, R.raw.balloon) .build() /* returns CompletableFuture */ val portalRenderable = ModelRenderable.builder() .setSource(context, R.raw.portal) .build() 98
99. Загрузка моделей в приложении val speedometerRenderable = ViewRenderable.builder() .setView(context, R.layout.view_speedometer) .build() 99
100. ARCore + Sceneform Этап 5: Anchor
101. Получение Anchor arFragment.setOnTapArPlaneListener { hit, plane, motionEvent -> val anchor = hit.createAnchor() ... } 101
102. Получение Anchor › Другой способ: augmented images 102
103. Получение Anchor › Другой способ: augmented images 103
104. База данных с изображениями 104
105. Качество изображений ./arcoreimg eval-img --input_image_path=... › Позволяет оценить качество картинки от 0 до 100 › Стоит брать картинки с качеством >= 75 105
106. Качество изображений 106 0
107. Качество изображений 107 35
108. Качество изображений 108 100
109. Получение Anchor class MyArFragment : ArFragment() { override fun getSessionConfiguration(session: Session?): Config { val config = super.getSessionConfiguration(session) val inputStream = context!!.assets.open("images.imgdb") config.augmentedImageDatabase = AugmentedImageDatabase.deserialize(session, inputStream) return config } ... } 109
110. Получение Anchor class MyArFragment : ArFragment() { override fun getSessionConfiguration(session: Session?): Config { val config = super.getSessionConfiguration(session) val inputStream = context!!.assets.open("images.imgdb") config.augmentedImageDatabase = AugmentedImageDatabase.deserialize(session, inputStream) return config } ... } 110
111. Получение Anchor class MyArFragment : ArFragment() { override fun getSessionConfiguration(session: Session?): Config { val config = super.getSessionConfiguration(session) val inputStream = context!!.assets.open("images.imgdb") config.augmentedImageDatabase = AugmentedImageDatabase.deserialize(session, inputStream) return config } ... } 111
112. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 112
113. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 113
114. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 114
115. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 115
116. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 116
117. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 117
118. Получение Anchor class MyArFragment : ArFragment() { ... override fun onUpdate(frameTime: FrameTime?) { super.onUpdate(frameTime) val frame = arSceneView.arFrame ?: return val images = frame.getUpdatedTrackables(AugmentedImage::class.java) .filter { it.trackingState == TrackingState.TRACKING } .firstOrNull { it.name == "balloon.png" } ?.let { it.createAnchor(it.centerPose) } ?.apply { buildSceneGraph(this) } } } 118
120. Затраченное время › 4 часа на внимательное чтение документации › 10 часов на написание кода игры › Из них 4 часа – код, работающий с Sceneform 120
121. Заключение › Благодаря ARCore AR стала намного более доступной › Но от этого AR не перестала быть захватывающей 121
122. Ссылки › Докуметация: https://developers.google.com/ar/develop/java/quickstart › Репозиторий ARCore: https://github.com/google-ar/arcore-android-sdk › Репозиторий игры: https://github.com/niemandkun/flying-balloon-ar-app › Google I/O про AR: https://youtu.be/MeZcQguH124 122
123. Ссылки › New York Times: com.nytimes.android › AR Ruler: com.grymala.aruler › Living Wine Labels: com.tweglobal.ar19crimes 123
124. t.me/niemandkun poroshin-ivan@yandex-team.ru Спасибо за внимание! Порошин Иван Android-разработчик github.com/niemandkun