Payler: работа над дизайном

    Дорогие друзья,

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

    image



    Идея проекта родилась еще в конце прошлого года. Изначально это должен был быть простой платёжный шлюз, позволяющий принимать оплату с банковских карт. Мы долго думали и перебирали разные названия, в основном сравнивая их с наличием свободных доменов. Остановились на Payler, оно было самым звучным и запоминаемым. Тогда же Руслан, наш арт-директор, придумал слоган — No nonsense payments. Ведь система платежей должна быть прозрачной, понятной и осмысленной. Основной идеей бренда стало следующее: он однозначно должен быть другом и знать, что нужно его пользователям. Должен подсказывать, быть полезным и отзывчивым. Многие бренды в России почему-то делают иначе: у нас чаще появляются такие типажи, как “бренд-директор”, “бренд-бизнесмен на Бентли”, “бренд-учитель”. А Payler — это пример “бренда-друга”. Сделали логотип и заглушки для сайта:

    image

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

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

    image

    Параллельно была проведена работа маркетингового характера — мы посмотрели свежим взглядом на позиционирование проекта, поменяли основные сообщения и слоган. Теперь он звучит так: “Payler: Понятные платежи”. После работы над позиционированием сделали презентацию, которая была запущена в соцсети и разослана клиентам. Её можно скачать здесь, если интересно: payler.com/Payler.pdf.

    Спустя некоторое время начали набрасывать функционал для мобильного приложения и работать над рабочим прототипом веб-интерфейса. Опять же мы несколько забегали вперед, так как функционал не был до конца согласован. Зато в таких условиях нам удалось придумать какие-то необычные дизайнерские решения, исходя из которых мы потом определяли функциональную часть. Например, графики, показывающие динамику платежей. У нас уже появился прототип в Axure (http://www.axure.com/ — не самая удобная программа, но по крайней мере позволяет сделать рабочий прототип). С получившимся прототипом стало ясно, куда нужно двигаться, стал ясен примерный объем работы по дизайну. И вот, что получилось:

    image

    Главная особенность интерфейса Payler, как мы бы хотели её видеть — прозрачность и практичность. Здесь нет скрытых функций, сложных формулировок или длинных строк меню. При входе в систему первое, что видит пользователь — это монитор того, что происходит в магазине, с аналитикой и проблемными местами в платежах. Сами же платежи выводятся наглядно, с гибкой системой фильтрации. Из фишечек решили использовать в будущем spring-анимацию событий. А в остальном мы считаем, что интерфейс в первую очередь не должен мешать выполнению требуемых задач, способствовать продуктивности, быть понятным и не вызывать рак глаза.

    В данный момент мы работаем над мобильным приложением. Уже есть карта проектирования приложения, функционал которой необходимо спустить с небес на землю. В первую очередь сейчас укомплектовываем часть функционала в пользу его аналитических данных. Даже есть идея сделать мобильное приложение, заточенное больше под работу в режиме read-only, то есть как монитор для отслеживания происходящего. А подключение к полноценному интерфейсу должно происходить в случае необходимости. Логика понятная: пользователь работает за компьютером, а вот мониторить свои транзакции может через мобильное приложение по дороге.

    image

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

    Спасибо за внимание, будем рады вопросам и комментариям.

    С любовью,
    Payler

    payler.com
    facebook.com/payler
    Payler
    Компания

    Похожие публикации

    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама

    Комментарии 13

      0
      Ну что, здорово отрисовано!)
        +2
        тут пока ничего не видно, не раскрываем секреты :)
        еле убедил арт директора мобилку экран вставить…
        Постепенно мы будем знакомить с нашими интерфейсами и давать больше информации.
        На следующей неделе для всех кто подписался на payler.com мы хотим выслать небольшой опросник по ожиданиям и потребностям.
        0
        В первом варианте два графика, вероятно, сравнение поступлений во времени. На втором остался почему-то один. Каким образом, вы сравниваете промежутки в настоящий момент?
          0
          Первый вариант — это первый драфт, с чего все начиналось, сейчас все это перерасло в гораздо насыщенные интерфейсы.
          По текущему дню будут различные фильтры и тэги — в прочем как и за любой период времени.
          +1
          Очень приятная отрисовка, вы молодцы ребята! С нетерпением жду фуллсайзов, пощупать бы (любопытно как дизайнеру). Или если есть они где-то — напишите мне в личку пжлст. :)
          Много времени заняла проработка тех интерфейсов, что вы уже показали, у дизайнера? Есть ли у него портфолио, дабы заценить что он еще умеет?
            0
            3,5 месяца веб включая работу над проектированием. Сейчас еще мобилки пилим :) и еще много всего! Его зовут Руслан Мирсалихов, он Арт.дир poloniumarts.com ну и соответственно Payler. В этот проект он вложился всей душой, а результат сами сможете увидеть через некоторое время) прототипы и все драфты будут после релиза.
            +1
            Мне одному кажется, что определять функциональную часть исходя из дизайнерский решений это (как бы это помягче) не совсем естественно?
              0
              Есть одна такая компания, в которой дизайнеры определяют функциональную часть даже на уровне производства устройств. Компания называется Apple. У Apple конечно неоднозначная репутация, но в Payler тоже хаос бывает, никто не пытается этого скрывать.
                0
                У нас все в синергии с технической частью.
                0
                Красиво! Но интересен не столько админский интерфейс, сколько клиентский. Есть его наброски? И когда примерно запуск?
                Т.е., как будет выглядеть непосредственно страница оплаты? И можно ли будет в сервисе платить без регистрации?
                  0
                  Клиентский 50% админского. Запуск как пройдем PCI DSS. По страничке оплаты — можно будет использовать шаблоны, кастомизировать по вкусу и цвету в рамках допустимого или попросить нас это сделать )
                  Платить да, а вешать инструменты к себе на сайт — нет.
                  0
                  Привет. А куда писать фидбэк? (Не нашел на сайте имейла). А то сюда как-то не кошерно. Есть пара советов из опыта :)
                    0
                    Пишите на hello@payler.com, вам там ответят обязательно. Укажите в теле письма только, что вы с Хабра, пожалуйста.

                    Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                    Самое читаемое