Разработка AR-обучающего контента в мобильном приложении

Разработка AR-обучающего контента в мобильном приложении

Анатомия, молекулярные модели, исторические реконструкции, схемы оборудования — образовательный AR работает, когда объект можно рассмотреть со всех сторон, разобрать на части, запустить анимацию и получить интерактивную подпись. Пассивный просмотр 3D-модели без взаимодействия — это не обучение, это красивый скринсейвер.

Задача сложнее, чем кажется: нужно совместить AR-технологии с педагогической логикой, сценариями взаимодействия и требованиями к доступности.

Архитектура обучающего AR-приложения

Типичная структура: курсы → уроки → AR-активность. Каждая AR-активность — отдельный сценарий с собственным набором 3D-ресурсов, скриптом анимации и точками взаимодействия (hotspots).

Hotspot — это аннотация в 3D-пространстве. Маркер на молекуле углерода открывает карточку «Атом углерода: 6 протонов, 6 нейтронов». Реализация через BillboardComponent в RealityKit — маркер всегда повёрнут к камере:

var billboard = BillboardComponent()
hotspotEntity.components[BillboardComponent.self] = billboard

Позиция hotspot — в локальных координатах 3D-модели. При анимации (разборка модели) hotspot двигается вместе с частью, к которой привязан. Для этого hotspot делаем дочерней entity относительно соответствующей части модели.

Интерактивная разборка 3D-модели

Самая востребованная механика в образовательном AR — «взрыв» модели: части расходятся в стороны, обнажая внутреннюю структуру. Двигатель, сердце, атом.

Реализация через AnimationPlaybackController и FromToByAnimation в RealityKit:

let explodeAnimation = FromToByAnimation<Transform>(
    from: Transform(translation: [0, 0, 0]),
    to: Transform(translation: [0.1, 0, 0]),
    duration: 0.8,
    timing: .easeInOut,
    isAdditive: false,
    bindTarget: .transform
)
let resource = try? AnimationResource.generate(with: explodeAnimation)
pistonEntity.playAnimation(resource, transitionDuration: 0.2)

Для сложных моделей с 50+ частями — анимации пакуются в USDZ с помощью USD Python API на этапе подготовки контента, а не генерируются в рантайме.

Главная техническая проблема: размер контента

Образовательные 3D-модели детализированные. Анатомическая модель тела — 200–500 МБ в исходнике. После оптимизации для мобильного AR — 20–50 МБ. Загружать при старте урока — пользователь ждёт 30 секунд, закрывает приложение.

Решение: progressive loading + on-demand download. Базовое приложение содержит LOD-1 версии всех моделей (2–5 МБ каждая). При входе в AR-активность — фоновая загрузка LOD-0 (детализированной версии). Пока идёт загрузка — работаем с упрощённой. URLSession.downloadTask + локальный кэш через FileManager:

let cachesURL = FileManager.default.urls(for: .cachesDirectory, in: .userDomainMask).first!
let modelURL = cachesURL.appendingPathComponent("\(modelId)_lod0.usdz")
// Проверяем кэш → если нет → скачиваем → уведомляем AR-сцену

Контент-сервер отдаёт модели через CDN, разбитые по урокам — не весь курс разом.

Обратная связь и оценка знаний в AR

Образовательное приложение без проверки знаний — это просто 3D-атлас. Интерактивные задания в AR:

• Drag-and-drop: перетащи орган в правильное место тела
• Последовательность: собери двигатель в правильном порядке частей
• Поиск: найди и tap на нужную структуру молекулы

Drag-and-drop в AR — нетривиально. EntityTranslationGestureRecognizer в RealityKit даёт перетаскивание по поверхности. Но нужна snap-зона: когда пользователь отпускает орган рядом с правильной позицией — он «защёлкивается». Реализуется через CollisionComponent с trigger shape у зоны назначения и onCollisionBegan event.

Кейс

Приложение для изучения молекулярной химии, школьный сегмент 8–10 класс. 50 молекул, каждая с разборкой на атомы и анимацией образования химических связей. Ключевое требование: работа в условиях классной комнаты — плохое освещение, нетекстурированные парты (ARKit плохо определяет плоскости). Решили через image marker (распечатанный лист A4 с маркером на каждой парте) — ARImageTrackingConfiguration стабильнее, чем plane detection в сложных условиях. Маркеры выдавались учителям вместе с распечаткой QR-кода для скачивания.

Сроки

Стоимость рассчитывается индивидуально после анализа педагогических сценариев и требований к контенту.