Анимация на сайте. "За" и "против"

- А вы бывали в бутиках Chopard?

- Ага. Если пускали.

- И?

- И смотрел.

- И всё?

- Всё. Второй что ли раз идти смотреть?

Анимация на сайте. Одни — категорически против неё, другие столь же категорически — за. А третьи как всегда — правы. И эти третьи вряд ли станут сегодня создавать флэш-сайт, если собираются что-то продавать или рассчитывают, что посетитель вернётся к ним второй-пятый-сорок шестой раз. Третьи не станут размещать на сайте флэш-элементы или веб-анимацию посредством javascript для того, чтобы только «развлекать». Всё это было хорошо, когда интернет был сам развлечением. Сегодня он — место работы, общения, покупок, учёбы, путешествий. Развлечения тоже, конечно, но для весьма специфической аудитории, на которую рассчитывать, если вы не владелец игрового портала или пионерской тусовки, неразумно.

Пользование интернетом и сайтами для разумной, огромной и — самое главное — платёжеспособной аудитории строится на трёх главных принципах:

• красота сайта, привлекательность равны удобству и пользе/выгоде: предложите покупателям накопительную (с каждого заказа) скидку, не сгорающую и действующую всегда, вкупе с другими и без них, — и ваш магазин в момент станет фантастически прекрасен без малейшего намёка на анимацию;
• красота сайта — это его максимальная понятность, то есть возможность для посетителя действовать по знакомому шаблону, причём — в самом простом его варианте: этот эффект связан с тем, что интернет стал обыденностью и ничего принципиально нового он уже не предлагает, потому мы ищем простого и выгодного, а на красоту можем посмотреть — один раз, не более;
• «красота» должна работать — подсказывать, направлять, предлагать (ненавязчиво), объяснять, иначе она, как прекрасная дама, которая страстно желает выйти замуж, побуждает к одному — бежать, бежать, бежать!

Вот на этих трёх принципах и строятся самые эффективные и любимые народом сайты. В рамках рассматриваемого вопроса нам интересен третий, на котором и остановимся подробнее.

Анимация — «не роскошь, а средство передвижения»

Р. Наборс, дизайнер и художник, в своей работе Animation And The Future Of UX, вышедшей в 2014 году, исследовал и обобщил все основные случаи пользы и привлекательности веб-анимации для современного посетителя сайтов. Рассмотрим вкратце основные из них.

Веб-анимация помогает формировать причинно-следственные связи и улавливать ход изменений на сайте

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

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

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

Просто необходима анимация (но случается она крайне редко!) при прокладывании маршрутов. На сайте одной из частных московских стоматологических клиник, которая, как водится, размещается в «специально разысканном почти недоступном месте», анимировали маршрут от ближайшей станции метро и автобусной остановки и даже «провели» потенциального посетителя по четырём этажам здания до дверей эскулапов. Что вы думаете? Потенциальный посетитель дошёл, стал реальным и увеличился в числе примерно на треть!

Анимация как средство компактного отображения контента

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

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

Возможен ли хороший сайт без анимации? Безусловно! И секреты его настолько банальны, что стыдно повторять: интересное и выгодное предложение, информативность, простота и многоступенчатая фильтрация поиска, быстрота работы, разнообразие связи с администрацией, менеджерами. Всё это исключительно привлекательно! Без намёка на анимацию.