Разработка WebXR
Элементы пространственных веб-приложений
XR/пространственные приложения — это набор файлов, которые обычно передаются через веб-сервер. Веб-браузер может интерпретировать эти файлы и запускать веб-приложение.
Обычные файлы
Наиболее важные файлы и расширения файлов указаны ниже:
| Расширение | Описание |
|---|---|
| index.html | Главная HTML-страница пространственного веб-приложения. |
| .js | Содержит код на JavaScript. |
| .ts | Содержит код на TypeScript, который перед публикацией преобразуется в .js. |
| .wasm | WebAssembly (синтезируется из таких языков, как C++ или Rust). |
| .glb | Формат файла 3D модели, который может даже включать текстуры. |
| .gltf | Текстовый формат файла 3D модели. |
| .bin | Обычно используется вместе с .gltf и содержит бинарные данные 3D модели. |
| .obj | Простой текстовый формат файла модели. |
| .mtl | Файл материала, обычно используемый с файлом .obj. |
| .json | Произвольные данные, используемые приложением. |
| .css | “Каскадная таблица стилей”, используемая для изменения внешнего вида HTML-элементов. |
Кроме того, пространственное веб-приложение будет использовать аудиофайлы (.mp3, .wav, .ogg и другие), файлы изображений (.webp, .png, .jpg) и иногда даже видеофайлы (.webm, .mp4, .mov).
3D модели
Приложения для VR и AR могут представлять собой как полностью иммерсивные среды, так и простые плавающие панели пользовательского интерфейса. В большинстве случаев вам понадобятся хотя бы несколько 3D моделей, или, как их ещё называют, “ассеты”.
Платформы
Множество бесплатных и платных ассетов можно найти на платформах, таких как Sketchfab, TurboSquid и itch.io.
Есть также совершенно бесплатные источники 3D моделей, такие как Quaternius, Kenney.nl и Poly Haven.
Часто можно использовать пакеты ассетов из Unity или Unreal Engine.
3D сканирование
Процесс преобразования фотографий реальных объектов в 3D модели называется “фотограмметрия” или 3D сканирование.
Программы, такие как RealityScan для вашего смартфона или программное обеспечение, как Reality Capture, могут помочь вам добавить реальные модели в ваши пространственные веб-приложения.
Создание
Создание 3D моделей вручную может занять много времени. 3D моделисты используют программы, такие как Blender или Maya, для создания моделей, сделанных под ваш запрос.
Если создание 3D моделей — не ваша сильная сторона, вы можете нанять 3D художника на ArtStation.
Оптимизация
Все ассеты пространственного веб-приложения передаются через интернет, что может сказаться на времени загрузки. Поэтому важно, чтобы ассеты были сжаты и оптимизированы.
Код
Код для пространственных веб-приложений может быть написан на TypeScript, JavaScript, C++, Rust и многих других языках. JavaScript выполняется непосредственно в браузере, тогда как такие языки, как C++, компилируются в WebAssembly.
Код выполняет множество функций в пространственном веб-приложении:
- Рендеринг: Генерация изображений, отображаемых на смартфоне или устройстве VR. Компьютерная графика — это сложная область информатики. Для её освоения разработчики WebXR используют рендеринг-фреймворки, которые берут на себя выполнение общих задач.
- Загрузка ассетов: Загрузка необходимых 3D моделей, текстур, аудио, видео и других данных. Фреймворки обычно предоставляют необходимые функции для чтения данных из различных форматов 3D файлов, а в интернете браузер может сам загружать изображения и аудио форматы для вас.
- Взаимодействие с пользователем: Реагирование на ввод пользователя, предоставление обратной связи и выполнение действий в ответ на действия пользователя.
- Логика приложения: Вычисления, обработка и взаимодействие с данными, которые приложение выполняет, например, запросы к базам данных и генерация данных.
Библиотеки, фреймворки и 3D движки, такие как Wonderland Engine, помогают с решением этих задач и предлагают часто используемую функциональность, позволяя разработчикам пространственных веб-приложений создавать их приложения более эффективно.
Веб-сервисы
Приложение может взаимодействовать с онлайн-сервисами для работы с учетными записями, хранения личной информации, выполнения запросов к большим базам данных, потокового воспроизведения медиа и многого другого.