Объемные видеоролики 8i позволяют запечатлеть реалистичные голограммы людей

Будущее наступило, люди. Благодаря нашим друзьям из 8i человеческие голограммы стали реальностью. 8i использует технологию объемного видео для захвата 3D-записей людей (и животных 🙀), которые можно увидеть в AR, VR и MR. Благодаря нашей последней интеграции, теперь вы можете импортировать свои голограммы 8i в 8th Wall и публиковать их как собственный научно-фантастический опыт Web AR.

Технический директор 8i Volumetric, Esta Chiang, сказал об интеграции: «Мы искали простой способ продемонстрировать связь между реальным человеком и голограммой. Для нас это большой успех ».

Дайте ему кружиться!

Нажмите кнопку ниже, чтобы испытать мобильную демонстрацию в Web AR:

Вы можете скачать образец проекта из нашего публичного репозитория Github.

Есть ли еще одна интеграция, которую вы хотели бы увидеть в поддержке 8th Wall? Оставьте комментарий ниже или напишите нам в Твиттере @ the8thwall.

Хотите сами попробовать построить проект 8i x 8th Wall?

Выполните следующие действия:

1. Зайдите на 8thwall.com и войдите в 8th Wall Console (или зарегистрируйтесь бесплатно)

2. Убедитесь, что выбрана рабочая область «Веб-разработчик».

3. В правом верхнем углу экрана нажмите «Авторизация устройства», чтобы авторизовать телефон для просмотра разрабатываемых функций. Отсканируйте QR-код своим телефоном, и вы увидите сообщение: «Режим разработчика включен».

4. На панели инструментов нажмите «Создать новое веб-приложение». Назовите свое веб-приложение и нажмите «Создать».

5. Скопируйте 📋 ключ своего приложения из Личного кабинета

6. Перейдите на страницу быстрого запуска. Убедитесь, что у вас установлен NPM, и загрузите или клонируйте наш общедоступный репозиторий GitHub 8th Wall Web.

7. В GitHub загрузите все содержимое репозитория в виде ZIP-файла. После завершения загрузки щелкните, чтобы развернуть ZIP-файл.

8. Добавьте ключ своего приложения в проект. Откройте текстовый редактор, и под «examples / threejs» вы увидите каталог «8i-hologram». Зайдите в это и откройте файл index.html. Найдите следующую строку и замените X на ключ приложения, который вы скопировали ранее. Сохранить 💾

<script async src="//apps.8thwall.com/xrweb?appKey=XXXXXXXX"></script>

9. Откройте окно терминала, если вы работаете на Mac, или, если вы используете Windows, откройте стандартную командную строку (не PowerShell). Откройте папку, в которой находятся проект и скрипт обслуживания. Внутри вы увидите каталог «подавать». В окне терминала введите «cd» для изменения каталога и либо введите полный путь к каталогу serve /, либо просто перетащите папку serve, и путь будет введен за вас. Нажмите Enter.

[tony@TonyMBP ~/Downloads/web-master]$ cd serve/
[tony@TonyMBP ~/Downloads/web-master/serve]$

10. Запустите «npm install» и дождитесь завершения команды. Это установит все модули узла, необходимые для запуска сценария обслуживания на нашем компьютере. Как только это будет сделано, мы по-прежнему будем в каталоге «обслуживать».

# npm install

11. Поднимитесь на один каталог вверх, обратно в веб-мастер. На Mac введите «pwd», чтобы проверить текущий каталог. В Windows введите «cd» и нажмите Enter, чтобы отобразить текущий каталог:

[tony@TonyMBP ~/Downloads/web-master/serve]$ cd ..
[tony@TonyMBP ~/Downloads/web-master]$ pwd
/Users/tony/Downloads/web-master
[tony@TonyMBP ~/Downloads/web-master]$

12. Запустите сценарий «serve», который устанавливает локальный веб-сервер на вашем компьютере. Команда немного отличается, если на Mac и на ПК:

На Mac:

./serve/bin/serve -n -d examples/threejs/8i-hologram

Нажмите Enter, чтобы запустить скрипт. После инициализации вы увидите QR-код, который можно отсканировать, чтобы подключиться к демонстрации. Над QR-кодом вы также увидите фактический URL-адрес, на который вас перенаправит QR-код.

Если вы работаете в Windows, убедитесь, что вы запускаете из каталога веб-мастера. Тип:

serve\bin\serve -n -d examples\threejs\8i-hologram

Нажмите Enter.

Отсканируйте QR-код на своем экране. Это подключит вас к локальному веб-серверу, работающему на вашем компьютере.

13. Предоставьте камере разрешения для просмотра базовой демонстрации 8i.