#урок_от_Alice

Вчера вдохновилась графикой из интерфейса, а сегодня решила поделиться с вами, как создать такую папку и анимировать её 📂

Шаг 1.
Создаём с помощью Rectangle основу для папки.

Шаг 2.
Создаём «документы» с помощью фигур. Я использовала всё тот же Rectangle в разных его видах)

Шаг 3.
Создаём переднюю часть папки.

Для этого я создаю прямоугольник → перехожу в режим редактирования векторов → расширяю его за две верхние точки → верхние углы скругляю меньше, чем нижнее

Добавляю эффект размытия фона.

Шаг 4.
Создаю компонент и делаю ему 3 разных варианта, где меняю положение документов и опускаю переднюю часть папки.

Шаг 5.
Добавляем анимацию между всеми тремя.

Если вы хотите, чтобы папка возвращалась в исходное состояние, то добавьте ещё между «3» и «1» анимацию «Mouse leave»

Готово, можно классно интегрировать в свой проект ✨

✏️ С самого утра увидела интересную новость от Figma. Новая функция Vectorize!

Представьте, что любое изображение можно превратить в вектор. Не в теории, а прямо в Figma без сторонних инструментов. С новой функцией Vectorize теперь возможно взять PNG или JPG и за пару кликов получить полностью редактируемый вектор😍

Что можно делать с Vectorize:
🟡Конвертировать растровые изображения в редактируемые векторы;
🟡 Упрощать и настраивать цветовую палитру результата.

Функция уже доступна для платных планов в Figma Design и Figma Draw. Очень похоже на ту самую «маленькую фичу», которая быстро станет must-have.