Как создать дополненную реальность, написав 12 строк кода
Создать дополненную реальность можно за несколько минут. Чтобы познакомиться с основами AR, достаточно базового знания HTML.
AR.js — библиотека для создания дополненной реальности. Она объединена с фреймворком A-Frame, который предназначен для разработки VR в вебе. Главный плюс AR.js — очень простой процесс создания AR-приложений. Достаточно импортировать библиотеку и добавить объекты, которые будет видеть пользователь при выполнении заданных условий — например, наведении камеры на маркер или нахождении в указанном месте.
Все ссылки на документацию будут в конце статьи, а пока посмотрим самое интересное — как это работает на практике. Результат будет примерно такой:
На данный момент этот блок не поддерживается, но мы не забыли о нём! Наша команда уже занята его разработкой, он будет доступен в ближайшее время.
Важно: чтобы посмотреть примеры AR-контента, нужно второе устройство с камерой — например, смартфон. В тексте есть ссылки на CodePen. Откройте их на устройстве с камерой и разрешите браузеру доступ.
Как создать AR-приложение за несколько минут
Импортируем в HTML-код A-Frame и AR.js:
Затем внутри создадим сцену, которая будет охватывать все необходимые нам элементы: маркер, камеру, AR-объект.
Следующий шаг — добавление маркера. Пока используем preset Hiro. Это дефолтный маркер AR.js, его изображение вы найдёте ниже:
Добавим AR-объект внутри . Попробуем один из примитивов, которые предлагает фреймворк A-Frame:
Напоследок добавляем камеру. Одна должна быть за пределами маркера. Это нужно для того, чтобы AR-объект появлялся только при наведении камеры на маркер. Если в объективе нет маркера, дополнительный контент не отображается на экране.
Создание дополненной реальности для бизнеса: лучшие AR-платформы
Решения в области Web AR для бизнеса — это способ уйти от разработки дополнительных приложений с одной стороны, а с другой — возможность предоставить доступ к дополненной реальности для гораздо большего числа пользователей мобильных устройств — через браузер. Если вы хотите узнать больше о технологии дополненной реальности в вебе, рекомендуем вам прочесть эту статью .
Моделирование дополненной реальности — довольно трудоемкая задача, и для создания AR-проектов, в том числе и в браузере, вам понадобятся соответствующие инструменты. Разработка дополненной реальности предполагает решение двух основных задач:
1. Создание виртуального контента и методов взаимодействия с ним.
2. Определение положения цифровых объектов на изображении.
Для решения первой задачи существует множество программ, которые позволяют “оживить” статичные объекты. Графический движок должен плавно объединять сцены дополненной реальности с реальной средой. Unity 3D — популярный кроссплатформенный конструктор для создания детализированного AR-контента; эти же функции выполняет программа Blender . Пакет инструментов RealityKit от Apple, пришедший на смену SceneKit, позволяет моделировать сложную 3D-графику на iOS. А с помощью SceneForm от Google разработчики могут создавать реалистичные трехмерные визуализации для браузеров или приложений дополненной реальности на Android.
Вторая задача связана с компьютерным зрением : необходимо проанализировать реальный мир и задать координаты проецируемых объектов через распознавание специального маркера — как правило, 2D-изображения, определить его положение в пространстве и построить относительно него виртуальный объект. Для этого понадобятся специальные средства для разработки дополненной реальности.
Топ 5 SDK дополненной реальности
Будучи основным технологическим движком, SDK дополненной реальности (=Software Development Kit) обеспечивает весь процесс разработки AR, включая рендеринг контента и наложение виртуальных объектов и цифровой информации на реальный мир. Давайте рассмотрим наиболее популярные платформы для работы с AR в 2020 году.
Vuforia
Vuforia является одной из самых популярных программ для создания AR-контента и содержит ряд инструментов, например, Vuforia Engine, Studio и Chalk. Vuforia использует компьютерное зрение для распознавания, отслеживания планарных изображений (Image Targets) и простых 3D-объектов в режиме реального времени, а также подходит для разработки маркерной и безмаркерной дополненной реальности. К основным функциям платформы можно отнести создание опорной плоскости (Ground Plane) и добавление контента на горизонтальные поверхности, инструменты Visual Camera и VuMarks (кастомные метки, которые используются для распознавания лиц и шифрования данных). Кроме того, Vuforia поддерживает виртуальные кнопки, фоновые эффекты и возможности окклюзии — может находить даже частично скрытые объекты. Пример отслеживания изображений в Vuforia:
Wikitude
Wikitude SDK — это кроссплатформенное приложение, специально разработанное для создания AR-прототипов для мобильных устройств на iOS, Android и Windows. Wikitude поддерживает большое число фреймворков, в том числе Unity, React Native и Ionic. Его основные возможности включают отслеживание объектов и инициализатор выравнивания (Object Tracking and Alignment Initializer) на основе 3D-моделей, отслеживание изображений и сцен, облачное хранилище данных для больших AR-проектов, Geo AR, отслеживание цилиндров и ряд других функций, реализованных в новой версии SDK Wikitude 9.0.
ARKit
ARKit — фреймворк от Apple для создания дополненной реальности на iOS-устройствах. Он использует датчики камеры и дополнительные данные с гироскопа и акселерометра для обнаружения и анализа пользовательской среды для визуализации AR. Благодаря использованию VIO (визуальной инерциальной одометрии) ARKit может размещать трехмерные объекты и накладывать цифровую информацию относительно контекста. К основным функциям ARKit можно отнести SLAM (одновременную локализацию и построение карты), объединение датчиков, оценку условий освещения, определение масштаба, вертикальных и горизонтальных плоскостей, стабильное и быстрое отслеживание движения.
ARKit 4 был анонсирован во время недавней WWDC 2020 вместе с iOS 14, в его состав вошли некоторые расширенные функции, например, Location Anchors (привязка к местоположению), Depth API для измерения удаленности и улучшенного размещения объектов, отслеживание лиц и использование видео в качестве текстуры и источника звука для AR. Поддержка окклюзии также была улучшена.
ARCore
ARCore — платформа Google для создания дополненной реальности, которая использует различные API, позволяет мобильным устройствам “понимать” и ориентироваться в окружающем пространстве и взаимодействовать с информацией. Некоторые API-интерфейсы доступны на Android и iOS, благодаря чему можно одновременно подключаться к одной AR с нескольких телефонов. ARCore использует камеру устройства и показания инерционных датчиков для отслеживания движения и просмотра объектов под любым углом, определения размера и расположения всех типов поверхностей: горизонтальных, вертикальных, наклонных, плоских (стол или пол, например), оценки уровня освещения. Недавно компания Google выпустила Depth API с поддержкой окклюзии для еще более реалистичного опыта погружения в AR.
ARCore работает на телефонах под управлением Android 7.0 и выше . Он совместим с Unity, Unreal, и может использоваться для iOS для создания многопользовательской дополненной реальности.
MaxST
MaxST AR SDK — еще один мощный инструмент для креативных разработчиков, совместимый с Android, iOS, Windows и MacOS. Среди его функций можно выделить Image Tracker для распознавания и отслеживания планарных участков на изображении в трех режимах (обычном, стандартном и мульти), Instant Tracker для определения плоской поверхности в поле зрения камеры для наложения трехмерного объекта, Visual SLAM, Object Tracker (для работы с 3D-картами) и сканер QR/ штрихкодов.
Хотите создать AR-решение без использования кода? Не проблема!
Если вы планируете отказаться от разработки приложений или являетесь начинающим программистом, рекомендуем обратить внимание на лоукод- (low-code) и зерокод-разработку (zero-code). Правильные инструменты позволят воплотить в жизнь ваши идеи даже в таком сложном сегменте, как дополненная реальность!
- Blippbuilder — это мощная drag-and-drop платформа от Blippar, в которой можно создавать простые AR-решения без предварительного опыта программирования и настройки приложений, отслеживать данные в реальном времени, а еще есть доступ к техническим инструкциям. Вот пример мини-игры, созданной с использованием Blippar для рекламы нового драже M&M’s:
- PlugXR — еще одна облачная платформа, которая предоставляет все необходимые функции для создания AR-приложений для Web AR либо white-label-приложений для Android и iOS без использования кода. PlugXR также поддерживает отслеживание AR во всех измерениях и по всем вертикалям для создания полноценного опыта взаимодействия. Ниже вы видите пример визитной карточки с дополненной реальностью, созданной при помощи PlugXR:
Хотите создать решение, которое поможет вашему бизнесу развиваться, и ищете опытную команду разработчиков? Свяжитесь с нами — будем рады обсудить ваши идеи и пожелания, и ответим на любые вопросы.
Думаю уже все успели прочитать статьи Стефани Огу о Дополненной реальности (AR), которые «помогают нам, веселят нас и просто делают нашу жизнь другой!».
Но, что, если хочется сделать нечто подобное самому, пускай даже не в реальном времени, а на видео? Как реализовать мечту? Для этого мы вновь открываем «абсолютно прекрасный» Blender. Поехали!
ТРЕКИНГ КАМЕРЫ
Начнем с ключевых понятий.
Я очень часто буду упоминать слово рендер в разных значениях. РЕНДЕР – это визуализация сцены, которая была полностью просчитана (начиная от лучей света и заканчивая шероховатостью материалов на объектах), т.е. создание плоской картинки из 3D сцены.
ОТРЕНДЕРИТЬ – значит отобразить проекцию модели на камеру с помощью Blender’a в нужном качестве и виде(видео/картинка и т.д.).
ТРЕКИНГ КАМЕРЫ (отслеживание) – это процесс определения местоположения и ориентации движущегося объекта в виртуальной среде. Отслеживание конвертирует движения на видео в цифровую информацию. Благодаря этому мы можем разместить 3D объекты на видео, даже если камера все время перемещается
Как это делают профессионалы – можно посмотреть в youtube канале. IanHubert – это тот , у кого есть чему поучиться. Не зря версия программы «Blender 2.83» имела его обложку.
КАК ЭТО БУДЕМ ДЕЛАТЬ МЫ
Нашей целью является создание виртуальной комнаты, которая будет соответствовать отснятому нашему видео, где мы сможем размещать 3D объекты, а виртуальная камера повторит движения той, с помощью которой было отснято видео.
Начнем с веселого. Нам нужна камера и точки контраста. Для этого я просто взял обычный лист бумаги и нарисовал на нем несколько жирных точек – нам нужно минимум 8, так как Blender не «переваривает» меньше. Именно жирные точки – точки контраста, по которым камера и просчитает свое передвижение.
Теперь снимаем небольшое видео, в каждом кадре которого должен быть виден этот листик. Снятое видео должно быть без расфокусов, затенений и «дрожи в руках» и так далее. Ну, и длительность ролика — не больше минуты, иначе последний этап создания AR затянется.
Идея состоит в том, что видео нужно загрузить в программу, а затем либо «руками», либо «дать волю программе» выделить точки, относительно которых программа просчитывает поведение камеры в пространстве, как я уже и говорил, из-за эффекта параллакса.
Синие линии – те линии, по которым будут двигаться точки. Красные – те, которые были пройдены. После полной обработки видео нужно посмотреть, насколько точно программа уверена в точках контраста. Если точку было тяжело просчитать – ее погрешность велика (программа не уверена в положении точки). Такая погрешность должна быть меньше пикселя.
Когда просчет закончен, можно указать какие точки будут полом (тут достаточно треугольника, то есть трех точек), началом координат. Теперь вспоминаем, что мы вообще хотели: добавить на видео какую-нибудь 3D модель. У меня это будет маскот блендера и куб. Ибо куб — лучше, чем квадрат, на целую координату.
Затем в программе указываем, что рендер модели будет с прозрачным фоном и его будем накладывать на соответствующий кадр из видео. В итоге можно получить забавный результат!
И вот тут приходит дьявол… Допустим у меня есть более масштабная сцена. Рендерил я ее, допустим, 10 минут… Мне нужно для каждого кадра видео отрендерить эту сцену в правильном ракурсе… А кадров у меня 30 в секунду и длительность – 10 минут. Выходит, что рендер легко может занять у меня (для 18 000 кадров – 3000 часов). Поэтому мне тяжело делать очень крутую, детализированную и длительную анимацию, но короткое видео на минуту – вполне реально!
Рендер этой высоко детализированной сцены занимает на моем компьютере 10 минут…
Теперь, напоследок, я бы хотел предложить вам интерактив. Вы предлагаете в комментах Инстаграм, что можно было бы сделать на фоне универа, и я попробую сделать самую интересную идею, своими ограниченными силами.
Дополненная реальность
Unity предлагает мощные инструменты для разработки насыщенных и увлекательных приложений в дополненной реальности с интеллектуальным взаимодействием с реальным миром.
Платформа полного цикла разработки
Unity предлагает специальные ресурсы, которые помогут вам воплотить идеи в жизнь. Наша ведущая платформа разработки ПО сочетает специальные инструменты для разработки дополненной реальности и единый процесс разработки для самых разных устройств, что убирает все преграды для вашего воображения.
Мы активно используем и внедряем разработку AR-контента, и платформа Unity стала важнейшим элементом нашего стека технологий — открытой для творчества «песочницей» для быстрого прототипирования и надежной платформы для издания готового продукта.
Dave Cowling, VP of Engineering, Within
Инструменты для воплощения творческих замыслов
AR Foundation
Среда, созданная специально для разработки AR, позволяет создать приложение, а затем выпустить его на всех целевых мобильных AR-устройствах и гарнитурах. В состав среды включены базовые функции всех поддерживаемых платформ, а также реализованы уникальные особенности Unity, включая фотореалистичный рендеринг, физику, оптимизацию под конкретные устройства и многое другое.
Unity MARS
Unity MARS предоставляет AR-разработчикам в самых разных отраслях специализированные инструменты и удобные процессы создания AR-приложений, интеллектуально взаимодействующих с реальным миром.
Используйте Unity как библиотеку
Добавьте технологии AR на основе Unity непосредственно в существующее нативное мобильное приложение. Не нужно полностью перерабатывать приложение для реализации AR — вы можете раскрыть всю мощь технологий AR от Unity, встроив их в уже созданное приложение.
XR Interaction Toolkit
Повысьте интерактивность AR-приложений простым перетаскиванием компонентов в сцену — программирование взаимодействий объектов с нуля больше не требуется.