национальный каталог

Государственная система для обязательной регистрации товаров предпринимателями Республики Казахстан

2019

Дизайн интерфейсов

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

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

продукт

👨‍💼 Производители/импортеры 🏙️ Магазины

аудитория

Продукт был спроектирован без участия дизайнеров т.е. разработчиками. В результате пользовательский опыт был плохо проработан. Пользователи часто писали в поддержку с жалобами на работу различного функционала. Чтобы понять общую картину удовлетворенности продуктом, компания провела опросник CSI, индекс которого был равен 24% с большим количеством негативных комментариев.

проблема

повысить CSI, улучшив пользовательский опыт;
спроектировать новый функционал в продукте;
сделать современный дизайн на базе готовой дизайн-системы;
автоматизировать расчеты компании с перевозчиками и в перспективе перейти к работе с электронными транспортными накладными с использованием усиленной квалифицированной электронной подписи (УКЭП);
увеличить скорость доставки груза со склада дистрибьютора в розничное звено.

таким образом, компания обратилась со следующими задачами:

Сбор требований

UX-аудит

Event storming

Тестирование

Прототипирование

CJM

Плотная работа с бизнес-аналитиком, который рассказал про бизнес-процесс и бизнес-требования.

Проведен UX-аудит для поиска дополнительных проблем.

Проработала новый путь пользователя.

Чтобы подтвердить выявленные уязвимые места, было проведено юзабилити-тестирование.

Готовила интерактивные прототипы и сценарии для юзабилити-тестирования. После тестирования вносила изменения и ходила на доп. тестирования, если требовалось.

После тестирования проработала CJM, чтобы лучше понять пользователя и сгенерировать идеи по улучшению.

процесс

Дизайн

Передача макетов в разработку.

В процессе погружения в продукт и проведения UX-аудита были выявлены дополнительные проблемы, которые потенциально могли ухудшить пользовательский опыт, например:

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

UX-аудит

После UX-аудита было проведено usability тестирование на 5 предпринимателях.

тестирование

📌 После тестирования были выявлены и зафиксированы повторяющееся ошибки.

Только одна из гипотез не подтвердилась: обязательные поля формы непонятны для пользователя.

Некоторые идеи, которые были сформированы в CJM для улучшения пользовательского опыта:

сделать «Членство GS1» отдельным разделом;
добавить возможность «Подать заявку в GS1» и в разделе «Товары»;
разбить на шаги регистрацию пользователя и убрать разделы, которые не влияют на регистрацию пользователя;
переименовать основную кнопку в разделе «Товары»;
разделить разделы «Статистика» и «Настройка профиля» и т.д.

CJM

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

Event Storming

Компания понимала проблему неконсистентности интерфейса и для ее решения приобрела дизайн-систему, на компонентах которой проектировались итоговые макеты.

дизайн

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

навигация

Было

Стало

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

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

Регистрация

Было

Стало

Чтобы снизить когнитивную нагрузку на пользователя — разделили карточку товара на 3 смысловых этапа, где загрузка фото будет одним из этапов. Добавили необходимый для пользователя функционал и информацию:

drag&drop для добавления фото;
возможность изменения порядка фото в слайдере;
возможность просмотра фото в полном размере;
подсказку с требованиями к загружаемым фото.

Карточка товара

Было

Стало

результат

🎯 После редизайна был повторно запущен опросник CSI. Процент удовлетворенности вырос с 24% до 56%. К сожалению, негативные комментарии еще остались, но они касаются разработки и со стороны дизайна на них не повлиять

🎯 Спроектировала новые разделы, такие как: дашборд, статистика

🎯 Сократила среднее время регистрации пользователя с 13 мин до 6 мин.

🎯 Создала интерфейс на основе новой дизайн-системы

🎯 Дополнила дизайн-систему новыми компонентами

egorova.oks@gmail.com