Научитесь создавать WebXR, VR и AR опыт, используя Three.JS [Udemy] [Николас Левер]

Научитесь создавать WebXR, VR и AR опыт, используя Three.JS
Используйте возможности нового WebXR API и Three.JS, чтобы привнести иммерсивный опыт, VR и AR, в браузере
Автор: Николас Левер



Субтитры: Русский, Английский [Авто]
Язык: Английский

Чему вы научитесь

• Как легко создавать приложения VR и AR, которые работают в браузере
• Как использовать библиотеку ThreeJS для создания этих приложений
• Как обращаться с контроллерами
• Как заменить контроллеры на нестандартные модели
• Как создавать архитектурные обзоры, игры и обучающие приложения.
• Как добавить интерфейс в мир
• Разработка приложений AR, поддерживающих тестирование попаданий в реальном мире
• Изучите игровые приемы VR, такие как телепортация и взаимодействие с моделями в сцене с помощью контроллеров.

Описание

WebXR предоставляет браузеру как VR, так и AR . API имеет огромные силы от Google и Amazon за ним , так это выглядит , как иммерсивный опыт, используя только браузер, собирается сделать огромное влияние в ближайшем будущем. WebXR отлично работает с гарнитурами Oculus, а браузер Chrome Android уже поддерживает API для AR и VR. Но WebXR использует только датчикимобильного устройства и дает согласованное определение того, как использовать эти данные. Чтобы действительно визуализировать 3D-контент, вам нужна библиотека WebGL, и нет ничего лучше, чем Three.JS. Эта зрелая библиотека с открытым исходным кодом имеет множество пользователей по всему миру и поддерживается многими разработчиками. Three.JS имеет версию 118 на момент написания и представляет собой надежную, готовую к работе библиотеку. Недавно в библиотеку была добавлена поддержка WebXR. Упрощение для разработчиков создания иммерсивного опыта .

В этом курсе вы узнаете, насколько легко с помощью Three.JS создавать возможности виртуальной и дополненной реальности. Чтобы получить максимальную отдачу от курса, вам необходимо хорошо разбираться в кодировании JavaScript . Никаких других предварительных условий не требуется.

Курс разделен на 10 разделов .

1. Введение. Я познакомлю вас с историей WebXR, дам вам базовый курс для тех, кто плохо знаком с концепциями 3D, и покажу вам веб-сайт Three.JS и примеры WebXR.
   
   
2. Three.js Primer - для three.js новичков довести вас до скорости в библиотеке.
   
   
3. Введение в WebXR с использованием Three.JS - мы серьезно изучаем вашу среду разработки и создаем наши первые примеры WebXR .
   
   
4. Использование сложных ресурсов с Three.JS - большинство вещей, которые вы создаете для иммерсивного опыта, потребуют сложных ресурсов, и их поиск, редактирование, загрузка и работа с ними является предметом раздела 4.
   
   
5. WebXR API - дает обзор WebXR API.
   
   
6. Создание архитектурного обхода - в разделе 6 мы начинаем создавать реальные примерыиммерсивного контента с архитектурного обхода.
   
   
7. Размещение продукта в комнате - WebXR позволяет показывать реальные продукты в доме человека, и это тема раздела 7.
   
   
8. Использование WebXR для игр - VR идеально подходит для игр, и в этом разделе мы рассмотрим основные составляющие игры с использованием WebXR .
   
   
9. Использование WebXR для обучения - затрагивает важную тему использования VR для обучения.
   
   
10. Заключение - мы рассмотрим некоторые примеры WebXR, чтобы вдохновить вас и повторить то, что вы узнали.
    Единственные инструменты, которые вам понадобятся, - это редактор кода , в курсе я использую Brackets , который доступен бесплатно в Интернете. Курс включает исчерпывающие ресурсы и примеры кода. Каждый пример кода поставляется с двумя версиями: одна для вас, чтобы кодировать вместе, а другая - полная на тот случай, если вы столкнетесь с проблемой. Я покажу вам, как использовать github для размещения ваших разработок на защищенном сервере, чтобы вы могли легко протестировать свою работу на гарнитуре , такой как Oculus Quest.

Будет весело.

Материалы курса
• 44 лекций • Общая продолжительность 4 ч 40 мин

Спойлер: Материалы курса

• Предпросмотр03:40
• Настройка безопасного веб-сервера
  00:56
• Предпросмотр06:09
• A 3D Primer
  05:11
• Примеры THREE.js
  06:14
• Что вы узнали?
  4 вопросов

• Настройка простой страницы THREE.js с использованием модулей
  06:17
• Создание вращающегося куба
  09:59
• Редактор THREE.js
  07:36
• Геометрии
  06:30
• Материалы
  05:54
• Погрузчики
  06:45
• Что вы узнали?
  5 вопросов

• Предпросмотр05:24
• Настройка VRButton
  11:38
• Добавление взаимодействия пользователя с контроллером
  07:40
• Добавление события нажатия кнопки в контроллер
  09:18
• Создание собственного контроллера
  06:40
• Доступ к геймпаду
  09:57
• Предпросмотр08:13
• Физика в вашем VR-мире
  12:17
• Предпросмотр06:41
• Контроллеры в приложении AR
  07:17
• Сенсорные жесты в приложении AR
  10:17
• Предпросмотр09:39
• Что вы узнали?
  10 вопросов

• Поиск активов в Интернете
  06:18
• Использование Mixamo для настройки анимации персонажей
  02:54
• Использование Blender для экспорта активов
  03:59
• Использование системы анимации THREE.js
  07:38
• Что вы узнали?
  2 вопросов

• XRSystem и XRSession
  03:55
• XRFrame и XRSpace
  03:25
• XRInputSource
  05:10
• Что вы узнали?
  3 вопросов

• Перемещение по окружающей среде
  06:22
• Взаимодействие с объектами в сцене
  06:58
• Использование GazeController
  03:23
• Обеспечение функциональности приложения на устройстве без XR
  04:02
• Что вы узнали?
  4 вопросов

• Использование AR для создания рулетки
  10:58
• Добавление динамической анимации к товару
  04:19
• Что вы узнали?
  2 вопросов

• Движение телепортацией
  06:22
• Взаимодействие с сетками
  05:49
• Предпросмотр08:59
• Что вы узнали?
  3 вопросов

• CanvasUI - часть 1
  06:17
• CanvasUI - часть 2
  03:37
• Использование CanvasUI для обучения
  08:52
• Что вы узнали?
  3 вопросов

• Примеры WebXR, статьи, видео и репозитории, чтобы вдохновить и проинформировать вас
  00:23
• Бонус за чтение
  00:44

Для кого этот курс:

• Всем, кто заинтересован в использовании новейшего API WebXR для создания возможностей виртуальной и дополненной реальности, которые работают в браузере без дополнительных требований к установке.

Скрытая ссылка