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

Name: Научитесь создавать WebXR, VR и AR опыт, используя Three.JS
Price: 861 RUB
Availability: PreOrder

2 участника

О чём курс

Технологии WebXR API и библиотека Three.js позволяют создавать проекты виртуальной и дополненной реальности прямо в браузере. В материалах автор показывает, как объединить сенсоры мобильных устройств и возможности WebGL для визуализации 3D-контента на смартфонах и VR-гарнитурах без установки сторонних приложений.

Что внутри

Материал охватывает базовые концепции 3D-графики, настройку среды разработки и интеграцию сложных ресурсов: автор показывает поиск моделей, экспорт из Blender и настройку анимаций через Mixamo. Рассматриваются ключевые компоненты WebXR API, отвечающие за сессии, пространства и источники ввода.

Практическая часть включает создание архитектурного обхода, демонстрацию товаров в реальном интерьере с помощью AR, реализацию пользовательского интерфейса CanvasUI и обучение. Также детально разбираются игровые механики: жестовое управление, работа с контроллерами и телепортация.

Для кого

Курс предназначен для разработчиков, желающих освоить создание VR- и AR-приложений для браузера. Для успешного прохождения необходимо уверенное знание языка JavaScript; предварительного опыта работы с 3D-графикой не требуется.

Формат и инструменты

Программа содержит 44 лекции общей длительностью 4 часа 40 минут. Видеоматериалы записаны на английском языке и сопровождаются русскими и английскими автосубтитрами. Каждое практическое задание снабжено исходным кодом в двух вариантах: заготовка для самостоятельной практики и готовое решение.

Для работы используется бесплатный редактор кода Brackets, а также платформа GitHub для размещения проектов на защищенном сервере и последующего тестирования на гарнитурах вроде Oculus Quest.

Об авторе

Автор обучающего курса — Николас Левер.

Программа обучения

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

Предпросмотр 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

Складчина создана 7 октября 2020 г. · описание обновлено 18 октября 2026 г.

Теги курса

Отзывов пока нет. Будьте первым!

Как получить курс?

Влада Администратор сайта

Этот курс сейчас в процессе организации складчины. Нажмите кнопку «Записаться» и ожидайте старта — вам придёт уведомление. Когда складчина стартует, в карточке курса будет указан актуальный взнос. Текущая цена пока в процессе формирования и может отличаться от финальной.

Финальный взнос будет ниже, чем 999 ₽?

Влада Администратор сайта

Да, мы стремимся, чтобы финальный взнос был не больше ≈10% от оригинальной цены курса. Чем больше участников записывается в складчину, тем ниже выходит взнос для каждого.

Как я могу ускорить сбор складчины и уменьшить взнос?

Влада Администратор сайта

Нажмите кнопку «Записаться» и авторизуйтесь на сайте через email (через ту же почту, которую будете использовать для входа). В личном кабинете вас будут ждать инструкции, как пригласить других участников — чем больше людей записалось, тем быстрее стартует складчина и тем ниже взнос. Как только складчина готова к приобретению, вам придёт уведомление.