Привет, Хабр!Мы подвели итоги конкурса. И, как вы просили в ответных письмах, публикуем пост с типичными ошибками и удачными примерами решённых заданий. Сейчас мы расскажем об итогах конкурса среди фронтендеров.
Задание состояло в том, чтобы разработать интерфейс просмотра курса валют за последние три месяца. В качестве основы предоставлялись бумажный прототип и данные в формате XML. Целью задания было определить насколько хорошо человек владеет технологиями и «чувством интерфейса» — то есть представляет, насколько удобно им будет пользоваться, и насколько понятным он окажется с первого взгляда.
Желающих попробовать себя в роли не только разработчика, но и проектировщика интерфейсов, оказалось немного. Мы хотели бы рассмотреть интересные работы и рассказать об их недостатках, а также показать интерфейс, который сочли лучшим.
Типичные недочеты
В датах указан текущий год
Дело в том, что когда речь идёт о текущем годе, то не обязательно напоминать об этом пользователю. Стоит сообщать о нём лишь в том случае, когда речь идет о прошедших или будущих годах.
Не подписаны элементы управления
Пользователю, не знакомому с описанием функционала, непонятно к чему приведёт изменение значений этих элементов. Стоит подписать, что вот здесь — «основная валюта», а это — «список активных курсов валют».
Неэффективная сортировка списка
Список валют отсортирован хаотично, хотя необходимо сортировать его в порядке популярности, чтобы пользователь не тратил время на поиск нужной валюты.
Аббревиатура
Трёх буквенный код валюты указан лишь на графике и не очевидно, что такое DKK и SGD. Старайтесь использовать хотя бы стандартный атрибут title.
Некорректное использование яркости цвета
Активный элемент должен светиться, а неактивный быть блёклым и не привлекать внимания.
Значения в графиках
График — это не просто приятное изображение. Это активный элемент интерфейса, который должен доносить информацию. Не забывайте показывать значения на осях, а при наведении курсора — в данной области графика.
Проверяйте контент!
Здесь разработчик забыл закрыть глаза на минуту, а потом открыть и свежим взглядом обнаружить, что сортировка некорректна.
Теперь о хорошем
Интерфейс, который нам показался лучшим и содержал минимальное количество недостатков:
Рекомендация по презентации результатов
Так как задание было для фронтендеров, то ожидалось, что в архиве будет лежать клиентская часть с минимумом серверной (близкой к нулю), но во многих архивах были запакованы целые проекты на ruby и php с инструкциями по установке.Если для ознакомления с работой нужно потратить более двух минут, то лучшим решением будет приложить ссылку на работающий сервер — это поможет оценить работу по достоинству.
Спасибо всем, кто принял участие!
Команда Островок.ru
P.S.: Следующий пост будет посвящен бекендерам.
P.P.S.: Кстати, у нас есть вакансии для веб-технологов!
