Гавкающий Тотошка, или как Cursor AI открыл мне путь в микроанимации
Гавкающий Тотошка, или как Cursor AI открыл мне путь в микроанимации
Хотел делать микроанимации, как у лидеров рынка
Хотел делать микроанимации, как у лидеров рынка
Я восхищаюсь анимациями Benji Taylor (лид дизайнер в X и SpaceX) и Emil Kowalski (Linear, ex‑Vercel) и всегда хотел делать так же.
Меня вдохновляет, когда продукт сложный по логике и чистый по UI, но в нем есть микроанимации, пасхалки и приколюхи. Это показывает, что дизайнеру было не все равно и он хотел порадовать пользователя, который чаще всего весь день пользуется этим сервисом. Claude, Linear, Vercel - потрясающее внимание к деталям.
Я восхищаюсь анимациями Benji Taylor (лид дизайнер в X и SpaceX) и Emil Kowalski (Linear, ex‑Vercel) и всегда хотел делать так же.
Меня вдохновляет, когда продукт сложный по логике и чистый по UI, но в нем есть микроанимации, пасхалки и приколюхи. Это показывает, что дизайнеру было не все равно и он хотел порадовать пользователя, который чаще всего весь день пользуется этим сервисом. Claude, Linear, Vercel - потрясающее внимание к деталям.
Кое-что научился делать, но основательно не мог засесть за анимации в АЕ и Rive
Кое-что научился делать, но основательно не мог засесть за анимации в АЕ и Rive
Я немного научился делать простые вещи в After Effects и Rive, но страх чистого листа, необходимость платить для экспорта, изобилие функций в АЕ — из‑за этого я полгода не мог плотно засесть за анимации.
Я немного научился делать простые вещи в After Effects и Rive, но страх чистого листа, необходимость платить для экспорта, изобилие функций в АЕ — из‑за этого я полгода не мог плотно засесть за анимации.
Но потом решил попробовать анимации сразу в коде
Стал делать тестовое для Озон банка — CRM для волшебников. И решил заодно заанимировать свои идеи: ИИ помощника Тотошку и табы.




Тотошка AI
Вдохновлялся Clippy и псом Роджером из Windows и захотел, чтобы Тотошка AI смотрел за курсором и гавкал при нажатии. Чисто по приколу — CRM используют весь день, и такие мелочи могут приносить радость работникам, но всегда можно отключить в настройках.
Вдохновлялся Clippy и псом Роджером из Windows и захотел, чтобы Тотошка AI смотрел за курсором и гавкал при нажатии. Чисто по приколу — CRM используют весь день, и такие мелочи могут приносить радость работникам, но всегда можно отключить в настройках.

Сгенерировал изображение собачки в стиле иллюстраций книги. И ещё 8, которые смотрят в разные углы. Попросил ChatGPT быть консистентным: лапы должны быть в одном и том же месте, просто меняется положение головы.
Сгенерировал изображение собачки в стиле иллюстраций книги. И ещё 8, которые смотрят в разные углы. Попросил ChatGPT быть консистентным: лапы должны быть в одном и том же месте, просто меняется положение головы.

Гавкающая собака должна быть в том же контейнере (96 на 96), что и обычные собаки. Тогда движение получается +- плавное.

Были сложности: собачка мерцала, не поспевала за курсором, анимация была дерганой.
Понял, что дело в png — перенес иллюстрации в svg. Внес правки за несколько промптов, несколько раз отправлял запись экрана в ChatGPT и через него писал промпты, скормил Курсору skill для анимаций от Эмиля Ковальски и стало норм.
Были сложности: собачка мерцала, не поспевала за курсором, анимация была дерганой.
Понял, что дело в png — перенес иллюстрации в svg. Внес правки за несколько промптов, несколько раз отправлял запись экрана в ChatGPT и через него писал промпты, скормил Курсору skill для анимаций от Эмиля Ковальски и стало норм.
Табы
Захотелось табы поинтереснее, как у Notion. Тут проблем с Курсором вообще не было — несколько промптов и правок и все готово.
Закидываешь анимацию из Notion в ChatGPT, и он неплохо пишет промпт.
Что дальше
Мое отношение к ИИ меняется почти каждый день. Иногда злюсь на галлюцинации и переживаю за будущее индустрии, а иногда кайфую, что благодаря ИИ экономлю время на рутине и могу делать то, что раньше не мог.
Факт в том, что без Курсора я бы непонятно когда сделал такие анимации. Он дал мне вдохновение и ощущение «я могу».
Дальше хочу:
пройти курс Эмиля Ковальски, чтобы нарастить вкус в анимациях и лучше понимать базовые правила
продолжать качать насмотренность в микроанимациях на design spells и spotted in prod
когда-нибудь все же освоить АЕ для сложных сцен
Табы
Захотелось табы поинтереснее, как у Notion. Тут проблем с Курсором вообще не было — несколько промптов и правок и все готово.
Закидываешь анимацию из Notion в ChatGPT, и он неплохо пишет промпт.
Что дальше
Мое отношение к ИИ меняется почти каждый день. Иногда злюсь на галлюцинации и переживаю за будущее индустрии, а иногда кайфую, что благодаря ИИ экономлю время на рутине и могу делать то, что раньше не мог.
Факт в том, что без Курсора я бы непонятно когда сделал такие анимации. Он дал мне вдохновение и ощущение «я могу».
Дальше хочу:
пройти курс Эмиля Ковальски, чтобы нарастить вкус в анимациях и лучше понимать базовые правила
продолжать качать насмотренность в микроанимациях на design spells и spotted in prod
когда-нибудь все же освоить АЕ для сложных сцен
