Salesman

Контекст

О проекте

Salesman – внутренний B2B-продукт для отдела продаж. До этого момента вся работа строилась вокруг Telegram-чатов и Google-таблиц.

Боль и страдания бизнеса и пользователей:

• Потеря данных: статусы сделок и задачи «тонули» в общей ленте, информация терялась
• Непрозрачность: руководитель тратил до 30 минут в день, чтобы вручную собрать статусы по всей команде, не видя реальной картины
• Снижение эффективности: менеджеры отвлекались от продаж на поиск нужной информации и ручной ввод данных

Задача

Что нужно было решить

• Сделать интерфейс понятным для ежедневного использования без длинного онбординга
• Разделить личные уведомления, командные новости и рабочие задачи без перегруза
• Спроектировать UI-kit для масштабирования новых модулей
• Подготовить макеты к разработке: состояния, отступы, компоненты в Figma
• Снизить время руководителя на сбор отчётов с 30 до 5 минут в день (цель, основанная на данных из интервью)

Процесс

Как работала

1. 01

   Глубинные интервью и CJM

   Ключевой инсайд:

   Самая сильная боль была не в интерфейсе, а в отсутствии прозрачности. Руководитель тратил часы, чтобы вручную собрать статусы, а менеджеры чувствовали, что их работа «пропадает в чёрной дыре». Это убивало мотивацию и снижало эффективность.

   На основе инсайтов я построила CJM (карту пути клиента), которая наглядно показала команде, где именно и почему продукт «ломается»

2. 02

   Гиптеза

   «Если мы сделаем статусы задач и прогресс по сделкам прозрачными для всех членов команды, то снизим тревожность руководителя, повысим чувство контроля у менеджеров и, как следствие, увеличим скорость закрытия сделок»

3. 03

   Информационная архитектура

   Переработала структуру, чётко разделив личные уведомления, командные задачи и общую ленту.

   Ключевые сценарии:

   Лента новостей: для командных обновлений и публичных достижений. Задачи: прозрачный список с дедлайнами, статусами и ответственным. Карточка клиента: быстрый доступ ко всей истории взаимодействия

4. 04

   UI-kit и визуальный язык

   Типографика, цвета статусов, карточки задач, аватары, бейджи – компоненты в Figma с auto-layout и variants для быстрой сборки экранов

5. 05

   Финальные экраны и handoff

   Отрисовала ключевые состояния: пустая лента, новая задача, фильтры, ошибка сети. Передала спецификации разработчикам через Dev Mode

Решение

Ключевые экраны

Ниже – основные экраны приложения и компоненты. Полная подборка визуалов и детали процесса – в кейсе на Behance.

Итог

Результат

Собрала согласованный UI-kit и сценарии для MVP. Команда получила понятную структуру приложения и макеты, готовые к вёрстке. Интерфейс ориентирован на скорость ежедневных действий – без лишних шагов и визуального шума. Этот проект наглядно показал мне, как перевод скрытых рабочих процессов в единый цифровой интерфейс напрямую влияет на эффективность бизнеса

Смотреть полный кейс на Behance →