• Веб
  • Яндекс
  • 1.0 2.0 3.0

    Создание третьей версии «Яндекс-денег»

    Описание Процесс

    Начинаем разработку концепции с главной страницы сервиса и придумываем один из сценариев оплаты. Увеличиваем значимость поиска, помещая поисковую строку на каждую страницу. Последние совершенные операции и раздел «Избранное» выносим в центральный блок на главной. В каталоге ставим вместо текстовых ссылок логотипы магазинов. Добавляем на главную страницу форму для оплаты мобильного.

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

    На странице с результатами операции предусматриваем возможность сразу добавить платеж в «Избранное» и сделать эту операцию регулярной.

    При совершении многих операций нужно вводить платежный пароль. Иногда его путают с паролем к Яндексу. Думаем, как исключить неразбериху. Решаем всегда показывать платежный пароль на совершенно особенной плашке. Чтобы у человека срабатывал рефлекс: «Необычная плашка — значит, пароль от „Яндекс-денег“».

    Думаем над видом плашки. Сначала делаем оранжевую.

    Арт-директор предлагает образ для плашки под платежный пароль: при выдаче банковской карты на конверте с ПИН-кодом есть напечатанная изнутри плашечка с кучей цифр — она маскирует пароль, и на просвет ничего не видно. Берем идею в работу.

    Добавляем золотой замочек и обводку, подчеркивая безопасность работы с сервисом.

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

    Пробуем вариант с цветным фоном. Не пошел.

    Решаем делать главную «под пользователя» — с настраиваемыми вкладками для частых операций. Например, благотворителям удобно сразу видеть «Пополнение», а плательщикам — «Избранное».

    Блок «Избранное» на главной отделяем от пункта меню в левой колонке, теперь на главной только 10 основных пунктов, а остальное — внутри соответствующего раздела. Добавляем иконки для платежей. В левый блок переносим все операции со счетом.

    Для новых, еще неавторизованных, пользователей добавляем большую красочную плашку с описанием преимуществ и возможностей сервиса. Преимущества могут «выезжать» при открытии страницы. Нажимаем «плюс» справа — и эти преимущества «уезжают» влево, а на их месте появляются новые.

    Упрощаем дизайн, делая его более лаконичным.

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

    Отрисовываем иконки.

    Готовим финальный документ — гайдлайны с описанием всех элементов.