Figma Config 2026 — Анимация с помощью нового инструмента Figma Motion
На конференции Figma Config 2026 разработчики представили функционал, который ждали все ui/ux дизайнеры — встроенный инструмент для анимации Figma Motion. Обучение Figmaс нуля — https://cloudlessons.ru/c/27057 Теперь веб-дизайн и комплексная анимация в фигма выходят на совершенно новый уровень. Больше не нужно экспортировать слои в сторонние сервисы вроде After Effects, Gitter или Principle, чтобы создать анимацию прототипа. Всё делается нативно, быстро и внутри одной рабочей среды. В этом видео мы подробно разберем, как устроен новый моушн-режим в Figma, и протестируем его, включая ИИ-инструменты. Что в уроке: Знакомство с интерфейсом и таймлайном: Как переключить Figma в режим Motion, как устроена шкала времени и почему этот функционал фундаментально меняет современный веб дизайн. Ключевые кадры (Keyframes) и автоматическая анимация: Пошагово разберем, как анимировать позицию, масштаб (Scale), прозрачность (Opacity), размеры и цвет объектов. Настроим режим Toggle Auto Keyframing для автоматической расстановки ключей при перемещении элементов. Режимы воспроизведения таймлайна: В чем разница между Loop (петля) и Pin-pong и как управлять характером цикличного движения. Тайм-коды и комментарии: Фишка для командной работы — учимся оставлять правки прямо на таймлайне с жесткой привязкой к конкретному кадру Продвинутая работа с графиками скорости (Easings): Уходим от линейного движения. Настраиваем физически корректный и реалистичный отскок объектов с помощью кривых скорости. Переменные (Variables) и компоненты в Motion: Как создавать переменные для таймингов и изингов, тестировать разные варианты отображения без переделки сцены, а также делать красивое каскадное появление элементов (Stagger) для таблиц и списков через мастер-компоненты. AI Агенты в Figma: Тестируем генерацию анимации по текстовому промту (пока функция находится в бете — это полностью бесплатно). Разбираемся, стоит ли отдавать рутину искусственному интеллекту? Экспорт готового результата: Как правильно выбрать фрейм для рендера и сохранить анимацию в форматы MP4, WebM, GIF или SVG в высоком качестве. #figma #ui #вебдизайн
На конференции Figma Config 2026 разработчики представили функционал, который ждали все ui/ux дизайнеры — встроенный инструмент для анимации Figma Motion. Обучение Figmaс нуля — https://cloudlessons.ru/c/27057 Теперь веб-дизайн и комплексная анимация в фигма выходят на совершенно новый уровень. Больше не нужно экспортировать слои в сторонние сервисы вроде After Effects, Gitter или Principle, чтобы создать анимацию прототипа. Всё делается нативно, быстро и внутри одной рабочей среды. В этом видео мы подробно разберем, как устроен новый моушн-режим в Figma, и протестируем его, включая ИИ-инструменты. Что в уроке: Знакомство с интерфейсом и таймлайном: Как переключить Figma в режим Motion, как устроена шкала времени и почему этот функционал фундаментально меняет современный веб дизайн. Ключевые кадры (Keyframes) и автоматическая анимация: Пошагово разберем, как анимировать позицию, масштаб (Scale), прозрачность (Opacity), размеры и цвет объектов. Настроим режим Toggle Auto Keyframing для автоматической расстановки ключей при перемещении элементов. Режимы воспроизведения таймлайна: В чем разница между Loop (петля) и Pin-pong и как управлять характером цикличного движения. Тайм-коды и комментарии: Фишка для командной работы — учимся оставлять правки прямо на таймлайне с жесткой привязкой к конкретному кадру Продвинутая работа с графиками скорости (Easings): Уходим от линейного движения. Настраиваем физически корректный и реалистичный отскок объектов с помощью кривых скорости. Переменные (Variables) и компоненты в Motion: Как создавать переменные для таймингов и изингов, тестировать разные варианты отображения без переделки сцены, а также делать красивое каскадное появление элементов (Stagger) для таблиц и списков через мастер-компоненты. AI Агенты в Figma: Тестируем генерацию анимации по текстовому промту (пока функция находится в бете — это полностью бесплатно). Разбираемся, стоит ли отдавать рутину искусственному интеллекту? Экспорт готового результата: Как правильно выбрать фрейм для рендера и сохранить анимацию в форматы MP4, WebM, GIF или SVG в высоком качестве. #figma #ui #вебдизайн