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

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

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

Как оценить работу дизайнера: все этапы разработки

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

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

• Брифинг. 

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

• Анализ ЦА. 

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

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

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

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

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

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

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

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

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

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

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

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

Как оценить работу дизайнера: удобство использования

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

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

Как оценить работу дизайнера: оформление контента

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

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

 

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

Как оценить работу дизайнера: формы для заполнения

• Если на сайте предусмотрена регистрация, сделать это должно быть максимально просто: минимум полей, интуитивная простота заполнения, выгода для пользователя отражена в форме.
• Заполнение крупной формы разбивается на несколько этапов.
• Все этапы сопровождаются подсказками.
• Указан формат ввода данных (например, для телефона или электронной почты).
• Целевая кнопка выделяется цветом и отличается от остального оформления.
• Квизы и другие интерактивные элементы с большим количеством этапов и расширенным функционалом имеют собственные страницы.

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

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

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

Для сайта стоматологии нарисовали эстетичные иконки: все элементы кликабельны и интерактивны.

Как оценить работу дизайнера: дополнительный функционал

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

Например:

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

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

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

• Разработаны страницы для покупки в один клик или для более детального оформления заказа.

• Разработана отдельная страница с юридической информацией и данными, подтверждающими безопасность личных данных клиентов.

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

Как выбрать хорошего дизайнера

Найти подходящего специалиста непросто. Какие вопросы можно задать на старте, чтобы понять, что перед вами специалист:

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

• Как выявляются боли и возражения, как это будет отражено в дизайне.

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

• Действия, которые предпринимаются для того, чтобы разные типы пользователей могли быстро разобраться в дизайне сайта.

• Метрики для оценки эффективности UX/UI.

• Проводится ли тестирование прототипов и обработка обратной связи.

• Какие последние тренды учитываются в дизайне и почему.

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

Внедрили инструменты, основанные на детальном анализе ЦА и создании аватаров пользователей, каждый эффективно работает.

Не знаете, где заказать продающий дизайн? Находитесь в поисках вдохновения? Сотрудники DarvinDigital рады вам помочь. Просто позвоните или заполните заявку на сайте. В ходе бесплатной консультации мы ничего не продаем: только отвечаем на ваши вопросы и помогаем найти решение конкретной задачи.