Aninix | UI animation in Figma

Запускаем запись на приватную бету 🚀 Мы почти год работали над новой версией и переосмыслили подходы к работе. Наша цель – сделать лучший софт для моушн-дизайна. Чтобы при мысли «нужна анимация?» сразу вспоминали Аниникс. У нас есть крутая команда, экспертиза…Запись в приватную бету открыта и мы ищем тех, кто не боится давать честную обратную связь.

Запускаем запись на приватную бету 🚀Мы почти год работали над новой версией и переосмыслили подходы к работе. Наша цель – сделать лучший софт для моушн-дизайна. Чтобы при мысли «нужна анимация?» сразу вспоминали Аниникс.У нас есть крутая команда, экспертиза, ресурсы и жгучее желание изменить мир. Мы уверены в том, что вместе с вами сделаем продукт мирового уровня.Что нового в v3.0:1. пересобрали с нуля, учли прошлые ошибки;2. упростили интерфейс;3. использовали новую архитектуру и технологии;4. внедрили новые функции (например автолэяуты, анимация текста, шейдеры).Бонусы для бета-тестеров:1. бесплатный доступ на всё время беты;2. скидка на год после релиза.Условия участия:1. регулярно пользоваться Аниниксом;2. сообщать о багах и неудобствах;3. иногда созваниваться для интервью (по желанию).👉 Ссылка: https://www.aninix.com/beta

Держитесь за ваши стулья – шейдеры! 🪑 Шейдеры – это сложный способ делать красивые эффекты, но мы сделали его простым. Теперь можно создавать: - эффект жидкого стекла (как у Apple) - сложные градиенты - эффекты из фантастических фильмов - чёрные дыры - моушн…Видео и аудио в paint'ах!Теперь можно использовать не только статичные картинки, но и видео с аудио прямо в качестве пэйнта для текста и шейпов.Работает с любыми форматами и управляется на таймлайне.

Движок для анимации текстов Начнём список нововведений с главного – нового движка для анимации текстов. Мы сделали собственную разработку, которая умеет всё то же, что и After Effects, но без желания выбросить компьютер в окно. Она поддерживает все трансформации…Держитесь за ваши стулья – шейдеры! 🪑Шейдеры – это сложный способ делать красивые эффекты, но мы сделали его простым.Теперь можно создавать:- эффект жидкого стекла (как у Apple)- сложные градиенты- эффекты из фантастических фильмов- чёрные дыры- моушн блюр- и многое другое

Аниникс, как феникс, восстаёт из пепла! 🐦‍🔥 Мы пропали почти на целый год. За это время с нуля пересобрали весь продукт – разобрали по винтикам, покричали на код, собрали обратно. - Исправили все существующие баги - Создали много новых, но потом и их поправили…Движок для анимации текстовНачнём список нововведений с главного – нового движка для анимации текстов.Мы сделали собственную разработку, которая умеет всё то же, что и After Effects, но без желания выбросить компьютер в окно. Она поддерживает все трансформации, обрезку, блюры – в общем, всё, что нужно для удобной анимации текстов.

Аниникс, как феникс, восстаёт из пепла! 🐦‍🔥Мы пропали почти на целый год. За это время с нуля пересобрали весь продукт – разобрали по винтикам, покричали на код, собрали обратно.- Исправили все существующие баги- Создали много новых, но потом и их поправили- Добавили 6 новых функций- Готовим закрытую бетуP.S. Спасибо всем, кто всё это время ждал – скоро покажем, что получилось.

Сделали релиз долгожданной функции: добавили возможность дублирования проектов 🎉

Постараемся радовать вас новыми функциями чаще 🤗Сегодня сделали очередной релиз:• добавили возможность редактирования градиентов во вьюпорте (видео 1);• добавили функцию дублирования слоёв с помощью горячих клавиш cmd/ctrl + D и добавили возможность drag'n'drop слоёв на таймлайне (видео 2);• плюс несколько других небольших багфиксов.Полный лог измененийПостараемся радовать вас новыми функциями чаще 🤗Сегодня сделали очередной релиз:• добавили возможность редактирования градиентов во вьюпорте (видео 1);• добавили функцию дублирования слоёв с помощью горячих клавиш cmd/ctrl + D и добавили возможность drag'n'drop слоёв на таймлайне (видео 2);• плюс несколько других небольших багфиксов.Полный лог изменений

Опять мы притихли. Что-то у нас не получается вести соц. сети и разрабатывать софт 😩Поэтому мы решили собрать в одном посте все новости за предыдущие несколько месяцев:- добавили поддержку свободного положения для anchor point'а;- добавили возможность создавать проекты из svg файлов;- переработали систему синхронизации между фигмой и аниниксом. Сделали её быстрее и точнее;- добавили парочку новых пресетов с анимацией layer blur'а;- запустили 2 дополнительных плагина: protonix (для экспорта прототипов во все форматы) и anitype (для анимации текстов для figma slides);- стабилизировали систему, чтобы снизить количество багов до минимума.Если у вас есть мысли, баг репорты, или запросы на функционал – пишите. Мы всегда открыты и рады любой обратной связи.

Пара крутых анимаций сделанных в Аниникс за лето 🌞 Авторы:- https://x.com/gabfoulon- https://x.com/oleksandrplyutoПара крутых анимаций сделанных в Аниникс за лето 🌞 Авторы:- https://x.com/gabfoulon- https://x.com/oleksandrplyuto

Увидели прикольный дизайн в Х, решили заанимировать. По времени заняло 15 минут.

Повысить стабильность приложения – это наша цель на ближайшее время. Раньше около 15% пользователей испытывали вылеты приложения, сегодня эта цифра уже около 4%. Метим в показатель 0%.Если вы испытываете и знаете как повторить какой-то баг, дайте, пожалуйста, знать.

Сделали ещё один небольшой пример с использованием техники стаггер (урок здесь). Компонент взят из UI библиотеки shadcn.

Stagger - это техника анимации пользовательского интерфейса, когда элементы анимируются последовательно, иногда накладываясь друг на друга. Видео с пометкой 01: При отсутствии стаггера все элементы "слипаются" в один объект, и он кажется зрителю неживым …Пара примеров реальных интерфейсов, в которых используется данный приём.Пара примеров реальных интерфейсов, в которых используется данный приём.

Stagger - это техника анимации пользовательского интерфейса, когда элементы анимируются последовательно, иногда накладываясь друг на друга.Видео с пометкой 01: При отсутствии стаггера все элементы "слипаются" в один объект, и он кажется зрителю неживым02: При слишком длинной задержке все элементы распадаются и выглядят для пользователя как отдельные не связанные между собой части03: Хорошим же считается тот стаггер, который создаёт иллюзицию целостности объекта, но при этом сохраняет разную задержку для каждого элемента04: Существуют разные типы стаггера:в первом случае мы добавляем бОльшую задержку после появления первого элемента (delay after first)05: во втором случае добавляем задержку перед последним элементом (delay before last)06: Для того, чтобы подобрать идеальную задержку, нужно визуально представить график каждого сегмента. И сопоставить их так, чтобы они накладывались друг на друга создавая цельный графикStagger - это техника анимации пользовательского интерфейса, когда элементы анимируются последовательно, иногда накладываясь друг на друга.Видео с пометкой 01: При отсутствии стаггера все элементы "слипаются" в один объект, и он кажется зрителю неживым02: При слишком длинной задержке все элементы распадаются и выглядят для пользователя как отдельные не связанные между собой части03: Хорошим же считается тот стаггер, который создаёт иллюзицию целостности объекта, но при этом сохраняет разную задержку для каждого элемента04: Существуют разные типы стаггера:в первом случае мы добавляем бОльшую задержку после появления первого элемента (delay after first)05: во втором случае добавляем задержку перед последним элементом (delay before last)06: Для того, чтобы подобрать идеальную задержку, нужно визуально представить график каждого сегмента. И сопоставить их так, чтобы они накладывались друг на друга создавая цельный график