Monday
Jan212013

Как я делал тестовое задание

Месяца полтора-два назад наткнулся на пост с вакансией в HeadHunter на должность «Мобильного дизайнера». У вакансии было тестовое задание. Я люблю попрактиковаться в свободное время, поэтому решил выполнить его. В посте хочу рассказать немного о процессе.
Because why not? :)

Задание

Итак, привожу текст задания:
«У каждого соискателя на сайте hh.ru есть страница откликов и приглашений. Спроектируйте макет этой страницы для мобильного приложения на любой платформе»

Сама страничка:

Далее опишу как я решал данную задачу.

Анализ страницы

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

На самом деле «анализ страницы» это слишком громкое словосочетание — у нас все довольно очевидно. На экран мобильного приложения попадут:
- Контент: Список откликов
- Таб бар: Основные разделы сайта
- Нав бар: Настройки и Фильтр откликов
Ниже расскажу подробней о каждой из частей

Контент: Список откликов

Мне показалось, что в большинстве случаев пользователь на экране откликов будет иметь сообщения по однотипным вакансиям (думаю не часто дизайнер ищет работу повара или вахтера в дневную смену женского общежития РГГУ). Поэтому, мне показалось, что важней от какой компании пришел отклик и первой строкой я отобразил её название, а под ним подписал саму вакансию. По этой же причине я решил не показывать отправленное резюме соискателем на этом экране. Предполагается, что данная информация будет более подробно показана когда пользователь откроет сообщение.
Вместо цветового кодирования всей плашки, я решил показать статус отклика отдельными цветными иконками (потому что я люблю иконки!).

Таб бар: Основные разделы

Tab Bar Glyphs Основными разделами сайта, как и приложения стали:
- Поиск вакансий
- Отклики на вакансии
- Мои резюме
Для каждого раздела я нарисовал иконку и расположил их в таб бар

Нав бар: Настройки и Фильтр откликов

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

На самом навбаре я расположил кнопки настроек и фильтра откликов. Я решил использовать поп-ап, в котором пользователь мог бы выбрать какой именно «раздел» откликов он будет просматривать. Для каждого типа отклика я придумал и нарисовал по иконке.
Была идея отображать эту же иконку на самой кнопке на навбаре, но тогда возможно сама кнопка вводила бы в заблуждение пользователя. Если с «активными» и «любыми» все довольно однозначно, то «удаленные» и «архивные» могли быть восприняты пользователями как кнопки к действию: удалить/поместить в архив.

That's all, Folks!

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

Такие дела. Надеюсь было интересно почитать :)

P.S.: Работу отправлял, недавно получил ответ — вроде понравилось (на должность я не претендовал, т.к. не планирую пока переезд в Мск)

Reader Comments

There are no comments for this journal entry. To create a new comment, use the form below.
JavaScript is Required
Seems like your browser disabled JS, please turn it on to leave your comment