Оптимизация UX и user flow для приложения рекрутинга SoBes

Всё началось с идеи объединить работодателей и кандидатов в одной удобной платформе, чтобы сделать процесс найма и поиска работы быстрее, проще и прозрачнее. Так появилось SoBes — инновационное hr-tech приложение для iOS и Android.

SoBes стал универсальным инструментом, объединяющим:

• Кандидатов. Они могут откликаться на вакансии, проходить собеседования и выполнять тестовые задания прямо в приложении, не теряя времени на сторонние сервисы.
• Рекрутеров. Приложение помогает оценивать кандидатов с помощью обученных алгоритмов, сокращая этапы отбора. Мы внедрили AI-решения ещё до их массовой популярности, предвосхитив тренды в hr-технологиях.

Цель продукта была амбициозной: минимизировать ресурсы, затрачиваемые на поиск работы и сотрудников, сделать процесс прозрачным и удобным, а коммуникацию между сторонами — эффективной и комфортной.

После трёх месяцев тестирования на реальных пользователях SoBes показал впечатляющие результаты:

• 1 530 пользователей зарегистрировались в приложении.
• 54,3% прошли тестовые задания и интервью, подтверждая удобство интеграции этих этапов в цифровой формат.
• 64,1% пользователей оценили навигацию как комфортную и интуитивно понятную.
• 58,7% кандидатов отметили, что процесс собеседований был для них «очень лёгким».

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

Проблема низкого Retention Rate среди HR-специалистов в SoBes достигла критической отметки — всего 10% вместо целевых 97%. Причина оказалась в очевидном, но часто упускаемом аспекте: мобильный формат попросту не подходил под сложные задачи, с которыми HR-ы сталкиваются ежедневно.

Аудит показал, что неудобство работы с мобильного устройства стало основной причиной оттока пользователей.

1. Неподходящий форм-фактор. Экранный ввод, управление массивами данных и работа с большим объёмом информации оказались чрезмерно сложными на мобильных устройствах.
2. Ограниченный экран. Отображение резюме, списков кандидатов и отчётов на маленьком экране не только неудобно, но и снижает продуктивность.
3. Навигация. Мобильные жесты и мелкие кнопки затрудняют взаимодействие с данными.
4. Многозадачность. HR-ы часто переключаются между окнами и приложениями — то, что на мобильных устройствах реализовано с трудностями, а для десктопа является стандартом.

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

Если кто-то думает, что адаптация интерфейса для десктопа — это просто растянуть макет и немного «подправить»… удачи)))

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

Что мы учли при адаптации?

1. Размер рабочей области: масштаб решает. Мобильные приложения живут в мире компактных экранов, где минимализм не прихоть, а необходимость. Все ключевые функции сосредоточены в нескольких тапах, а дизайн стремится быть максимально «воздушным». С десктопом всё иначе. Большой экран позволяет отображать сразу много информации, включая сложные интерфейсы, многоуровневые меню и панели управления. Мы переработали макет так, чтобы эффективно использовать горизонтальное пространство, добавив сайдбары, дополнительные вкладки и инструменты.
2. Управление вниманием: сложность против концентрации. На мобильных устройствах пользователи обычно сосредоточены на одной задаче, что упрощает управление вниманием. Десктоп же предполагает работу с несколькими задачами одновременно, что требует гибкого подхода. Мы использовали визуальное зонирование и акценты для выделения приоритетных зон, многоуровневые элементы навигации, удобные панели инструментов, которые всегда под рукой.
3. Вертикальный скролл VS горизонтальное пространство. Пользователи мобильных устройств привыкли к вертикальной прокрутке, а важная информация стабильно размещается в верхней части экрана. На десктопе основной фокус переносится на горизонтальное пространство, что позволяет использовать сайдбары для дополнительных функций, горизонтальные меню с множеством уровней, гибридный подход, где ключевая информация остаётся доступной на экране, а вспомогательная — организована в навигационных панелях.
4. Интерфейс: курсор против пальцев. Мобильные интерфейсы ориентированы на управление пальцами: крупные кнопки, зоны для тапа, минималистичный дизайн. На десктопе пользователь работает мышкой, что позволяет использовать более детализированные элементы, тонкие настройки и сложные схемы управления, мелкие кликабельные области, которые не мешают общему восприятию интерфейса.
5. Микроотклики: ховеры и тултипы вместо вибрации. Мобильные приложения нативно взаимодействуют с пользователем через вибрацию, звуки и тактильные отклики.

И ещё кое-что: технические стандарты и привычки. Мы опирались на общепринятые паттерны разработки десктопов, включая размеры областей, стандартные элементы управления и привычки пользователей. Всё это позволило сделать интерфейс не только красивым, но и интуитивно понятным.

Мы знаем, что вы ждали результата, а не рассказов о том, как мы «мастерски» переписали юзер флоу. Но давайте отдадим должное работе UX-инженеров и копирайтеров, которые бережно и кропотливо адаптировали мобильный опыт для десктопа.

Команда прошла полный цикл проектирования:

1. Визуализировали юзер флоу. Мы продумали все маршруты пользователя: от первого цифрового касания с SoBes до выполнения цели, детализировав каждый шаг и взаимодействие.
2. Провели инвентаризацию контента. Не просто перенесли информацию, а перепроверили её актуальность, переработали структуру и удалили «лишний багаж».
3. Создали карту сервиса. Схемы всех разделов и подразделов SoBes обеспечили системное понимание, как организовать логику взаимодействий.
4. Кластеризировали информацию. Логические группы позволили пользователям не только предугадывать, где находится нужный функционал, но и облегчить навигацию через подсознательные паттерны. Это словно интерфейс, который понимает вас ещё до того, как вы осознали, что хотите.
5. Прототипировали ключевые страницы. Высокодетализированные прототипы стали первым шагом к визуализации, а затем и тестированию структуры сервиса.
6. Сделали прототипы кликабельными. Тестируемый интерфейс позволил нам получить раннюю обратную связь и отшлифовать продукт до идеала.

Результат: 48 интерактивных прототипов, готовых к UI-дизайну. Эти прототипы не просто демонстрируют навигацию, а раскрывают весь путь пользователя от первого клика до достижения цели. Они созданы, чтобы тестировать, улучшать и дорабатывать на реальных сценариях, минимизируя любые недочёты перед внедрением UI.

На мобильной версии SoBes стартовый экран был предельно лаконичным, сводясь к трём основным функциям:

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

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

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

• Подробная статистика прогресса аккаунта. На экране отображается визуальная динамика эффективности HR-активностей. Графики, диаграммы и тренды помогают анализировать данные за любой период.
• Сводка эффективности поиска кандидатов. Добавили выбор периода, чтобы HR-ы могли видеть эффективность за день, неделю, месяц или кастомный интервал.
• Готовые шаблоны тестовых заданий и сценариев собеседований. Функция быстрого создания новых шаблонов помогает рекрутерам экономить время и стандартировать процесс найма.
• Отображение даты и времени. Акцент на ключевых временных ориентирах фокусирует внимание HR-ов и упрощает планирование.
• Уведомления. Интегрированы прямо на стартовом экране, чтобы HR-ы не пропустили важные события, такие как новые отклики, изменения статуса кандидатов или напоминания.
• Быстрый переход к чату с техподдержкой. Теперь решение любых вопросов доступно буквально в один клик.

Стартовый экран сохранил простоту, характерную для SoBes, но стал в разы функциональнее. Все новые элементы органично вписались в интерфейс благодаря грамотному визуальному зонированию, использованию горизонтального пространства для распределения данных и инструментов и минималистичному подходу в оформлении, который упрощает навигацию, несмотря на увеличение функционала.

Мобильная версия SoBes изначально имела компактное меню на нижней панели навигации, сосредоточенное на трёх основных функциях:

• Главная. С доступом к функции публикации вакансий.
• Отклики. С разбивкой кандидатов по категориям (на рассмотрении, отказ, приглашённые).
• Профиль. Где собраны настройки, чёрный список кандидатов и информация об аккаунте.

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

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

1. Раздробили три направления на подкатегории. Теперь каждое из направлений («Главная», «Отклики», «Профиль») разбито на мелкие подразделы, что позволяет HR-ам быстро находить нужную функцию.
2. Сократили количество кликов для выполнения задач. Каждая функция стала доступнее, что сокращает время на переходы между разделами.
3. Визуально выделили меню. Меню на десктопе стало боковым и занимает минимальное пространство экрана, при этом всегда остаётся под рукой. Это позволяет эффективно использовать горизонтальное пространство и минимизировать когнитивную нагрузку.
4. Сохранили привычный функционал. Ключевые элементы мобильного меню (например, настройки или публикация вакансий) остались на своих местах, чтобы пользователи могли интуитивно понять, где искать знакомые функции.

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

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

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

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

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

На десктопе HR может одновременно:

• Открыть несколько окон сервиса (например, вакансия и статистика).
• Сравнивать различные вакансии.
• Вносить изменения без необходимости перезагрузки или повторного ввода данных.

Еще мы добавили мощный инструмент редактирования текста для описаний вакансий. Теперь описание вакансии:

• Не давит сплошным текстовым «полотном».
• Структурируется с помощью удобных инструментов: заголовки, списки, акценты, цитаты.
• Выделяет ключевые смыслы и преимущества с помощью простых инструментов форматирования.

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

Десктопная версия SoBes стала настоящим апгрейдом для HR-ов:

• Пользователь получает полный контроль над процессом создания вакансий.
• Работа становится более удобной за счёт возможности переключаться между задачами.
• Описание вакансий выглядит структурированным, что делает предложения понятнее и привлекательнее для кандидатов.

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

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

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

Это не только разгружает экран, но и позволяет HR-ам сосредотачиваться на конкретных задачах без визуального хаоса.

Вместо одного сплошного списка все вопросы теперь аккуратно организованы по темам и категориям. Эта структура помогает HR-ам быстрее ориентироваться и легко находить нужные разделы. Мы добавили выделенный интерфейс для работы с отдельным вопросом. Теперь HR может:

• Выбирать тип вопроса из удобного выпадающего меню.
• Добавлять и редактировать варианты ответов в интуитивно понятной панели.
• Настраивать параметры вопросов (например, обязательность ответа) без лишних кликов.

На десктопе процесс создания шаблонов тестовых и собеседований в SoBes стал структурированным, интуитивным, эффективным. Теперь это не просто инструмент для работы, а настоящий помощник, который позволяет HR-ам сосредоточиться на качестве, а не на преодолении интерфейсных ограничений.

В мобильной версии SoBes процесс собеседования кандидата был разделён на последовательные шаги, что делало его строгим, линейным и подходящим для небольшого экрана. Пользователи проходили через чёткую структуру:

1. Предварительная оценка кандидата.
2. Анализ результатов собеседования.
3. Оценка резюме.
4. Принятие итогового решения.

Этот подход был логичным для приложения, где ограниченное пространство экрана требовало строгой последовательности. Но на десктопе мы решили иначе: больше информации, больше гибкости, меньше ограничений.

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

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

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

Финальное решение HR принимает в один клик, основываясь на предоставленных данных. Всё прозрачно и понятно, что минимизирует вероятность ошибок и упрощает процесс работы.

Десктопная версия SoBes:

• Убирает барьеры в виде линейной навигации и шагов.
• Позволяет HR-ам видеть весь процесс собеседования как на ладони.
• Сокращает время принятия решений за счёт структурированных и визуально выделенных данных.

Теперь собеседование кандидата — это не утомительный процесс, а комфортный и чёткий рабочий инструмент, который помогает HR-ам сосредоточиться на главном.