6 заметок с тегом

POS

Проверка

Для тестов, проведения интервью и проверки гипотез, собрал макеты кассы на нативных компонентах двух мобильных операционок

Это не первая попытка провести подобное тестирование. Ранее я делал концепт кассы для проверки множества разных идей.


21 ноября   APP   POS   Гипотеза   Касса   Мерката   Прототип   Тест
Untitled Document

Концепт-карта обновления кассы Меркаты

Ранее я писал про новое устройство Меркаты. Но вообще, кассовая программа Меркаты умеет работать на любом устройстве с операционной системой Виндоус или Андроид.


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

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

Это удалось пофиксить в следующих релизах. Касса стала выглядеть взрослее и аккуратнее. Обрела, сначала одну, затем несколько новых фишек

Смотреть на экран стало комфортней


Теперь про концепт обновления
Помните сложный квест, который нужно было суметь пройти пользователям при регистрации новой или перепривязке существующей кассы? Приходилось преодолеть более 10 шагов, прежде чем запуститься касса. В обновленной версии можно просто пройти короткую регистрацию или вовсе попробовать кассу в демонстрационном режиме. С технической стороны эта задачка непростая из-за некоторой сложности архитектуры. Но если правильно распределить ресурсы и время на переделку, то получается упростить квест, снизить нагрузку на техническую поддержку и отдел внедрения.
Обновленный экран входа

Экран торговли
Расположение чека и каталога товаров можно настраивать под пользователя, а главное меню скрывать. Бургер-меню чаще всего неудачное решение, которе не следует использовать. Но в нашем случае пользоваться элементами меню придется либо только при открытии и закрытии смены кассира, либо крайне редко в рамках открытой смены. Если не менять настройки, то меню будет всегда под рукой и станет привычным.
Выглядит экран так

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

Про это я уже ((http://blog.filippovonline.ru/all/ekosistema-uvedomleniy/ рассказывал).
А про обновления каталога и работу с товарами без штрихкода тут.

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

Кстати, прочитайте про новый корпус кассы.


Скоро я добавлю больше подробностей в описание (или не скоро)

Untitled Document

Умная касса

Нарисовал прототипы интерфейсов для кассовой программы Меркаты версии 2.0, а Ваня Парамонов и Никита Демидов из Форма-4 запилили промышленный дизайн кассы где будут жить все эти новые элементы.

Ребята почти сразу поймали общую форму, но над нижней частью устройства нужно было еще поработать.

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

Несколько зарисовок моих идей

В итоге получилось так

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

А это эскизы упаковки, про неё расскажу отдельно

Макеты с приложением кассы версии 2.0

А так у меня получилось сделать рендеры интерьеров

А тут Антон Еликов проводит одну из первых презентаций гаджета

2017   POS   Мерката
Untitled Document

Товары без штрих-кода

Задача
Упростить поиск и продажу товаров без штрихкода.



Решение

Но всё по порядку.
Прежде в Меркате не было каких-то отдельных способов продажи товаров без штрихкода.

Перед тем как приступить к разработке я причесал интерфейсы текущей версии кассы 1.x.х и сделал прототипы версии 2.0

Кусочек второй версии, для которой уже спроектирован уютный корпус

Идея полоски шорткатов послужила отправной точкой.
А ещё мы решили оставить, привычные многим кассирам, способы продажи товаров без штрихкода (штрих-меню или создание вручную коротких штрихкодов), но пользоваться ими неудобно. Короткие штрих-коды нужно запоминать, а штрих-меню нужно составить, распечатать, поддерживать актуальность ассортимента товаров и делать это нужно на всех кассах в магазине.
Развивая идею шорткатов, я начал с тестирования. Провел опрос среди коллег отдела техподдержки и маркетинга. Ребята 24 часа в сутки получают обратную связь от клиентов Меркаты и ответили на разные вопросы и дали полезные комментарии.

Рекомендации
Первые рабочие прототипы содержали список избранных товаров и категории товаров без штрихкода.

Варианты выглядели вот так

Так

Касса сообщает кассиру что-то вроде: «я посмотрела результаты смены и выяснила, что чаще всего покупают вот это. Их можно добавить в список избранного, что позволит быстрее вносить их в чек, хочешь?

Или вот ещё

Раздел избранного с „умным“ рейтингом и товарами, добавленными вручную.

Тут ещё есть лишние иконки штрихкода и кнопка „Без штрихкода“, цвета ещё пока подобраны случайным образом, а сами ячейки не содержат цены. Не смотря на то, что такой функционал оказался востребованным, релизить его в таком варианте было нельзя. Я переделал этот экран и избавился от попапа, а фичу вынесли на следующий апдейт кассы.

Пресеты
Еще была идея пресетов в карточки товаров. Я нарисовал несколько вариантов, но такой функционал показал себя невостребованным у пользователей и от него отказались.

Пример пресетов

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

Стреловидная форма подсказывает кассиру о последовательности дерева каталога и позволяет сделать поведение элементов интерфейса предсказуемым.

Анимация
В обновленном интерфейсе использовано множество микро анимаций, дающих пользователю обратную связь и различные подсказки.



Что вошло в релиз

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

Внутри категории избранных товаров использован тот же принцип.

А так выглядит работа с каталогом

Обновления уже доступны всем пользователям Меркаты

2017   POS   Мерката
Untitled Document

Касса 1.х.х по вертикали

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

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

2017   POS   Мерката
Untitled Document

Акции и скидки

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

Чтоб акции работали, нужно делать, примерно, так

2017   POS   Акции   Мерката   Скидки
Untitled Document