Введение
Раньше компьютеры и другая вычислительная техника были диковинкой в классах, но в наше время подобные устройства используются многими учителями.
Наибольший эффект это дает при обучении детей в младших классах. Им легче воспринимать информацию в виде мультфильма или же в виде игры, чем в виде текста и картинки.
Добавить элемент игры в процесс обучения позволяют технологии виртуальной и дополненной реальности:
Виртуальная реальность (Virtual reality, VR) - это полностью созданный компьютером мир, доступ к которому можно получить с помощью иммерсивных («погружающих») устройств - шлемов, перчаток, наушников.
Дополненная реальность (Augmented reality, AR) позволяет добавлять реальному миру дополнительные слои.
Чем же они отличаются друг от друга? VR блокирует реальный мир и погружает пользователя в цифровую вселенную, а AR внедряет элементы цифрового мира в реальный, как бы расширяя окружающий мир, дополняя его.
Технологии AR и VR позволяют оживить картины и скульптуры в музее, воспроизвести трейлеры к книгам, проиграть отрывки музыкальных произведений с дисков, анимировать химические процессы, показать структуру атома, подсказать, как использовать тот или иной инструмент или материал при обучении и в работе.
Моя работа посвящена изучению возможностей использования новых информационных технологий в образовании.
Гипотеза:
у учителей и школьников нет понимания, как эффективно использовать современные гаджеты в учебном процессе в школе;
считается, что VR и AR – это сложно и требует долгого обучения, а у учителя нет столько свободного времени и оборудования.
Цель работы: рассмотреть процесс создания приложений, использующих технологии дополненной или виртуальной реальности с минимальными затратами по времени и оборудованию.
Задачи, которые решаются в рамках работы:
рассмотреть подходы к созданию приложений VR и AR;
рассмотреть возможности по привязке объектов дополненной реальности;
рассмотреть виды моделей AR;
рассмотреть используемые программные средства и реализовать несколько примеров.
Объект исследования: приложения дополненной реальности.
Предмет исследования: технологии дополненной реальности.
В работе рассматривается процесс создания приложения с использованием технологий дополненной реальности, приводятся фрагменты кода программ.
Подходы к созданию приложений VR и AR
Можно выделить два основных подхода при создании приложений:
Разработка приложений без использования дополнительного внешнего оборудования, через которое осуществляется взаимодействие с созданной реальностью. Используется только то, что, в современном мире, доступно для большинства пользователей («есть у каждого»): смартфоны, планшеты.
Разработка приложений на специальном оборудовании с применением специальных программ. Подход предполагает использование специальных гарнитуры, блоков слежения, мощных графических редакторов и систем программирования, требующих постоянного подключения к ПК. Использование подобных приложений обычно возможно только в специально подготовленных для этого помещениях.
В обоих случаях, следует учитывать, что сделать только программу будет недостаточно для того, чтобы полноценно использовать возможности дополненной или виртуальной реальности. Для некоторых задач могут понадобиться очки, шлемы, чтобы что-то брать или перемещать – перчатки или костюмы. Но в большинстве случаев, для визуализации объектов и простого взаимодействия с ними, этого не требуется.
Чтобы добиться поставленной цели, будем пользоваться инструментами, которые не предполагают покупку специального оборудования, глубокого изучения сред и инструментов разработки. Таким образом, рассмотрим реализацию AR приложений, которые можно запустить на смартфоне (планшете).
Привязка объектов дополненной реальности
Есть несколько способов «добавить реальности к реальности»:
Поверх конкретного шаблона (метки). В данном случае создаваемые объекты отображаются поверх метки. Например, при наведении на название химического элемента, отображается его 3d модель.
На рабочую поверхность – создаваемый объект полностью накладывается на поверхность. Например - подбор платья или прически.
Объект, частично или полностью заменяющий исходное представление объекта дополненным представлением того же самого объекта. Например – визуализация внутренних органов человека или устройства какого либо механизма. В качестве объекта привязки (как и в предыдущем случае) используется контур объекта, на который накладываются виртуальные элементы.
В качестве метки (других элементов привязки) может выступать любой объект, однако использование QR-кодов более целесообразно, т.к. они получили широкое распространение в последнее время, большое количество сервисов и систем используют эти коды, пользователи привыкли к ним.
Способы создания моделей
Есть три основных вида 3D моделей:
Низкополигональные модели (low-poly). Предназначенs для экономии ресурсов, когда не требуется высокая детализация – надписи, подсказки, указатели.
Среднеполигональные модели (mid-poly). Используются при моделировании геометрии не требующей высокой детализации – например, макеты зданий, автомобили, мебель. Позволяют оценить, как дополнения вписываются в окружение.
Высокополигональные модели (high-poly). Представляют собой объекты с большим числом полигонов, слабо отличимые от реальных объектов. Дают возможность создать иллюзию присутствия объекта в окружении.
Модели можно создать самостоятельно используя, например, Autodesk 3ds Max, TinkerCAD, 3D Slash или приобрести в интернет магазинах (например, https://sketchfab.com). Многие дизайнеры выкладывают разработанные модели бесплатно (или условно-бесплатно) и можно найти подходящие модели практически любой тематики.
Программные средства
Но как сделать так чтобы модель отображалась в виртуальном окружении?
Есть разные инструменты, например:
ARKit, который сочетает цифровые и виртуальные объекты и информацию с окружающей средой.
Kudan, который лучше работает с пространственными отношениями объектов.
Wikitude, который позволяет легко добавлять медиафайлы в сцену дополненной реальности, такие как изображения и видео.
Самый простой из рассмотренных вариантов среда AR.js. Это открытый проект, код системы распространяется под лицензией MIT (лицензия свободного программного обеспечения). AR.js базируется на web технологиях, быстро запускается на любых системах, где есть браузер, даже старых, имеет.
Чтобы все заработало для AR.js на устройстве нужен только современный браузер и доступ в интернет для загрузки сцены и компонентов системы. Описание сцены представляет собой код с теговой разметкой, аналогичный HTML, и любой пользователь, имеющий базовые знания в использовании языка HTML, может достаточно быстро освоить особенности реализации программ для AR.
Для загрузки сцены необходимо перейти на определенную страницу сайта. При этом в качестве ссылок можно использовать специально сгенерированные QR-коды, содержащие необходимые ссылки.
Рассмотрим несколько примеров реализации:
Создание AR сцены с примитивными геометрическими объектами осуществляется следующим кодом (фрагмент кода HTML страницы):
<!-- Библиотеки, которые прорисовывают сцены. Скачиваются с сайта разработчиков -->
<script src="https://aframe.io/releases/1.4.2/aframe.min.js"></script>
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar.js"></script>
<script src="https://cdn.jsdelivr.net/gh/donmccurdy/[email protected]/dist/aframe-extras.min.js"></script>
<!-- создание сцены с маркером внутри -->
<a-scene embedded arjs>
<!-- создание собственного маркера по шаблону, url - где находится шаблон (в каталоге obj на сайте), все что за маркером - не отображается -->
<a-marker preset='custom' type='pattern' url='obj/marker.patt'>
<!-- создание примитивной сущности: зеленый куб, с учетом масштаба – параллелограмм, повернут по двум осям: y и z -->
<a-entity id="box" geometry="primitive: box" material="color: green" scale="3 1 2" rotation="0 45 45" ></a-entity>
<!-- создание примитивной сущности: синий куб, с учетом масштаба – квадрат, повернут по двум осям: y и z, сдвинут относительно центральной точки по двум осям -->
<a-entity id="box2" geometry="primitive: box" material="color: blue" scale="2 1 2" rotation="0 85 45" position="0 2 -5" ></a-entity>
<!-- создание примитивной сущности: красная сфера, повернута по двум осям: y и z, сдвинута относительно центральной точки по трем осям -->
<a-entity id="sphere" geometry="primitive: sphere" material="color: red" scale="1 1 1" rotation="0 85 45" position="-2 2 1" ></a-entity>
<!-- создание примитивной сущности: желтый тор, уменьшенный в масштабе в два раза, повернут по двум осям: y и z, сдвинут относительно центральной точки по трем осям -->
<a-entity id="torus" geometry="primitive: torus" material="color: yellow" scale="0.5 0.5 0.5" rotation="0 85 45" position="-4 1 4" ></a-entity>
<!--источник света, повышенной яркости, сдвинут относительно центральной точки по трем осям -->
<a-light type="point" intensity="2" position="2 4 4"></a-light>
<!-- конец маркера -->
</a-marker>
<!-- точкапросмотра -->
<a-entity id="camera" camera="zoom: 0.025"></a-entity>
<!-- конец сцены -->
</a-scene>
Рисунок 1 – AR сцена с примитивными геометрическими объектами (на смартфоне)
Создание AR сцены визуализации химического элемента. Рассмотрим процесс добавления дополнительных элементов на сцену: надписи и 3d модели химического элемента (молекулы бензола, C6H6). Используем код предыдущего примера, но в данном случае заменим теги создания примитивных объектов тегом загрузки модели:
<!-- надпись с пояснением, серого цвета, сдвинута в позиции по трем осям, изменена в размере -->
<a-text value="строениемолекулыбензола C6H6" color="#BBB" position="-0.9 0.2 -3" scale="1.5 1.5 1.5"></a-text>
<!-- 3D модель в gltf формате, объект уменьшен в размере, сдвинут по оси y -->
<a-entity position="0 0.5 0" scale="2 2 2" gltf-model="chemistry_benzene/scene.gltf"></a-entity>
Рисунок 2 – AR сцена (модель молекулы бензола, на смартфоне)
Создание AR сцены визуализации сложного, многополигонального статичного объекта (статуя В.С. Высоцкого). В данном случае заменим теги создания примитивных объектов тегом загрузки модели:
<!-- надпись с пояснением, серого цвета, сдвинута в позиции по 3м осям, изменена в размере -->
<a-text value="ВладимирВысоцкий" color="#BBB" position="-0.9 0.2 -3" scale="1.5 1.5 1.5"></a-text>
<!-- 3D модель в gltf формате, объект уменьшен в размере, сдвинут по оси y -->
<a-entity position="0 0.5 0" scale="0.3 0.3 0.3" gltf-model="monument_to_vladimir_visotskiy_close/scene.gltf"
></a-entity>
Рисунок 3 – AR сцена (многополигональный объект, на смартфоне)
Создание AR сцены с анимацией на примере модели солнечной системы. Включение анимации в модели осуществляется установкой атрибута тега - animation-mixer. В данном случае заменим теги создания примитивных объектов тегом загрузки модели:
<!-- 3D модель в gltf формате, солнечная система, уменьшенная в размере, сдвинута по оси y, принудительно установлено проигрывание анимации -->
<a-entity position="0 0.5 0" scale="0.1 0.1 0.1" gltf-model="solar_system/scene.gltf" animation-mixer></a-entity>
Рисунок 4 – AR сцена (анимированная модель, на смартфоне)
Если обратить внимание, то видно, что с точки зрения AR.js сложность модели (количество используемых полигонов, анимация) фактически не влияет на код создания сцены.
Заключение
В целом технологии дополненной реальности сейчас доступны для использования, существует множество инструментов. Основную сложность составляет поиск или разработка сценариев ее применения, подходящих 3D моделей.
Проделанная работа наглядно продемонстрировала возможность реализации подобных проектов и их простоту. При реализации не требуется создавать сразу полностью законченный проект, он может развиваться постепенно в виде сайта и дополняться элементами дополненной реальности. А тут уже многое зависит от учителя.
Список использованных источников и литературы
AR.js - Augmented Reality on the Web [Электронный ресурс] // ar-js-org.github.io. URL: https://ar-js-org.github.io/AR.js-Docs/ (дата обращения: 15.02.2024)
The leading platform for 3D & AR on the web // sketchfab.com. URL: https://sketchfab.com/3d-models/ (датаобращения: 15.02.2024)