Добавляем настоящую глубину 3D-карточке в стиле Pokemon (параллакс в Rive)

Та же 3D-карточка из предыдущего урока, теперь с настоящей глубиной: восемь плоских слоев, параллаксный шейдер, снег спереди и сзади, а также текст, обновляющийся в реальном времени. Создана в Rive с помощью Claude поверх MCP, без использования 3D-программ. В предыдущем видео мы создали 3D-карточку в стиле Pokemon в Rive из одного изображения. На этот раз карточка становится окном: небо, деревья, Снежок, рамка и ветка находятся на своей глубине, и при наклоне карточки они скользят на разные величины. В этом весь секрет, и для его реализации требуется несколько подсказок. Что вы узнаете: • Как работает параллаксная глубина: объект за окном движется сильнее, объект перед ним — в противоположную сторону • Разделение изображения на карточке на слои и размер каждого слоя • Запрос у агента многослойной карточки: сначала три слоя, затем остальные • Снег как действующий слой Node Script, перед и за персонажем • Реальный текст Rive на карточке, привязанный к ViewModel, благодаря чему карточка обновляется во время выполнения • Почему карточка становится пустой после редактирования скрипта и как это исправить Шаблон файла + 3 запроса, бесплатно: https://www.rivemasterclass.com/free-... Письменная версия этого урока: https://www.rivemasterclass.com/blog/... Предыдущий урок, где мы создаем саму карточку:    • Build a 3D Pokemon Style Card in Rive (wit...   Письменная версия первой карточки: https://www.rivemasterclass.com/blog/... Главы 0:00 Восемь слоев и окно 0:18 Как работает параллаксная глубина 0:42 Под капотом: шейдер GPU, скрипт Node, Клод над MCP 1:18 Исходный файл: слои в Figma 1:49 Слои снега, небольшой скрипт Node 2:14 Первая подсказка: три слоя 3:33 Соединение слоев в Rive 4:18 Почему ничего не движется: глубина равна нулю 4:43 Игра со значениями глубины 5:24 Отверстие на краю и исправление размера 6:26 Работа со слоями с помощью ИИ 7:19 Добавление оставшихся слоев 8:38 Слой перед картой 9:39 Живой текст со своей собственной глубиной 11:23 Результат: изменение карты во время выполнения 11:53 Конечный результат 12:12 Что мы Узнал ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Меня зовут Том. Я создаю мастер-класс по Rive, где мы разрабатываем полноценное приложение погоды в Rive с использованием четырех персонажей, которых вы здесь видели, начиная с первой фигуры и заканчивая конечными автоматами, интерактивностью и привязкой данных. А также курс по Rive Scripting, где мы создаем космическую стрелялку с агентом ИИ, слой за слоем, точно так же, как мы создали эту карточку. Мастер-класс по Rive: https://www.rivemasterclass.com Курс по Rive Scripting: https://www.rivemasterclass.com/rive-... ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ LinkedIn:   / tomacco   X: https://x.com/tomacco #Rive #RiveApp #Parallax #3DCard #MotionDesign #InteractiveDesign #UIAnimation #ProductDesign #GPUCanvas #DataBinding #DesignTools #AIAnimation