Дизайн, продукт и рок-н-ролл

в 7:50, , рубрики: ux design, Блог компании HeadHunter, графический дизайн, дизайн, дизайн мобильных приложений, дизайн продукта, дизайнеры, Никто не читает метки

Встречают, как водится, по одежке. И к твоему луку довольно много требований, особенно если ты — самое заметное HR-tech явление страны. Будучи сложным и нетривиальном сервисом, hh.ru бросает дизайнерам множество интересных вызовов, раздает массу уникальных и действительно сложных продуктовых задач и требует кропотливой работы с такими интерфейсами и данными, которые мало где встретишь.

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

Дизайн, продукт и рок-н-ролл - 1

Эволюция или смерть

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

Дизайн, продукт и рок-н-ролл - 2

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

Дизайн, продукт и рок-н-ролл - 3

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

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

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

Дизайн, продукт и рок-н-ролл - 4

Помимо соискательского и работодательского разделов основного сервиса в ведении продуктовых дизайнеров находятся и другие проекты hh.ru, такие как Talantix, Банк данных заработных плат, HRSpace и другие.

Ясно, понятно

Прежде чем приступить к очередной задаче, мы задаемся вопросом: “станет ли понятнее, эффективнее и эмоциональнее?” Это помогает сконцентрироваться на важном и отсеять неключевые проблемы. Кроме того, существуют и верхнеуровневые бизнес-цели компании, и продакты отвечают за их достижение. Продакт-менеджер — это дайвер в огромном голубом океане пользовательского взаимодействия с сервисом. Его задача нырнуть как можно глубже и выудить самую большую пользовательскую боль или проблему. Эту боль он приносит в команду и вот здесь в работу включаются дизайнеры, чья главная задача — сгенерировать гипотезы, которые помогут эту боль излечить.

Дизайн, продукт и рок-н-ролл - 5

Гипотезы трансформируются в прототипы, а прототипы тестируются на пользователях. Затем происходит работа над ошибками, отбраковываются несостоявшиеся гипотезы, а лучшая доводится до совершенства. Затем происходит совмещение прототипа с нашей дизайн-системой и верстка отрисованного. Дизайнер, как и завещал Энди Уорхол, на 15 минут становится звездой, в нашем случае — арт-директором: в предрелизном демо он обладает решающим голосом и именно он благословляет задачу на выход в продакшн.

Звучит как вызов

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

Мы следуем нашему внутреннему своду законов Хаммурапи — UX-манифесту. Это holy book наших правил и паттернов, фундамент, на котором основано понимание хорошего дизайна с точки зрения пользовательского опыта. UX-манифест — это своего рода чек-лист, благодаря которому дизайнер понимает, что выпускаемая задача соответствует заданным стандартам. Этот манифест используется во всех продуктах компании и является одним из главных рабочих инструментов.

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

В лицах

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

Дизайн, продукт и рок-н-ролл - 6Саша Никишенков

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

Дизайн, продукт и рок-н-ролл - 7Женя Шляндина

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

Дизайн, продукт и рок-н-ролл - 8Соня Пащенко

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

Дизайн, продукт и рок-н-ролл - 9Саша Ашуров

Бренд-дизайнер hh.ru. Дизайнит почти все маркетинговые проекты. Тащится от спортивной гимнастики и может крутануть сальтуху. Любит изучать и создавать шрифты, продюсирует электронных музыкантов, самые известные — DJ Electric и Luckystars.

Дизайн, продукт и рок-н-ролл - 10Марина Усачева

Дизайнер маркетингового отдела и внутреннего корпоративного стиля на полставки. Счастлива, что “любимое дело” и “работа” стали синонимами. На путь истинный встала в университете, выбрав направление “Визуальные коммуникации”. Обожает графику и балет – все, что связано с эстетикой.

Дизайн, продукт и рок-н-ролл - 11Таня Галак

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

Дизайн, продукт и рок-н-ролл - 12Коля Михайлов

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

Дизайн, продукт и рок-н-ролл - 13Женя Назарова

Старший дизайнер продукта в hh.ru. Развивает CRM-систему Talantix для рекрутеров, генерит идеи, проверяет гипотезы и делает пользователей счастливее. А еще Женя обожает ходить. Ходьба — это про Женю. Женя и пешие прогулки — это как Бонни и Клайд, Сид и Вишес, Эрих и Мария Ремарк. Короче говоря, просто созданы друг для друга.

Дизайн, продукт и рок-н-ролл - 14Костя Козырев

Продуктовый дизайнер. Отрекшись от ремесла написания кода, встал на светлую сторону пользовательского спокойствия и здоровья. Любит спорить, дип-хаус и oldtimer тачки.

Дизайн, продукт и рок-н-ролл - 15Олег Бухтияр

Развивает мобильное приложение для соискателей. Ходит по офису с двумя телефонами и вечно сравнивает iOS с Android. Бегает как Форрест Гамп.

Дизайн, продукт и рок-н-ролл - 16Настя Винокурова

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

Наши бро

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

Дизайн, продукт и рок-н-ролл - 17

Автор: Глеб Шницер

Источник


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js