Некоторые микро анимации можно сделать в Figma, например, анимации для включения/выключения кнопки в интерфейсе.
Я недавно устроилась на новую работу UX/UI дизайнером и столкулась с тем, что нужно иногда делать анимации для всяких кнопочек и некоторых экранов.
Раньше я делала анимашки в After Effects, но я все время забываю как там начать, а дизайнер до меня делала анимации в Lottie. Несколько вариантов я тоже попробовала там сделать, lottie довольно интуитивный, но то, что я хотела сделать там прям никак у меня не получалось.
И я смогла сделать нужную мне анимацию прямо в Figma, вот только проблема... Ни по умолчанию, ни в комьюнити там не оказалось функции экспорта в формат JSON...
И я начала искать возмозможности это сделать.
Я нашла сторонний плагин, через какой-то очень старый зарубежный видос. На сайте даже есть инструкция как его установить, но под последние обновления Figma это так уже не работает...
Везде я находила ролики только «как добавить плагин», где просто показывали как добавить плагины из комьюнити, а мне нужно было загрузить свой скачанный в фигму!
Рассказываю, если вдруг кто-то тоже хочет выгружать анимашки из Figma в JSON.
Во-первых, сам плагин можно скачать по ссылке:
Там сначала нужно залогиниться, и потом будет возможность скачать.
Чтобы добавить сторонний плагин в Figma, нужно зайти в панель инструментов -> Plugins & widgets -> + New Plugin...
Далее выбираем настройки, название папки и путь папки, в которую мы будем потом переносить файлы нашего плагина.
Плагин отобразился в панели инструментом с названием, которое мы ему дали.
Figma создала нам новую папку, с нашим названием, в которую теперь нужно перенести в файлы из папки, которую мы скачали на сайте. Файлы перемещаем с заменой.
Да, запутанная схема, вопросы к разработчикам фигмы, я сама долго разбиралась)))
Теперь наш плагин отобразился со своим названием и мы можем его использовать 🥳
Открываем плагин, выделяем нашу анимацию и экспортируем в JSON!
Теперь можно передать файлы json разработчикам и они добавят в приложение нужную анимашку :)
Надеюсь кому-то кроме меня это было тоже нужно)))
👀 Мой телеграм-блог: https://t.me/design_skh
