Создание AR-визитки
Last updated
Last updated
Отличным примером использования дополненной реальности является визитная карточка в AR.
В этой статье вы узнаете, как создать такую же сцену в редакторе MyWebAR.
Первое, что необходимо сделать — создать новый проект. Для этого перейдите на вкладку с проектами (Dashboard).
Далее необходимо нажать на кнопку Add new project.
Откроется окно выбора типа трекинга.
В данном случае нужно выбрать AR on Images, нажав на кнопку Create.
Трекинг изображений недоступен на тарифном плане Free.
Для его использования необходимо перейти на тариф Basic или Unlimited, либо воспользоваться пробной версией MyWebAR.
После этого откроется окно добавления маркера. Здесь вы должны загрузить изображение вашей визитной карточки.
Далее необходимо нажать на кнопку Upload Image.
После этого произойдет переход на страницу редактора дополненной реальности.
В данном случае сцена будет состоять из:
Нескольких 3D-моделей,
3D-модели аватара человека, с использованием плагина Player Ready Me (или просто 3D-модель),
Видеофайла,
Изображения
Разберем добавление каждого элемента по отдельности.
В этом случае 3D-модели будут представлять собой иконки социальных сетей, при нажатии на которые будут переходить по ссылкам.
Для добавления 3D-модели, нужно нажать на кнопку + в поле Model 3D.
Откроется окно добавление модели.
В данном случае 3D-модель будет загружаться с устройства, поэтому необходимо нажать на кнопку Upload.
После выбора объекта необходимо подождать некоторое время, пока он загрузится. После этого модель появится в окне предварительного просмотра.
Вы можете использовать встроенный оптимизатор модели, нажав кнопку Use Optimized. Или можно загрузить 3D-модель без оптимизации, нажав кнопку Use Original.
Окно закроется, и объект появится на сцене.
Теперь аналогичным образом нужно добавить еще иконки социальных сетей, например Facebook и LinkedIn, и разместить их перед маркером.
Для этого нужно выбрать нужную модель, например LinkedIn, щелкнув по ней с правой стороны.
Далее, в правой части, в блоке Properties, нужно нажать на кнопку Add Action.
Откроется окно с доступными поведениями.
В списке нужно выбрать Navigate to URL on click.
Поведение появится в правой части.
В этом случае необходимо изменить только параметр url. Это должна быть ссылка, например, на социальную сеть.
Таким же образом нужно добавить поведение для остальных социальных сетей.
Первое, что нужно сделать, это открыть страницу с доступными плагинами, нажав на кнопку Extensions в левой части.
Откроется окно для работы с плагинами.
В данном случае нужен плагин READY PLAYER ME.
Кликнув по нему, откроется модальное окно с описанием этого плагина.
Для его установки, нужно нажать кнопку Install.
После этого у вас снова откроется редактор сцены, то есть вкладка Content.
Добавленный плагин появится в списке объектов слева. Для его добавления нажмите на кнопку +.
Откроется окно добавления объекта. В этом окне вы будете создавать аватар шаг за шагом.
Первое, что вам нужно сделать, это выбрать тип тела (по половому признаку).
Далее необходимо загрузить свое изображение (или сделать селфи).
Выбранная фотография появится в окне предварительного просмотра. Чтобы продолжить, нажмите кнопку Accept.
Аватар начнет загружаться и обрабатываться. Вам нужно подождать определенное время.
После обработки вы увидите получившийся 3D-аватар. Кроме того, вы можете изменить его по своему усмотрению.
Для продолжения нажмите кнопку Next.
Следующий шаг - создать учетную запись, чтобы сохранить полученный аватар, или просто продолжить, нажав на кнопку Continue without signup.
После того как аватар будет обработан, он появится на сцене.
Чтобы добавить видеофайл, нажмите кнопку + в поле Video.
Откроется окно добавления видеофайла.
В данном окне нужно нажать на Upload в нижней части окна.
Откроется модальное окно для загрузки видео.
Для загрузки вы можете перетащить вашу модель прям в это окно, либо нажать на кнопку Upload для того, чтобы выбрать из файлов вашего устройства.
После короткого ожидания откроется окно кастомизации видеофайла.
В данном случае вы можете включить следующие параметры: автовоспроизведение и зацикливание и нажать кнопку Next.
Видеообъект нужно переместить в верхнюю часть визитки.
Чтобы добавить изображение, нажмите кнопку + в поле Photo.
Откроется окно добавления изображения.
В данном окне нужно нажать на Upload в нижней части окна.
Чтобы загрузить изображение с устройства, нажмите Upload или перетащите изображение в это окно.
После короткого ожидания откроется окно кастомизации видеофайла.
Этот объект следует переместить в нижнюю часть визитной карточки, под 3D-иконки.
Таким образом получится подобная сцена.
Вы можете посмотреть, как он будет выглядеть в дополненной реальности, отсканировав этот QR-код.
В открывшемся браузере наведите камеру на изображение ниже:
Для того чтобы сделать 3D-иконки кликабельными, необходимо добавить .
