Все проекты

Admin Kostaff

HR CRM для подбора IT- и digital-специалистов: база кандидатов, вакансии с ИИ-разбором текста, исполнители от компаний-партнёров и публичный сервис анализа резюме.

Роль

Продуктовый UX/UI-дизайнер

Направление

HR CRM с ИИ

Пользователи

Рекрутеры и кандидаты

Масштаб

290 экранов

Пробел или Enter — остановить или воспроизвести видео.

Admin Kostaff: единое пространство для работы с кандидатами.

С чего всё начиналось

Заказчику нужна была единая HR CRM для подбора IT- и digital-специалистов: база кандидатов, вакансии, специалисты от компаний-партнёров и ИИ-анализ резюме.

На входе были бриф, ТЗ и устные пожелания заказчика.

Моя роль

Вёл проект один как продуктовый UX/UI-дизайнер — от брифа и ТЗ до финальных макетов. Сам провёл анализ конкурентов, собрал структуру и сценарии, прототипы, интерфейсы рабочей панели и ИИ-отчёта, публичный сервис анализа резюме с версией для телефона и UI‑кит.

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

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

Связать кандидатов, вакансии и исполнителей: от вакансии — к подходящим людям, от человека — к источникам его резюме.

Встроить ИИ так, чтобы HR видел в нём подсказку, а не готовую оценку человека.

Как была выстроена работа

Пять этапов — от брифа заказчика до согласованных макетов и описания для разработки.

  1. Бриф и ТЗ

    Разобрал, кто работает в системе и какие нужны разделы.

  2. Структура и сценарии

    Разделы продукта и сценарии работы с ними.

  3. Прототипы

    Согласовал таблицы и карточки ещё до дизайна.

  4. Интерфейсы и ИИ-отчёт

    Рабочая панель, ИИ‑анализ резюме и загрузка CV.

  5. Состояния и UI-кит

    Пустые и ошибочные состояния, UI‑кит и правила.

Задачи и сценарии

Из ТЗ и анализа конкурентов — к структуре: обзор базы, подробная карточка и вакансия как начало подбора.

Два режима работы HR

Сначала HR просматривает базу и сравнивает кандидатов по специализации, грейду, опыту и статусу. Затем изучает конкретного человека: документы, опыт, комментарии и выводы ИИ.

Отсюда главное решение структуры: таблица отвечает за обзор, карточка — за подробности, а ИИ-анализ вынесен в отдельную вкладку.

Вакансия запускает подбор

Вакансия приходит из Telegram-канала через бота или вставляется вручную. Статус «ИИ обработка» запускает разбор текста, и система предлагает кандидатов по специализации.

Статус «Готово к публикации» отправляет вакансию в Telegram-канал. Статусы не только сообщают о состоянии, но и запускают следующий шаг работы.

Задачи и сценарии · 4 решения

Что заложил в решение

Как задачи HR превратились в устройство интерфейса.

Решения

  • Одинаковый порядок столбцов Специализация, грейд, опыт, город и статус стоят на одних местах во всех строках — кандидатов можно сравнивать взглядом.
  • Вкладки внутри карточки Каждый блок сведений открывается отдельно, а не одной длинной формой — HR сразу переходит к нужному.
  • Статус словом, цвет — подсказкой Технические состояния, например ошибка ИИ-обработки, отделены от этапов подбора. Цвет дополняет текст, а не заменяет его.
  • ИИ — подсказка, а не вердикт Анализ резюме показан отдельно от исходных данных: HR сверяет выводы с резюме и готовит вопросы кандидату.

Сценарии описаны для разработки

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

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

Сценарий входа в Figma: шаги, переходы и пояснения для разработки.

Интерфейс

От базы кандидатов — к карточке, вакансиям, исполнителям и публичному сервису анализа резюме.

Таблица: сравнение без открытия карточек

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

В таблице не больше 20 строк, пагинация закреплена внизу — список не превращается в бесконечную ленту.

База кандидатов: характеристики специалистов и статусы работы.

Карточка: вкладки вместо длинной формы

Разделил сведения о кандидате на вкладки: личные данные, о кандидате, навыки и стек, запросы, опыт, похожие кандидаты, комментарии и ИИ-анализ.

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

Карточка кандидата: личные данные, техническая информация и документы.

ИИ-анализ: от меток к вопросам кандидату

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

Метки дают быстрый обзор сильных сторон и пробелов, а текст объясняет выводы и подсказывает, что уточнить у кандидата.

Раздел ИИ-анализа: навыки, наблюдения и рекомендации по кандидату.

Вакансия: от текста к кандидатам

В карточке вакансии хранится полный текст из канала или ручного ввода, статус и ресурс. Вкладки «Выдвинутые кандидаты» и «Подходящие кандидаты» показывают выбор HR и результат подбора.

Во вкладке выдвинутых кандидатов HR указывает партнёра, кандидата в проекте и стоимость — вакансия связывает подбор с работой по проекту.

Вакансия Admin Kostaff: полный текст, статус и вкладки подбора.

Исполнитель: один человек — несколько источников

Специалисты от компаний-партнёров собраны в разделе исполнителей. У одного человека может быть несколько резюме от разных компаний — показал их рядом, с датами добавления и ссылками.

Так HR видит не только запись о человеке, но и то, откуда пришли сведения.

Исполнитель: компании, связанные с одним специалистом, и их резюме.

Публичный сервис: анализ резюме за одно действие

Внешнюю часть продукта построил вокруг одного действия — загрузить резюме и получить отчёт. На первом экране — назначение сервиса и загрузка файла.

Пример отчёта заранее показывает, что получит пользователь. Регистрация объяснена отдельно: она нужна, чтобы хранить проверенные резюме в кабинете. Сервис адаптирован для телефона.

Публичный сервис: загрузка резюме и знакомство с форматом анализа.
Мобильный сервис: пример отчёта и состав анализа.
Мобильный сервис: создание учётной записи.

Другие разделы и состояния

Вакансии, исполнители и вкладки кандидата, вход и профиль — с пустыми и ошибочными состояниями.

Таблица вакансий
Вакансии
Вакансия: выдвинутые кандидаты
Выдвинутые кандидаты
Вакансия: подходящие кандидаты не найдены
Подходящих нет
Таблица исполнителей
Исполнители
Карточка исполнителя
Карточка исполнителя
Кандидат: запросов нет
Запросов нет
Кандидат: похожих кандидатов нет
Похожих нет
Комментарий менеджера о кандидате
Комментарий менеджера
Вход в рабочее пространство
Вход в систему
Вход: неверные данные
Ошибка входа
Вход: забыли пароль
Забыли пароль
Новый пароль не соответствует требованиям
Ошибка нового пароля
Профиль: настройки
Настройки профиля
Профиль: уведомления
Уведомления

Дизайн-система

Компоненты и цветовые токены рабочей панели.

Собрал UI-кит рабочей панели: поля ввода, кнопки, состояния, документацию компонентов и цветовые токены для фонов, элементов и акцентов.

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

Компоненты Admin Kostaff, документация и цветовые токены.

Результат

Спроектировал HR CRM, в которой кандидаты, вакансии и исполнители связаны в одном рабочем пространстве, и публичный сервис анализа резюме.

ИИ-рекомендации повысили точность подбора и сократили ручные действия, когда HR выдвигает кандидатов на вакансию.

В макетах — 290 экранов и 422 пояснения к поведению интерфейса: разработка получила готовые правила для каждого раздела.

В 3 раза быстрее

HR-специалисты обрабатывают кандидата в новой панели.

80 % карточек

Заполняются автоматически: данные из резюме сами попадают в поля кандидата.

Другие проекты