Влияние анимации на UX в моб. приложениях

Влияние анимации на UX в мобильных приложенияхКирилл Голышев

Немного историиРекомендации Microsoft– кратчайший путь между двумя точками– оптимальная длительность анимации не более 200 мс

Наши дниWindows 8

Анимация - это круто!

Анимация - это круто!

Почему?

Сенсорные интерфейсы

– использование жестов– активное внедрение речи– использование движения

Изменение способов взаимодействия

– уменьшение рабочей области– технические ограничения

Проблемы

Почему анимация влияетна UX?

1. Снижает когнитивные нагрузки на пользователя, так как изменения передаются эффективно.

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

3. Анимация добавляет характер программному обеспечению.

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

Где. Как. Зачем?

ГдеОпределение технических требований и возможностей

– платформа– оборудование – размер экрана

Определение метода взаимодействия с пользоватем

– реалистичное– абстрактное

Как

Определение своих задач и целей

1. Направление внимания2. Улучшение ориентации пользователя3. Удержание пользователя в «потоке» действия

Зачем

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

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

Улучшение ориентации

Удержание в «потоке» действия1. Анимация может помочь в поддержании «потока» пользователя. Она помогает соединить элементы, которые без нее казались бы «разованными».

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

Разные типы анимациивоспринимаются пользователем по разному

Fade

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

Progress bar

Увеличение скорости прогресс бара к концу загрузки, воспринимается пользователем лучше, так как появляется ощущение, что загрузка близка к завершению.

Zoom

Эффект масштабирования не влияет на восприятие скорости работы приложения. Тем не менее, движение имеет некоторое влияние на восприятие.

Animations in User Interface Design: Essential Nutrient In-stead of Eye CandyJanuary 31st, 2010 by Markus Weber

The Science of AnimationJuly 29th, 2011 by Kai Deller

Animated UI Transitions and Perception of Time – a User Study on Animated Effects on a Mobile ScreenJussi Huhtala, Ari-Heikki Sarjanoja, Jani Mäntyjärvi, Minna Isomursu, Jonna HäkkiläNokia Research Center, Oulu, FinlandApril 10–15, 2010, Atlanta, GA, USA

По материалам