Превращение прототипа Figma в РЕАЛЬНЫЙ веб-сайт

✔︎ Университет Framer: https://frameruni.link/yt
✔︎ Создайте бесплатный аккаунт Framer: https://framer.university/free-account

В этом видео вы увидите, как я воплощаю в жизнь прототип 3D-карточки Себа Корнелиуса, воссоздавая его в одном из самых известных в мире конструкторов сайтов: Framer. Вы увидите, как я шаг за шагом создаю компонент и выводю его на новый уровень с помощью красивого эффекта наведения курсора. Если вы хотите изучить анимацию и интерактивные элементы Framer, это видео вам очень поможет.

→ Переделать проект из обучающего видео: https://framer.link/g2xkjIC

00:00 - Введение и предварительный просмотр финального взаимодействия
03:30 - Почему этот эффект обычно создается в Figma
07:00 - Почему Framer может воссоздать его без кода
10:30 - Визуальный разбор 3D-карточки при наведении курсора
14:30 - Настройка проекта и структура базовой карточки

18:17 - Начало создания: поверхность карточки и тень
22:00 - Создание шахматного узора теней
25:30 - Слои, стеки и управление Z-индексом
28:30 - Добавление угловой типографики и декораций
31:30 - Создание центрального круга и слоев глубины
35:00 - Подготовка карточки к 3D-анимации при наведении курсора
37:30 - Создание варианта при наведении курсора и 3D-вращения
39:30 - Финальная настройка анимации Публикации

Подписывайтесь на меня:
X:   / learnframer  
Instagram:   / framer.university