Принцип «общей кнопки» рассказывает о едином стилеобразующем визуальном образе, проходящем «красной нитью» через все визуальные коммуникации компании. Цель — обеспечить внешнюю согласованность и узнаваемость в дизайне.
Согласованность и узнаваемость помогают упростить восприятие интерфейса при переходе от одного сервиса к другому. Если человек использует один из сервисов QIWI, то предполагается, что компании удастся заинтересовать его и другой своей услугой. Поэтому в интерфейсе следует учитывать тот факт, что переход от одного сервиса к другому должен быть максимально быстрым и комфортным.
Согласованность и узнаваемость помогают понизить порог входа при таких переходах за счет повторения сложившегося ранее опыта использования.
Следуя принципу «всё проще», мы не стали делать стилеобразующим образом отдельный оформительский элемент. Вместо этого мы назначили стилеобразующий образ на уже существующий, активно используемый в интерфейсах, самый практичный и важный контрол — на кнопку. Ведь кнопки в интерфейсе обычно самый заметный элемент, так как им положено привлекать к себе внимание пользователя и побуждать к совершению целевого действия.
Особенно важно придерживаться принципа «общей кнопки» на этапе знакомства с сервисом и первых шагах пользования им. В частности, на главных экранах сайта, приложения и терминала.
Применение принципа «общей кнопки» подразумевает использование брендированной кнопки в центре композиции (ближе к линии горизонта), размещённой на светлом однородном фоне на главных экранах в интерфейсе.
Принцип «общей кнопки» применим как для продуктов QIWI Кошелька, так и для других сервисов QIWI.
Как применять принцип «общей кнопки»
на главных экранах
- Стилеобразующий элемент размещается на всех главных экранах сервисов QIWI — там, где пользователь начинает взаимодействовать с сервисом. Если в сервисе есть неавторизованная и авторизованная зона, то главная кнопка должна быть на обоих главных экранах.
Пример расположения «общей кнопки» на лендинге на главной странице навторизованной зоны qiwi.com.
«Общая кнопка» на главной странице терминала.
2. Кнопка включает в себя главное функциональное действие на экране.
3. Кнопка несет самую большую пользу для компании, продукта, пользователей, бизнеса.
4. Кнопка располагается по центру. В видимой части экрана. По высоте ближе к «уровню горизонта».
5. «Общая кнопка» должна быть самым крупным кликабельным элементом на экране.
6. Кнопка всегда оранжевая со скругленными краями 100% — в стиле Brand button с тенью и градиентом.
7. Перед названием кнопки рекомендуем размещать иконку, усиливающую заметность кнопки.
