Продуктовый дизайнер
Продуктовый дизайнер
Hello, Doc!
Спроектировал MVP версию дизайна CRM с нуля для клиник и врачей. Перенес часть функционала из мобильного приложения и добавили для клиник возможность принимать заказы на анализы. Собрал дизайн-систему в минимальном объёме
2024–2025
MedTech
О проекте
Hello, Doc! Work — сервис для медработников по работе с пациентами. Врач может провести консультацию и затем отправить авторский чекап анализов или подборку с лекарствами. В сервисе есть бонусная программа, на которой зарабатывают медработники. Ещё приложением активно пользуются нутрициологи, фитнес-тренеры и блогеры. У пациентов есть отдельное приложение Hello, Doc! Всё для здоровья.
До моего прихода весь функционал был в двух приложениях: для врачей и пациентов. Со стороны бизнеса появился запрос на разработку CRM для врачей и клиник.
Под эту задачу искали нового дизайнера. После трудоустройства я приступил к проектированию CRM. Нужно было перенести основной функционал из приложения для врачей и разработать новый для клиник.
Задача
Спроектировать дизайн CRM-системы MVP версии для клиник и профессионалов (врачи, фитнес-тренеры, нутрициологи и другие)
Этапы
Декомпозировал задачи с продактом
Провёл исследования
Составил юзер флоу по CRM для каждого раздела
Сделал low-fidelity (черновой) прототип
Разработал первую версию дизайна
Проводил презентации стейкхолдерам, на основе фидбека вносил правки
Утвердили финальную версию
Подготовил макеты для разработчиков
Собрал дизайн-систему в фигме для CRM
Провел фронт-ревью макетов
Запустили CRM в прод
Исследования
Перед проектированием CRM изучал конкурентов и другие B2B сервисы. CRM проектировалась с нуля, надо было заложить паттерны навигации и взять лучшие практики. Для каждого сервиса собрал нужные мне флоу.
Изучил функционал мобильного приложения, который надо было перенести.
Перед разработкой функционала для клиник по сбору биоматериалов был звонок с представителем лаборатории. Нам рассказали про возможности личного кабинета. С продактом изучал другие CRM, т.к. все они закрытые
Выводы
Узнал об ограничениях в дизайне и разработке для раздела по взятию биоматериалов
Профессионалы хотят работать со своими клиентами и пациентами через CRM, т.к. с телефона не всегда удобно
CRM позволит расширить сотрудничество с клиниками
Заложил паттерны навигации внутри разделов
Добавление сотрудников и услуг в Yclients. В CRM надо было сделать приглашение пациентов
Раздел анализов у косвенного конкурента Labstory
Ограничения
Часть функционала уже была реализована в мобильном приложении. Надо было перенести в CRM и успеть в срок. Время было ограничено
Разработка дизайна
Работал совместно с продактом и затем презентовали макеты стейкхолдерам. После демо вносились правки. Итерационно двигались к финальной версии
Юзер-флоу для взятия биоматериалов в клинике
Прототип раздела Заказы
Финальный дизайн
Пользователи
На странице отображаются все пациенты врача или клиники. Можно пригласить новых и посмотреть нужного пациента.
Из-за юридических ограничений нельзя использовать слова «Врач» и «Пациент»
Изначально хотели сделать больше функционала: чат с пациентами, онлайн запись, создание разных ролей, баланс клиники. Для более быстрого запуска решили отказаться от части функционала и запустить наиболее важные разделы.
Первая версия раздела Пользователи
Финальный вариант
Взятие биоматериала
Администратор клиники может найти новую заявку на взятие биоматериала и затем подтвердить.
На экране можно ознакомиться с данными пациента и пробирками, которые нужны для взятия.
Для удобства медсестры добавлена преаналитика — полезная информация по взятию биоматериала
Другие экраны
Заказы анализов и подборки препаратов, которые создали врачи для своих пациентов
Экран с ошибкой
Дизайн-система
На этапе разработки дизайна не было фронт-разработчика. Он присоединился к команде через полтора месяца после моего прихода. Компоненты и стили были только для мобильного приложения.
Для ускорения дальнейшей работы решил собрать дизайн-систему с нуля в фигме на атомарном подходе для CRM.
Сначала сделал токены для цветов и стили для текстов. Потом добавил базовые компоненты: кнопки, чекбоксы, тултипы, бейджи, дропдауны и др. На их основе собирал компоненты для разделов.
Дальнейшие планы — составление документации, описание примеров использование, добавление новых компонентов и интеграция с фронтом.
Цвета и типографика
Из-за сжатых сроков компоненты собирал по мере необходимости. Начал с базовых — кнопки, инпуты, иконки, чекбоксы и другие.
Кнопка в дизайн-системе. Есть мастер-компонент и затем настроил варианты для всех состояний
Итоги
Подготовил макеты в срок
Собрал дизайн-систему в минимальном объёме
Провел фронт-ревью
Довел проект до запуска
Для бизнеса
Компания запустила новый продукт. После релиза начали собирать фидбек
Закрыли потребность пользователей в CRM
Стало больше точек покрытия для сдачи биоматериалов для пользователей Hello, Doc благодаря CRM. Бизнес заключает договор с клиникой и пользователь может там сдать анализы
Made on
Tilda