Анимировать нельзя помиловать
(да, название недокрутил)

Когда вижу сайт с интересным дизайном – стараюсь (зачастую безуспешно) сохранить его себе куда-то в закладки, чтобы, когда наступит время, вдохновиться чем-то красивым. Просматривая последние сохраненные страницы, заметил, что большая часть понравившихся проектов яркая (тут ничего удивительного, скоро лето и настроение соответствующее) и с какой-то интересной, необычной анимацией, которая цепляет взгляд, заставляет в нее «позалипать».

Ссылки на сайты из шапки оставил внизу поста. Естественно, большая часть «красоты» доступна только на ПК версиях.

С каждым годом в веб-дизайне укрепляется тренд на анимации.
В этом есть своя логика:
- Контента в интернете становится все больше – нужно как-то выделяться среди конкурентов, чтобы потенциальный покупатель обратил на тебя внимание;
- Анимации делают контент более динамичным (снижают «сухость» текста), что может повысить желание пользователя остаться на странице (особенно в длинных материалах).
- Создается современный «дорогой» внешний вид – если лонгрид выглядит стильно и современно, складывается впечатление, что контент тоже качественный (встречают по одежке / эффект ореола / воспринимаемая ценность).
- Анимации могут выступать в роли подсказок, направляя пользователя по нужному пути, показывая различные взаимодействия, объясняя, что вообще сейчас происходит (ховеры, акцентные анимации на важных элементах интерфейса, интерфейсы загрузок и т.д.).

Как провожают пароходы? Совсем не так, как поезда.
С веб-дизайном все понятно. Если сайт продающий – анимации ему, скорее всего, только на пользу.

А применим ли такой подход в e-learning?
Если мы говорим про ховеры, микроанимации и акцентные анимации – совершенно точно да. Можно назвать такие анимации «анимациями для пользы» и отнести их к правилам хорошего тона.

Если анимации добавлены просто «для красоты», их влияние на учебные цели может быть неоднозначным:

С одной стороны, очень неплохо, если наш курс будет выделяться на фоне остальных, будет динамичным, и при первом взгляде на курс пользователи подумают «о, прикольно, постарались ребята, дай-ка почитаю, что там такого интересного».

С другой стороны, анимации отвлекают от контента: скролл-анимации, мигающие и двигающиеся элементы, различные эффекты могут раздражать и мешать сосредоточиться на тексте. Мозг тратит ресурсы на обработку лишних визуальных стимулов вместо усвоения информации (когнитивная перезагрузка).

Также длительные анимации чаще всего снижают скорость отображения контента (например, текст появляется «порционно» после прокрутки), это ухудшает UX и, что логично, увеличивает время, необходимое для прохождения курса.

Плюс нужно не забывать про time-to-market и бюджеты. Чаще всего в корпоратевном обучении нет таких ресурсов и возможностей, как, например, в маркетинге, а анимации могут существенно повлиять на стоимость конечного продукта.

------

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

А как вы думаете, уместна ли анимация «для красоты» в e-learning?

Алексей Миляев и команда сообщества Digital Learning

Сайты из шапки:
Арт Лайфт, API Яндекс Карты, Flying Papers, Websoft, Girls don't cry, База, Itemy