Motion Design 2026

Анимации нового уровня

3D-буквы, живые фоны, физика, SVG-морфинг, волны и траектории — всё в одной демо

Умный стэк

Карточки-слои

Тень бежит впереди, каскад по диагонали, микро-отскок в конце

📊

Лимиты

Оформление без андеррайтинга

🏃

Спорт

Любой вид, включая экстремальный

👶

Тарифы

Конкурентные, особенно для детей

💳

Выплаты

По таблице, в % или без листа

Барабан-счётчик

Одометр лимита

Цифры прокручиваются как барабан с инерцией и откатом, на финале — свечение

Автофокус

Живой продукт

Карточки по очереди выходят в фокус: масштаб, свечение, остальные приглушаются

1

Возрастная группа

2

Застрахованные

3

Спорт и профессия

4

Риски и суммы

Световая дорожка

Процесс как data-flow

Градиентные линии со свечением бегут по этапам, активный шаг подсвечен

1Шаг

2Шаг

3Шаг

4Шаг

Mesh-градиент

Живой фон

Мягкие цветовые пятна «дышат» и дрейфуют — фон живой, но не отвлекает

Световой клин

Сравнение как событие

Диагональный клин: одна зона гаснет, другая усиливается

✓ Оформляется в ЛКП
Стандартные случаи

Через «Веб-авто»
Большие суммы и отклонения

Физика плиток

Выбор с отталкиванием

«Собери сам» выдвигается вперёд, остальные расходятся

Стандарт

Оптимум

Собери сам

Премиум

Глубокий финал

Логотип из глубины

Знак растёт из глубины, камера «дышит»

Anime.js · Grid stagger

Волна от центра

84 точки пульсируют волной от центра сетки (stagger по расстоянию)

Anime.js · SVG morph

Морфинг формы

Круг → квадрат → звезда: контур перетекает плавно, как живые границы

Anime.js · Motion path

Движение по траектории

Объект едет по изогнутой кривой Безье, след остаётся

Anime.js · Пружины

Физика отщёлкивания

Шарики падают и отскакивают с разной жёсткостью и затуханием

Anime.js · Keyframes + random

Хореография разброса

Элементы влетают с детерминированным хаосом: смещение → вращение → масштаб

Anime.js · Draw + motion

Рисование и движение

Линия рисуется по контуру, по ней синхронно едет точка