Цифровая экосистема для AI-управления финансами для компании «Нескучные финансы»
Наша команда работала над частью IT-платформы: контур «Подбор финансового директора под запрос клиента» и часть контура «Финансовый директор для малого и среднего бизнеса».
Содержание кейса
Главное о кейсе
#1
Спроектировали UX для IT-платформы Нескучных финансов, который подстраивается под паттерны поведения пользователей. Интерфейсы учитывают UX других сервисов, в которых работают финансовые директора (Google Sheets, Финтабло), и содержат похожие решения.
#2
Разработали дизайн-систему сервиса (больше 685 компонентов и 120 стилей). Решили проблему с отставанием дизайна от разработки за счёт управления ресурсами. Дизайн стал опережать разработку на один крупный релиз вперёд.
#3
Снизили трудозатраты инхаус-команды разработки на реализацию сценариев за счёт:
- дизайн-системы, интегрированной с фронтом;
- подбора готовых компонентов дизайн-системы из библиотек, совместимых с React;
- тестирования динамических прототипов на пользователях до передачи дизайна в разработку (юзабилити-тестирования);
- проектирования интерфейсов по JTBD (подход, при котором на первое место ставится «работа» пользователя).
#4
Сократили time to market (TTM) продукта за счёт предварительного тестирования прототипов сервиса. Разработчикам уходили проверенные решения, которые закрывают «работу» пользователей (JTBD).
⭐️ Tagline Awards 2023 — бронза в номинации «Лучший дизайн интранета», шорт-лист номинации «Лучшее юзабилити». Кейс на сайте премии.
⭐️Workspace Digital Awards 2024 — 1 место в номинации «Сайты / Финансы, страхование и инвестиции». Кейс на сайте премии.
А теперь обо всём по порядку.
О клиенте
Нескучные финансы (НФ) представляет собой тренд западного финтеха — Virtual CFO (финансовый директор на аутсорсе).
На 2023 год в компании:
- 1000+ клиентов из более 20 стран: России, Чехии, Беларуси, Казахстана, ОЭА и др.
- 500+ финансовых директоров, которые выстраивают управленческий учёт в компаниях клиентов. Они также живут в разных частях России, Швейцарии, Беларуси, Казахстана и в других странах.
Своим клиентам НФ помогает сделать бизнес управляемым, не попадать в кассовые разрывы и долги, наладить финансовое планирование и найти точки роста прибыли. Как результат, компании клиентов растут и получают финансовую стабильность, сотрудники получают стабильные выплаты, а также открываются новые вакансии.
Финансовым директорам НФ предоставляет свою технологию управленческого учёта, инфраструктуру для предоставления услуг, профессиональное обучение, наставников и менторов, обеспечивает клиентами.
О проекте
До начала разработки собственного продукта у компании была информационная система, построенная на множестве связанных между собой гугл-таблиц. Со временем инфраструктура начала давать сбои из-за большого количества данных и участников (более 1000 пользователей единовременно). Плюс за время работы в таблицах был выявлен ряд узких мест, которые мешали росту и развитию компании.
НФ вошла в процесс цифровой трансформации, чтобы масштабироваться до 250 000 клиентов без потери качества предоставляемых услуг. Решением стала разработка цифровой экосистемы, которая позволит масштабироваться до необходимого количества клиентов с поэтапным устранением узких горлышек текущей модели.
Собственная цифровая экосистема автоматизирует процесс ведения финансового учёта компаний-клиентов, обеспечивая:
- высокое качество услуг вне зависимости от квалификации финансовых директоров;
- прозрачность ведения учёта и контроль за работой финансиста;
- быстрое получение статистики по финансовому состоянию компании-клиента без отрыва от текущей работы.
Платформа разрабатывается на основе технологий Big Data и машинного обучения. Это позволяет автоматизировать процессы принятия решений и анализа данных, такие как прогнозирование финансовых показателей и определение оптимальной стратегии управления финансами компаний-клиентов.
Задача
У клиента были ограниченные сроки на разработку дизайна: он нужен был «ещё вчера». На момент обращения к нам команда НФ уже настраивала среду разработки и прорабатывала архитектуру продукта, а дизайна и дизайнеров в команде не было.
По требованию клиента разработка фронтовой части должна вестись по дизайн-системе с использованием готовых компонентов, совместимых с React, чтобы снизить расходы на разработку и собирать модули продукта в едином стиле параллельно. При этом дизайн-системы не было, её требовалось разработать.
Ещё одним требованием по части дизайна была узнаваемость IT-платформы и соответствие брендбуку компании.
В итоге нам предстояло:
- спроектировать UX IT-платформы для двух контуров;
- создать дизайн-систему сервиса, подготовить дизайн-макеты;
- выйти на уровень, когда дизайн опережает разработку на один крупный релиз.
Стадия дискавери была выполнена Дарьей Ямной — Head of Product компании НФ. Результаты исследования стали основой для проектирования и дизайна контуров, сфокусировали работу и функционал интерфейса на достижении целевых метрик.
Предпроектная аналитика
Для начала выделили основные роли, которые будут работать на платформе, и составили для каждой из них перечень сценариев. Цель — конкретизировать запрос заказчика и синхронизироваться в ожиданиях.
Для сложных сценариев разрабатывали и проговаривали с бизнес-аналитиком клиента User flow. Это помогало найти «тонкие» моменты в нашем понимании процессов и избежать проблем при релизе.
Отдельно прописывали:
- проблемы, которые существуют сейчас;
- цель внедрения сценария;
- критерии успеха, по которому будем судить о результате.
После согласования User Flow описывали информационную архитектуру сценария — перечисляли блоки и их наполнение. Это помогло показать клиенту каркас нового блока и избежать появления новых сценариев.
Проектируя сценарии и обсуждая их с клиентом, мы заметили, что он часто использует специальные термины, а также следит за тем, чтобы новая система смогла интегрироваться в работу с уже существующими инструментами — имела похожие формулировки и обозначения.
Чтобы соблюдать связность элементов, начали писать редполитику — правила коммуникации с пользователем. Например, описали правила названия форм. Документ помог соблюсти консистентность в текстах на всей платформе.
В процессе работы над сервисами и системами формируется много артефактов: записи и протоколы созвонов, документы, референсы, бэклог и многое другое. Для таких проектов мы создаём отдельную базу знаний. Для сбора данных использовали Notion. Рассортировали все данные по блокам в системе и пометили цветом: готово (зелёный), в работе (оранжевый), бэклог (красный или серый — в зависимости от того, приступали уже к задаче или нет).
Проектирование
В работе над проектом придерживались подхода CRUDL (Create — Read — Update — Delete — List, или Создание — Чтение — Редактирование — Удаление — Список).
Например, спроектировали карточку профиля пользователя и делаем варианты, как она выглядит в списке, когда создаётся, просматривается, редактируется, удаляется. Даже таблица проходила цикл CRUDL. Каждая ячейка наполнялась информацией, просматривалась, редактировалась, удалялась, занимала своё место в общем списке. Всё спроектированное тестировалось на финдиректорах. И только после этого уходило в дизайн.
В проекте используются многофункциональные таблицы с разными типами ячеек. Для каждой из них мы прописали правила поведения: что будет с ячейкой по ховеру, по нажатию, при редактировании, как будут отрабатываться ошибки.
Юзабилити-тестирование
После завершения основного этапа проектирования вместе с клиентом приняли решение проверить интерфейсы на пользователях. Тестирование даёт понимание сильных и слабых сторон используемых решений, а также показывает сценарии, которые нужно доработать в соответствии с выявленными проблемами.
Выборка
Для тестирования выбрали раздел «Структура». В нём будет работать 3 типа аудитории: финансовый директор, его руководитель (или наставник) и HR. У сотрудников существуют как пересекающиеся задачи, так и специфические.
Пример общей задачи: «Смотреть структуру компании, кто в какой группе работает, кто руководитель».
Пример специфической задачи: «Открыть вакансию» или «Назначить на роль наставника».
Так как существуют пересекающиеся задачи и мы находились в условиях ограниченных сроков, то в качестве респондентов привлекли по 3 сотрудника на 1 тип аудитории.
3 респондента — это минимальное количество респондентов, которое позволяет получить репрезентативные данные в качественном исследовании.
Таким образом:
- общие задачи были протестированы на 9 респондентах;
- специфические задачи протестированы на 6 респондентах.
Тестирование
Перед нами стояли задачи:
- понять, помогает ли интерфейс достигать целей;
- собрать информацию, как улучшить интерфейс перед передачей его в дизайн.
В качестве формата мы выбрали удалённое модерируемое юзабилити-тестирование, так как сотрудники компании находятся в разных уголках страны, иногда даже за её пределами. Респондент открывал ссылку с интерактивным прототипом в Figma и выполнял задание.
Что было важно зафиксировать на тесте:
- Результативность. Справился ли респондент с задачей.
- Эффективность. Какие именно трудности встречались.
- Особенности в поведении респондентов.
- Какие эмоции и вопросы возникают.
Оценивали продукт с помощью метода «мысли вслух» и измеряя субъективную удовлетворенность при помощи SEQ (Single Ease Question). Пользователю предлагалось после каждого задания оценить его по шкале от 1 до 5, ответив на вопрос: «Насколько сложно было справиться с этим заданием?». Это помогло увидеть степень критичности ошибки для пользователя.
Метод «мысли вслух» заключается в настройке респондента проговаривать всё, что приходит в голову, — рассуждать вслух, озвучивать любые мысли и воспоминания, задавать вопросы.
Тестирование длилось 3 дня. Каждый день по 3 интервью длительностью около 1 часа.
Перед тем как начать исследование, провели 2 пробных теста на своих коллегах, чтобы проверить работу динамических прототипов. Благодаря такой подготовке исправили все шероховатости и не отвлекали респондентов от выполнения заданий проблемами в работе прототипов.
Анализ
При анализе результатов теста поделили все ответы на 3 категории: плюсы, минусы, идеи — и записали их на стикерах. В сумме получилось 120 стикеров.
Анализ показал, что респонденты чаще понимали интерфейс и предлагали идеи, чем встречали проблемы или не справлялись с заданием. Несмотря на подсчёт количества повторений на стикерах, эти данные не являются статистически значимыми, так как юзабилити-тестирование может сказать только: есть проблема или нет. Но это помогло понять, какие проблемы наиболее серьёзны, а решение каких можно оставить на будущее.
Для презентации результатов клиенту мы наложили стикеры на прототип и показали критичность проблемы. Клиент присутствовал практически на каждом сеансе тестирования, поэтому мог легко ориентироваться в результатах и понимал важность каждого стикера.
После внесения правок провели ещё одно тестирование с руководителем всего направления, чтобы понять, в правильном ли направлении двигаемся.
Оптимизация процесса работы
Для оптимизации времени на разработку прототипов и дизайн-системы подключили двух специалистов, которые работали практически параллельно.
- UX-проектировщик прорабатывал логику и функционал сервиса, проводил тестирования.
- UI-дизайнер создавал и собирал дизайн-систему по согласованным макетам.
Такая синхронизация достигалась за счёт плотной связки специалистов. Помог и тот факт, что они сидели рядом и были постоянно в контексте работы друг друга.
« Это крутое и нестандартное решение, которое показывает хороший результат и ускоряет разработку дизайна »
Дарья Ямная
Дизайн платформы
Сначала изучили материалы, которые были у клиента на брендовой платформе: цвета, шрифты, tone of voice бренда, иллюстрации фирменного гуся.
Далее собрали небольшой мудборд из интерфейсных решений, которые могут использоваться в дизайне. В него же добавили примеры от клиента.
Показали, как могут использоваться фирменные цвета. Например, красный оставляем в лого и важных маркерах, синий используем для кнопок, белый — для фона, чёрный — для текста. Маскота компании — гуся — добавили в уведомления как связь с дружелюбным характером бренда.
Для концепции взяли самый нагруженный экран платформы, чтобы показать в дизайне разные элементы.
При всей сдержанности интерфейса мы старались добавить некоторые дружелюбные моменты. Например, на экране входа разместили гуся и пририсовали ему крылья, как будто он обнимает форму 🙂
Дизайн-система
В ней собрали и описали внешний вид, состояния и поведение всех элементов. На момент передачи дизайн-системы клиенту она содержала 685 компонентов и 120 стилей.
Основу составляют цвета: мы их подобрали и составили описание, в каком случае какой цвет и заливка используются. Это было важно для разработчиков, чтобы правильно настроить элементы. Далее собрали типографику. И уже потом пошли такие организмы, как иконки, кнопки, ячейки. Уникальные элементы, которых не было в дизайн-системе, прорабатывали отдельно.
Функционал платформы
Первый релиз цифровой платформы содержал два ключевых раздела: «Партнёры» (= финансовые директора) и «Клиенты». Задача функционала этих разделов — повлиять на рост ключевых метрик и разгрузить финансовых директоров.
Ниже рассмотрим основные разделы сервиса.
#1. Структура (Сотрудники)
Метрикой «полярной звезды» для «Нескучных финансов» является динамика роста чистой прибыли компании клиентов, которая напрямую зависит от опыта и навыков финансового директора. Поэтому за каждым финдиром закреплены кураторы, наставники, менторы, персональные менеджеры и другие специалисты, которые сопровождают финансового директора и клиента на всех этапах их взаимодействия.
Все финдиры объединены в структуру групп. За счёт этого клиент, подключившись к НФ, получает экспертизу нескольких финансовых директоров высокой квалификации и накопленный опыт решённых кейсов всех клиентов НФ в целом (база знаний).
Раздел в системе выступает хранилищем актуальной информации по всем финансовым директорам и включает такие данные, как регионы и часовые пояса, уровень квалификации, наличие специфических навыков, опыт работы с разными клиентами и продуктами, текущая нагрузка, персональный карьерный трек, прогресс во внутреннем обучении НФ.
#2. Клиенты (Панель распределения клиентов)
Процесс работы у финансового директора с его клиентами похож на водителя в Я.Такси. Как только один пассажир вышел (клиент отключился), водитель (финансовый директор) получает нового. Для этого в системе предусмотрена база клиентов и Панель распределения клиентов, которая даёт понимание о текущей нагрузке финдиректоров, и в ней же есть функционал планируемой загрузки. В нём финансовый директор указывает желаемое количество клиентов и продуктов, которое он хочет вести одновременно.
#3. Вакансии
Количество мест в каждой группе финансовых директоров ограниченно. Поэтому по мере открытия новых групп и высвобождения мест в текущих группах открываются вакантные места. На эти места подключаются новые финансовые директора. Для подключения к НФ финдиры проходят серьёзный отбор по хард- и софт-скилам. Из 4000 откликов проходят около 40 человек. Раздел «Вакансии» спроектирован с целью управления подключениями новых финансовых директоров.
#4. Статистика
НФ необходимо поддерживать баланс между клиентами и финансовыми директорами. Поэтому в режиме реального времени отслеживается выполнение планов по подключениям клиентов и финдиров, чтобы принимать оперативные решения по корректировкам. На данных с этого раздела обучаются нейросети. Чтобы поддерживать баланс в автоматическом режиме.
Результат
В итоге спроектированный процесс «Подбора финдиров под запрос клиентов» дал следующие результаты:
1. Рост показателя «Норма управляемости». Высвободили 25 часов времени в месяц участников процесса: кураторов, администраторов, наставников и других специалистов.
2. Годовой рост показателя «Retention финансовых директоров» на 10%. Теперь каждый финдир гибко управляет своей нагрузкой, а следовательно, доходом. Сокращено время ожидания клиента, в фокусе внимания — потребности финдиректоров.
3. Годовой рост показателя «Retention клиентов» от 6 до 30% в зависимости от отрасли бизнеса. Достигается за счёт более точного подбора финдира под клиента, сокращения времени на подключение специалиста.
Минимальный экономический эффект на текущем количестве финансовых директоров: 9 млн чистой прибыли в год. Чем больше количество финдиров, тем выше этот эффект.