Программирование для мобильных платформ. IOS - страница 13
Рисунок 2.6. Цвет и контраст в интерфейсе Facebook.
Обратим внимание на то, что легкие контрасты между областями тем не менее хорошо отделяют их друг от друга. Визуально сохраняется даже наследственность (область комментариев явно принадлежит общей области поста), и это заслуга не только обводки.
Хорошим показателем того, что палитра в интерфейсе удалась, если он создает «на вкус» ощущение единого освещения. Это достигается путем использования естественных контрастов, насыщенных оттенком теней. Например, не рекомендуется использовать холодное на теплом в качестве акцента. Это противоестественно, в природе такого не бывает. Даже подобранные по цветовым отношениям синий в красном смотрится хуже, чем красный в синем (Рисунок 2.7):
Рисунок 2.7. Использование естественных контрастов
Также следует давать пользователю ясный фокус на одном первостепенном сценарии и делать остальные сценариии явно второстепенными. Отсюда следует хрестоматийное call-to-action. Однако следует понимать, что в 90% случаев call-to-action является кнопкой и предваряется какой-то информативной частью. Это означает что она должна быть легко находима, но не бросаться в глаза первой. Это достигается, например, при помощи яркого, активного цвета в элементе небольшого размера (Рисунки 2.8; 2.9; 2.10)
Рисунок 2.8.Call-to-action как часть сценария workspace 2.
Рисунок 2.9.Call-to-action как часть сценария workspace 3.
Рисунок 2.10.Call-to-action как отдельный сценарий.
3.Мобильный интерфейс для одной руки
В своей книге Designing Mobile Interfaces (2011) дизайнер Стивен Хубер ввел понятие The Thumb Zone («зона большого пальца») – область экрана, наиболее удобная при использовании телефона одной рукой. С года издания книги средний размер смартфона заметно увеличился, и «мертвая зона» – область, которую сложно достать пальцем одной руки, – также стала больше (Рисунок 3.1):
Рисунок 3.1. «Зона большого пальца» для 5—4,7-дюймового экрана.
В «мертвую зону», отмеченную красным, попадают панели инструментов приложений, которые как в Android (App Bar / Primary Toolbar), так и в iOS (Navigation Bar) находятся в верхней части экрана.
Настоящее решение данной проблемы должно не помогать дотянуться до нужной кнопки, а избавить пользователя от необходимости дотягиваться.
В эпицентре «мертвой зоны» iOS стандартно расположена кнопка Back, на телефонах Android в данную область попадает кнопка вызова бокового меню (Navigation Drawer). Однако в большинстве приложений нет необходимости к ней тянуться – достаточно сделать свайп от левого края телефона (Рисунок 3.2):