Создайте бесконечную 3D-галерею с помощью Three.js и VIVERSE
Автор: Wawa Sensei
Загружено: 2025-10-31
Просмотров: 2609
Описание:
Узнайте, как создать совместную 3D-фотобудку, где пользователи смогут создавать и делиться фотографиями аватаров в бесконечной галерее! В этом руководстве мы будем использовать React Three Fiber и развёртывать приложение с помощью бесплатной платформы VIVERSE.
Что вы научитесь:
Создавать интерактивную 3D-галерею с помощью React Three Fiber
Реализовать настраиваемые аватары с позами и аксессуарами
Создавать фотобудку с фонами и реквизитом
Использовать VIVERSE SDK для аутентификации, физики, аватаров и функций таблицы лидеров
Развёртывать 3D-веб-приложение на VIVERSE с помощью CLI
Создавать совместные функции со встроенной физикой и таблицами лидеров
🚀 Платформа VIVERSE (спонсор):
VIVERSE предоставляет бесплатную платформу для публикации интерактивных 3D-веб-приложений без необходимости контроля доступа. Их библиотека pmndrs/viverse обеспечивает мгновенный доступ к аутентификации, аватарам, физике и другим функциям как для простых проектов Three.js, так и для проектов React Three Fiber.
🎮 Финальная демоверсия: https://worlds.viverse.com/UxpTMPd
📦 Исходный код: https://github.com/wass08/r3f-wawa-ph...
🔗 Стартовый код: https://github.com/wass08/r3f-vite-st...
🚀 Изучите React Three Fiber с помощью полного руководства по 3D-разработке веб-приложений ✨
https://wawasensei.dev/courses/react-...
#threejs #js #viverse
▬▬▬▬▬▬ 📚 РЕСУРСЫ ▬▬▬▬▬▬
VIVERSE SDK
https://pmndrs.github.io/viverse/gett...
Студия VIVERSE
https://studio.viverse.com/
Платформа VIVERSE
https://www.viverse.com/
PocketBase
https://pocketbase.io/
Список VRM Bones
https://pixiv.github.io/three-vrm/doc...
Threejs
https://threejs.org/
React Three Fiber
https://r3f.docs.pmnd.rs/getting-star...
▬▬▬▬▬▬ Поддержите канал 🙏 ▬▬▬▬▬▬
Станьте участником, чтобы получить доступ к потрясающим Бонусы:
/ @wawasensei
▬▬▬▬▬▬ Присоединяйтесь ко мне 👋 ▬▬▬▬▬▬
💻 Сообщество Discord
/ discord
📸 Instagram:
/ wawa.sensei
🎎 Facebook:
/ wawasenseiyt
🐦 Twitter:
/ wawasensei
🐦 TikTok:
/ wawasensei08
▬▬▬▬▬▬ ВРЕМЯ P S ⏰ ▬▬▬▬▬▬
00:00 Введение
01:15 Старт проекта
01:43 VIVERSE SDK
03:45 Публикация в VIVERSE
05:47 Создание и выбор аватара
10:48 Кнопка входа
12:16 Система бесконечных сеток
17:36 Хранилище фотографий Pocketbase
21:24 Создание и сохранение фотографий
26:28 Галерея
28:12 Материалы для изображений
32:34 Коллайдеры кадров
37:13 Фотобудка
41:10 Пользовательские позы анимации
43:48 Прикрепление предметов к костям
47:26 Таблица лидеров
51:53 Дальнейшие действия
52:58 Заключение
Повторяем попытку...
Доступные форматы для скачивания:
Скачать видео
-
Информация по загрузке: