UX в Apple: простой принцип интуитивного дизайна


04.01.2022 Время чтения - 3 минуты 1249

Около 1 миллиарда человек используют iPhone каждый день. Это самый ценимый бренд в мире, и хотя есть множество вещей, которые сделали Apple первой компанией, преодолевшей рыночную капитализацию в 2 триллиона долларов, именно их дизайн – их самая сильная сторона. Лучше всего об этом сказал Стив Джобс: «Мы дизайн-компания, которая, так уж случилось, делает компьютеры». Что же делает дизайн Apple таким минималистичным, таким хорошим и таким интуитивно понятным? Их дизайн вдохновлен физическим миром и тем, как мы взаимодействуем с окружающими нас объектами.

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

1. Хорошее ощущение пространства часто определяется метафорами физического мира

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

Открытие приложения на iOS

2. Люди успели привыкнуть и к нативным цифровым паттернам, которых нет в физическом мире

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

Открытие пункта списка
Нажатие на панель касания

3. Четкая пространственная логика у Apple делает дизайн понятным

Сравните смахивание вниз шторки с уведомлениями на iOS и на Android. В iOS пространственные отношения между экраном уведомлений (экран A) и главным (экран B) очевидны. A находится поверх B – смахивание края шторку убирает вверх, жест и движение экрана синхронизируются. Это очевидно, потому что легко найти этому аналогию в физическом мире.

Открытие шторки на iOS

Для сравнения, пространственная логика того же взаимодействия на Android гораздо менее ясна. Если потянуть вниз в любом месте экрана, экран запуска трансформируется в белый слой – здесь нет аналогии из физического мира.

А еще сложно визуально определить логику между контрольным слоем с черным фоном и слоем с белым. Они на одном уровне или черный слой на один уровень ниже? В то время как у Apple эффект размытия на экране уведомлений дает четкую подсказку.

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

Открытие шторки на Android

4. Бесшовная анимация Apple также играет огромную роль в создании пространственной логики и повышении качества продукта

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

Открытие и закрытие приложения на iOS
Открытие и закрытие приложения на iOS в замедленной версии

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