заказать проект
Агентство 202

Дизайнеры часто добавляют небольшую анимацию в интерфейсы, чтобы сделать дизайн более современным, привлекательным и развлечь пользователей.

Однако, при более глубоком погружении в тему анимации интерфейсов оказывается, что даже минимальная простейшая анимация улучшает пользовательский опыт, повышает конверсию и другие ключевые метрики продукта.

Под микроанимацией подразумевается «оживление» обычно статичных элементов интерфейса: например, можно анимировать индикатор, показывающий количество товаров в корзине, связать один объект с другим через smart animate или сделать анимированный прелоудер.

Все эти незамысловатые микроанимации помогают удерживать внимание пользователя, подталкивают к нужному действию, иллюстрируют связи между объектами и служат наглядными подсказками. А это, в свою очередь, повышает количество пользователей, которые успешно справились с задачей на сайте, нашли нужную кнопку или дошли до оформления заказа.


За счет чего работают микроанимации?

  • Анимация имитирует реальный мир. Человеческий мозг хорошо считывает динамические объекты среди статических и быстрее на них реагирует, потому что они заслуживают внимания в первую очередь. Это работает в реальном мире и в дизайне как физической модели мира.
  • Анимация выстраивает визуальную иерархию объектов на странице. Мы обращаем внимание на что-то крупное и яркое — главные характеристики правильной кнопки call to action — но в первую очередь — на что-то динамичное.
  • Анимация дает пользователю фидбэк. Дональд Норман в своей книге «Дизайн привычных вещей» писал, что отсутствие фидбэка, или обратной связи, — главная «болезнь» дизайна, и приводил в пример людей в лифте, которые по десять раз нажимают одну и ту же кнопку. Почему? Потому что кнопка никак не отвечает. Анимация — один из самых эффективных способов дать обратную связь и наглядно показать пользователю, что товар добавлен в корзину и готов к оформлению.

Таким образом, микроанимация, которая не требует колоссальных усилий в разработке, приносит огромную пользу бизнесу и делает жизнь пользователей легче и приятнее.

Креативное агентство NST ART
проспект Мира, д. 102
г. Москва
129626
Phone: +7 495 136-84-54