Принципы
Единый UX в продуктах
На данном этапе развития приложений наша основная задача — привести все приложения к единой стилистике и создать базу паттернов, которые можно переиспользовать, которые привычны и понятны клиентам.
Это достигается за счет нескольких вещей:
- Единая стилистика приложений на всех платформах
- Общие паттерны и поведение компонентов
Общие сущности оформляются и тестируются перед тем, как попасть в список примеров и рекомендаций. Необходимо избегать отступлений от этих решений и использовать их без изменений настолько, насколько это возможно.
Единый UI на iOS и Android
Дизайн выполняется в стилистике Альфа-Банка, с учетом особенностей операционных систем. Для этого необходима стилизация стандартных системных компонентов. В небольших проектах их кастомизация зачастую нецелесообразна из-за падения скорости разработки. В больших продуктах такой прием позволяет улучшить и унифицировать пользовательский опыт в разных продуктах и отделиться от конкурентов.
Среди основных преимуществ:
- Обучаемость пользователей. Нет необходимости заново привыкать к приложению: если уже пользовался веб-приложением или приложением на другой ОС, то всё сразу понятно.
- Переиспользование паттернов: если пользователь в розничном приложении уже научился выполнять какие-то функции, он гораздо быстрее сможет воспроизвести их и в корпоративном приложении.
- Переиспользование графики: ускорение в разработке макетов и прототипов.
- Удешевление тестирования: достаточно протестировать паттерны/поведение на одном прототипе и масштабировать результаты для обеих основных ОС.
- Информационная/рекламная поддержка: узнаваемые, похожие интерфейсы удобно демонстрировать в информационных материалах (пользователь узнаёт интерфейс с рекламы в своем телефоне — формирование доверия).
- Переиспользование кода: одни и те же решения/наработки могут быть разработаны сначала в корпоративном приложении, затем переиспользованы в розничном, и наоборот (в том числе это справедливо и для других приложений).
- Поддержка: независимо от ОС пользователя, сотрудники поддержки банка, его родные/друзья смогут подсказать, какую кнопку нажать, где она находится и как она выглядит.
- Укрепление визуальной составляющей бренда Альфа-Банка.
От чего отказываемся
- Floating Action Button — http://take.ms/H4Xo7, http://take.ms/HdUt7 Компонент привычен пользователям Android, хотя от приложения к приложению ведет себя по-разному. И не так очевиден пользователям iOS.
Что соблюдаем
- Паттерны поведения: например, свайпы для контекстных меню в iOS, лонгтапы для Android.
- Привычные матфоры иконок: share, more button...
- Дизайн диалоговых окон не кастомизируем.