Анимация появления элементов в Figma
В этом уроке мы научимся создавать анимацию появления элементов, используя только функции Figma.
Шаг 1
- Создаём новый фрейм.
- Добавляем элементы дизайна, которые будем анимировать.
Шаг 2
- Оборачиваем каждый элемент во фрейм (Ctrl+Alt+G).
- Поставьте галочку Clip content.
Шаг 3
- Дублируем фрейм.
- Прячем текст за границы фрейма (вниз).
- Хедер выносим за границы общего фрейма.
Шаг 4
- Дублируем фрейм.
- Прячем изображения за границы фрейма (вверх).
Шаг 5
- Дублируем фрейм.
- Уменьшаем линии до 1 px.
Шаг 6
Связываем фреймы:
- After delay — 1ms
- Smart animate
- Ease out — 1000ms.
Готово!
Необычная анимация появления элементов готова.
Рекомендуем ознакомиться:
Как сделать вылеты в Illustrator
Вылеты под обрезку необходимо проставлять перед передачей макета на печать. В этом уроке мы расскажем, как создать вылеты в Adobe Illustrator.
Пожалуйста, поделись этим материалом!
Мы потратили много часов на его создание, а тебе нужно всего 10 секунд, чтобы поделиться им!
