WebXR Development
Части пространственных веб-приложений
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 моделирование — не ваш конек, вы можете нанять 3D художника на ArtStation.
Оптимизация
Все ассеты пространственного веб-приложения передаются через интернет. Это может влиять на время загрузки, что делает важным сжатие и оптимизацию ассетов.
Код
Код для пространственных веб-приложений может быть написан на TypeScript, JavaScript, C++, Rust и многих других языках. JavaScript выполняется непосредственно, тогда как такие языки, как C++, компилируются в WebAssembly.
Код имеет множество функций в пространственном веб-приложении:
- Рендеринг: Создание изображений, которые отображаются на смартфоне или устройстве VR. Компьютерная графика — это сложная область информатики. Чтобы с ней справляться, разработчики WebXR используют фреймворки для рендеринга, которые берут на себя выполнение общих задач.
- Загрузка ассетов: Загрузка любых 3D моделей, текстур, аудио, видео и других данных по мере необходимости. Фреймворки обычно предоставляют функциональность для чтения данных из различных 3D форматов файлов, а в вебе браузер может позаботиться о загрузке изображений и аудиофайлов за вас.
- Взаимодействие с пользователем: Реакция на ввод данных пользователем, предоставление обратной связи и выполнение действий в ответ на действия пользователя.
- Логика приложения: Вычисления, обработка и взаимодействие данных, которые приложение должно выполнять, от выполнения запросов к базам данных до генерации данных.
Библиотеки, фреймворки и 3D движки, такие как Wonderland Engine, помогают во всех этих задачах и предоставляют часто используемую функциональность, позволяя разработчикам пространственных веб-приложений создавать их приложения более эффективно.
Веб-сервисы
Приложение может взаимодействовать с онлайн-сервисами для учетных записей, хранения индивидуальной информации, выполнения запросов к большим базам данных, потоковой передачи медиа и многое другое.