От функциональности к эмоциональности: как проходит редизайн hh.ru

Пользователи привыкли воспринимать hh.ru как удобный сервис для поиска вакансий и подбора сотрудников. Но компания уже давно вышла за рамки известного всем джобборда и сейчас транслирует другие идеи. Одна из них — желание быть ближе к аудитории через дружелюбный дизайн. Как редизайн отражает новое позиционирование компании и каким станет сайт совсем скоро, рассказывает Михаил Пономаренко, дизайн-директор hh.ru.

Джобборд не обновлялся давно: последнее изменение интерфейса было в 2018 году. Тогда меняли шапку сервиса, но это сложно назвать серьёзным переосмыслением дизайна.

Главная причина редизайна — желание выйти за рамки привычного джобборда. Мы решили поменять формат коммуникации с пользователями. И тот дизайн, что был с нами долгие годы, уже не отражал стратегической цели и ценностей hh.ru.

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

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

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

Карта пути пользователя (UJM) продукта hh.ru

Первое, что мы сделали, — изучили User Flow и сложившиеся паттерны поведения пользователей. Это дало понимание, какие элементы интерфейса нужно улучшить в первую очередь. Сначала сфокусировались на основном флоу джобборда. Там весь функционал hh.ru: от поиска работы до общения с работодателями. На основе данных мы сформировали целевое видение продукта — то, каким он должен стать через пять лет.

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

В результате мы с командой собрали несколько разных концепций и затем выбрали из них одну под рабочим названием «Магритт». Остановились на ней по нескольким критериям.

Сначала провели UX-тесты, где пользователи сравнили новые идеи с текущим интерфейсом. Затем оценили, насколько концепция подходит для стратегии бренда и вписывается в бюджет. Финальное слово осталось за командой — каждый голосовал и выбирал, с чем хотел бы работать.

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

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

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

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

Элементы интерфейса приобрели более мягкие черты, это коснулось всех компонентов дизайн-системы: атомов, палитры цветов, паттернов поведения компонентов и страниц. Это дало ощущение «дружелюбности» в look & feel всего продукта.

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

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

Мы изменили лого, палитру, tone of voice коммуникации в бренде и продукте, а также стилистику иллюстраций. Эти обновления «выкатываем» постепенно — смотрим в общей картине и дорабатываем, если нужно. Изменения уже доступны на hh.ru, расскажем о них подробнее.

Логотип. Мы отказались от агрессивного красного и выбрали более дружелюбный оттенок. Визуально это не так заметно, но прекрасно работает на уровне ощущений. Шайба логотипа сохранилась, но теперь она несёт другой смысл. Вместе с «увесистой» типографикой она выглядит более выразительно и отражает наш ToV.

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

Иллюстрации. Сервис hh.ru стал более человечным, в том числе благодаря новым иллюстрациям. Мы создали персонажей — они будут помогать пользователям решать конкретные задачи. Например, один из персонажей будет появляться вместе с ошибками в сервисе. Он мягко объяснит, почему что-то не сработало, и соберёт с аудитории обратную связь.

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

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

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

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

Всё это будет внедряться постепенно. Что-то мы уже реализовали в 2024 году, а что-то сделаем в 2025-м.