Figma провела свою ежегодную конфу, где показала продуктовые новинки, которые восприняли мягко говоря прохладно, а в переводе на человеческий — закидали хуями, начали хоронить и окрестили новым Adobe.

Чтобы не засорять эфир в день Х, я решил сначала потестить Figma Motion сам, чтобы водолазку надевать не пришлось, а не как в интернете обычно принято.

Пробежимся по плюсам
- Интерфейс очень простой. Если ты хоть раз в жизни работал с любым линейным редактором, в котором есть работа с ключами, считай ты уже всё знаешь.
- Есть быстрые пресеты на position, scale, rotation, opacity и trim path
- Эффекты из пресетов стакаются друг на друга
- Свойства можно уводить в цикл без всяких костылей с экспрешенами
- Есть удобный гизмо на трансформации — подсмотрели в современном 3D-софте, не иначе
- Есть автоматическая запись ключей, тоже уверен в 3D-софте подсмотрели
- Можно менять расположение анкор поинта (круто, а можно в design mode то же самое, пажалста? Уже хз сколько лет просим, ждём и надеемся)
- Блюр и uniform и progressive можно анимировать
- Можно AI-агентом генерить шейдеры прямо в режиме Motion
- Все эффекты и «ручки» шейдеров (добавить которые агент тебя любезно спрашивает при генерации) можно анимировать
- Маски можно анимировать, но именно на уровне всего шейпа — отдельные точки анимировать нельзя
- Добавили моушн токены в variables. Это очень здорово для дизайн-системности анимаций твоего продукта, если ты серьёзно работаешь с анимациями, а не просто перделки прикручиваешь

Теперь добавим пару ложек говна
- Нельзя анимировать градиенты (пока только плоские цвета, при этом тени анимировать можно, упс, просчитался, но где?)
- В режиме Design блок с позиционированием элемента называется (ты не поверишь!) Position, а в режиме Motion тот же самый блок называется Transform
- При включённом строуке по центру (не inside/outside) trim path просто не работает — понятно почему не работает, но непонятно, отчего в таком случае не дизейблить фичу или как-то подсказывать это в UI
- Свойства нельзя переименовывать на таймлайне. А больших и сложных переходах это может стать проблемой
- В интерфейсе можно (зачем-то) переключать таймлайн с миллисекунд на секунды, лучше бы добавили переключение на кадры, как по мне
- Есть экспорт готового кода, но с оговоркой: на выходе получаем только код базовых эффектов, которые поддерживаются браузерами. Экспортнуть сейчас можно в CSS, React и JSON. Позже обещают добавить экспорт Lottie и очень размыто пообщелаи экспорт шейдеров.
- 3D-трансформации тоже наобещали, но пока не включили

Откуда столько хейта?
На мой взгляд Figma потеряла продуктовый фокус и как настоящий СДВГшник пытается ухватиться за всё подряд — в итоге получается от силы результат "в рамках ожиданий", старые долги не закрываются, а новые продуктовые стримы забываются сразу после презентации. Помните, в прошлый раз они показывали упрощённую Figma для сммщиков и маркетологов? Кто сейчас помнит, как она называлась? Да даже те же стрелочки из FigJam сколько лет уже просят — мне кажется, они внутри уже превратили это в мем, как Half-Life 3.

Что в итоге?
Хороший ли это продуктовый релиз? Да, это хороший фундамент, который снижает порог входа в UI-моушн для юных дизайнеров, которые перестали мыслить статичными картинками и начинают понимать ценность и силу интерактива. Лично знаю десятки человек, которые открывали в своё время AE, видели его UI и со словами «ой_ну_нахер.gif» закрывали его и никогда не возвращались. Но для серьезного продакшена врядли кто-то будет перекраивать свой пайплайн с тем набором, что показали.

Удачное ли это время для такого релиза?
Удачным оно было лет 7–8 назад, когда ещё был живой Principle, Framer пытался найти свою идентичность, а рынок хардкорных инструментов прототипирования делили с ножами за гаражами Origami и ProtoPie. Но мы прекрасно знаем, что вместо Motion mode тогда мы получили «макаронную фабрику».

Что ж, будем следить. Конкуренция — это хорошо. Жаль только, что 3D-трансформацию показали, но не завезли. Пока работаем по осям X, Y и Й.

Побывал на прошлой неделе в барселонском офисе N26 на митапе Into Design Systems. Хотел попасть ещё в прошлый раз, но это был первый в моей практике отказ после регистрации на ивент: видимо, быстро разобрали все места. В этот раз повезло, и я приплыл (на улице +38) по нужному адресу вовремя. Офис N26 находится в районе El Poblenou, который по контингенту и языку напоминает Брайтон-Бич (ну или Патрики). Симпатичное, но дефолтное здание. Я могу быть предвзят, но меня хорошим офисом удивить сложно, спасибо бывшей и текущей работе. Митап проходил в небольшом опенспейсе, было человек 50–60, в общем, формат обычного демо за прошедший спринт.

Открыли мероприятие трое ребят из N26, хосты: рассказали про компанию, порекламили пару вакансий. Кстати, фоткать попросили вообще ничего не снимать: «ну у нас тут всё под строгим NDA, ю ноу». Хотя, если честно, ни одного финального макета или чего-то секретного так и не показали.

Дальше выступал Alex Bailon, Design System Manager из N26. На мой взгляд, это был самый технически полезный доклад: он показал несколько небольших внутренних утилит (буквально на одну фичу каждая) и сделал упор на основной плагин, упрощающий жизнь продуктовым дизайнерам. Что мне запомнилось:

- работа с a11y: трёхпозиционный переключатель с множителем ×1, ×1.5, ×2. За счёт привязки всех вэриэблз эта штука позволяет быстренько проверить эдж-кейсы с масштабированной вёрсткой. Удобно, полезно и важно, учитывая ультимативно жёсткие требования ЕС в части доступности;
- быстрые шаблоны/блоки для паттернов приложения: кастомные навбары, таббары, карточки, карусели;
- перепривязка паддингов и марджинов к вэриэблз для тех, кто поленился лезть в нативную менюшку, по сути экономит пару кликов;
- хайлайтом стала фича переключения фрейма из iOS в Android и обратно. Большинство дизайнеров и стейкхолдеров сидят на iOS, а разработчикам тоже нужно передавать макеты под Android.

Вот тут аудитория буквально взорвалась овациями, а я сидел, с одной стороны, с абсолютнейшим покерфейсом, а с другой стороны, с теплотой и гордостью на душе. Дело в том, что ровно эту же проблему я решил с командой ещё лет пять назад в Сбере, разумеется, без помощи ИИ-агентов и вайбкодинга =D

Следующим выступала Mertxe Hinarejos Álvarez, Design System Lead из HP, с абсолютно проходным докладом: дженерик-проблематика и такое же решение. «Нашу команду ДС часто доставали вопросами, как и что нужно использовать, поэтому мы прикрутили чат-бота, а потом узнали про MCP-сервер». Вывод: документация нужна и должна быть написана хорошо. В целом доклад напомнил общее ощущение от HP в последние годы.

После на сцену выкатился звездочка вайбкодинга Sil Bormüller, создатель Figma CLI и фаундер Into Design Systems. Весь доклад был посвящён Figma CLI и восхвалению Клода, тут тяжело спорить. Очень приятный чувак, сильно напирал на то, что он жуткий хиккан и интроверт, хотя визуально выглядит прям душой компании; вероятно, поэтому и показался мне таким близким по вайбу. Приятно поболтали после выступления.

Завершающий рассказ был от Justine Montgomery, кофаундера (ты кофаундер, я кофаундер, мы кофаундеры) Into Design Systems. Джастин построила сторителлинг на карьерном треке: рассказала, как тяжело прошёл переход из графического дизайна в продукт; переход в дизайн-системы дался проще, но она попала в ловушку портфолио ДС-дизайнера. Тут захотелось её обнять, ведь я и сам точно так же мучился с похожим кейсом. Пускай ДС такой же продукт, хоть и внутренний, но по опыту знакомых, студентов и моему личному с ними куда сложнее: не знаешь, как, что и о чём писать, что показывать. Панчлайн был виден издалека: она решила сделать платформу, которая помогает дизайнерам собрать каркас кейса, отвечая на вопросы. Обещает запустить в августе.

Несмотря на то что доклады не произвели прям большого впечатления, общее ощущение от ивента осталось приятное. Профили всех спикеров на LinkedIn вынес и хотел завершить одной мыслью (напоминалкой самому себе): не забывай, а главное, не стесняйся рассказывать про свою работу. Если ты читаешь эти строки, то ты и есть сопротивление!

Митю Осадчука поздравляю с днем рождения!