Перейти к содержимому

Создание 3D-слайдера книг для лендинга на Three.js и React

Wawa Sensei

0:00 / 0:00

Создание 3D-слайдера книг для лендинга на Three.js и React

73 421 просмотр · 2 года назад
Wawa Sensei
34,4 тыс. подписчиков
73 421 просмотр · 2 года назад
Узнайте, как создать потрясающую целевую страницу с 3D-слайдером книг с помощью Three.js и React Three Fiber 🚀 Изучите React Three Fiber с помощью моего полного курса ✨ https://lessons.wawasensei.dev/course... Демонстрация в реальном времени 🏖️ https://r3f-animated-book-slider-fina... Стартовый пакет 🔗 https://github.com/wass08/r3f-animate... Финальный код 🔗 https://github.com/wass08/r3f-animate... #threejs #webdevelopment #reactthreefiber ▬▬▬▬▬▬ Полезные ссылки 🔗 ▬▬▬▬▬▬ Сжатие текстур Squoosh https://squoosh.app/ Геометрия Box https://threejs.org/docs/#api/en/geom... Аккумуляторная сетка (Skinned Mesh) https://threejs.org/docs/?q=skinn#api... GraphToy https://graphtoy.com/ ▬▬▬▬▬▬ Поддержите канал 🙏 ▬▬▬▬▬▬ Станьте участником, чтобы получить доступ к потрясающим бонусам:    / @wawasensei   ▬▬▬▬▬▬ Свяжитесь со мной 👋 ▬▬▬▬▬▬ 💻 Сообщество Discord   / discord   📸 Instagram:   / wawa.sensei   🎎 Facebook:   / wawasenseit   🐦 Twitter:   / wawasensei   🐦 TikTok:   / wawasensei08   ▬▬▬▬▬▬ ВРЕМЕННЫЕ МЕТКИ ⏰ ▬▬▬▬▬▬ 00:00 - Вступление 01:00 - Стартовый набор 02:03 - Книга 05:30 - BoxGeometry 08:11 - SkinnedMesh 17:44 - Текстуры 20:55 - Начальное состояние 22:22 - Переходы между страницами 32:44 - Анимация сгибания 36:50 - Задержка между страницами 38:57 - PointerEvents 41:35 - Финальный штрих 43:02 - Спасибо!