Шаблон AR-вітрини

#Що це

Готова сторінка з веб-компонентом model-viewer. Ви підставляєте власну GLB-модель, публікуєте сторінку — і вона обертається в браузері, а на телефоні одним дотиком відкривається в доповненій реальності. Ту саму заготовку ми використаємо для портфоліо-сторінки в блоці 9.

#Як користуватися

1. Завантажте шаблон і покладіть свій файл поруч із ним під назвою model.glb (або змініть src="…" у коді на свою назву).
2. Замініть підпис у alt="…": коротко опишіть модель для тих, хто не бачить зображення.
3. Замініть заготовки «Назва проєкту» й опису під в’юпортом на свої: що це за проєкт, яка найскладніша частина, чого ви навчилися.
4. Опублікуйте сторінку (наприклад, на GitHub Pages). На локальному файлі кнопка AR не спрацює: потрібне справжнє посилання https://….
5. Зробіть QR-код на опубліковану адресу й відскануйте його телефоном.

#Мінімальний код

Усе, що потрібно для перегляду й AR, — кілька рядків HTML:

<script type="module" src="https://cdn.jsdelivr.net/npm/@google/model-viewer/dist/model-viewer.min.js"></script>

<model-viewer
  src="model.glb"
  alt="Короткий опис моделі"
  camera-controls
  auto-rotate
  ar
  ar-modes="webxr scene-viewer quick-look"
  shadow-intensity="1">
</model-viewer>

Шаблон уже містить цей код, оформлення й демо-модель, тож сторінка працює одразу — ще до того, як ви підставите свою.

#Перед публікацією