Чек-лист: как заказчику оценить работу дизайнера

Заказывая дизайн сайта как у частного специалиста, так и в многопрофильной студии, клиент всегда ожидает получить хороший продукт. Но как понять, насколько он хорош на самом деле? Привлекательная картинка не решает задачи по продаже товаров и услуг сама по себе: она работает только в связке с пользовательским опытом. Это и есть UX/UI дизайн, где первые две буквы отвечают за то, как потенциальный клиент взаимодействует с ресурсом, а вторые — за то, как сайт выглядит. 

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

Коротко: как разрабатывается дизайн сайта

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

Этапы разработки эффективного дизайна:

• Брифинг. 

Самое важное — выяснить цели и задачи проекта.

• Анализ ЦА. 

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

Результаты анализа ЦА для стоматологической клиники.

• Создание структуры. 

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

• Разработка прототипа. 

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

• Сборка мудборда. 

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

Вот такой мудборд мы собрали при разработке сайта стоматологии.

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

Чек-лист для проверки дизайнера

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

Удобство использования

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

Оценить удобство использования можно уже по прототипу: для этого DarvinDigital создает максимально подробные прототипы, в которых не только есть все необходимые блоки, но и уже написаны все тексты.

Оформление контента

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

• Логически связанный контент размещен рядом: блоки не разделены большим пустым пространством или формами.
• Отсутствуют страницы, в которых нет смысла, все разделы полезны для посетителя.
• Количество элементов, отвлекающих от просмотра основного контента, минимально.
• Текст контрастирует с фоном, оформлен читабельно, его легко можно разобрать, отделить заголовки от основного текста.
• Текстовый контент написан просто и понятно, полезен для посетителя.
• Текст имеет структуру, иерархию подзаголовков и списки, форматирование по правилам веб-типографики.
• При клике открывается полный размер изображения.
• Ссылки отличаются от остального текста по цвету.
• Если по ссылке был совершен переход, она выделяется другим цветом.

Страница блога стоматологической клиники