100
14.06.2017

Как удивлять своих пользователей анимацией?

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

Анимация в веб-дизайне существует уже долгое время. В основном она была реализована через форматы gif, а затем, .swf. Но для сайтов, на которых хотели добиться идеального юзабилити, анимация вскоре была связана с плохим UX. Однако в скором времени CSS3 поднял анимацию на новый уровень, особенно CSS-переходы и анимации CSS. Упрощенная реализация и более высокая производительность, чем даже JavaScript, сделали CSS идеальным инструментом, и дизайнеры с тех пор экспериментируют с анимацией в пользовательском интерфейсе.

Пример правильной анимации.
Шапки Optimo. На сайте реализован приятный анимационный переход с зависанием шапок. Вниз выпадает подсказка при наведении. Это приятное прикосновение, оно создает чувство индивидуальности и чувство восторга.

Анимация gif

Gif cap

Всегда необходимо создавать эмоциональную связь с анимацией.

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

Честно говоря, причудливая анимация — это весело:)

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

Как удивлять своих пользователей анимацией?

Анимации делают ваш сайт интересным! Более того, люди любят это, они будут наслаждаться им так, что они будут делиться им со своими друзьями — будь то в разговоре или в Instagram.

Вывод!

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

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

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