Мудборд или Как сдать макет клиенту с первого раза

Мудборд или Как сдать макет клиенту с первого раза

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

Маркетолог не учел, что его представления о лендинге отличаются от представлений клиента. По готовому макету приходит фидбек от клиента: «Это не то». Сыпятся правки, дизайнер снова и снова рисует иконки и каждый раз не попадает в ожидания.

Не хватает одного этапа между прототипом и готовым дизайном — мудборда или доски настроений. Это набор референсов: примеров изображений, шрифтов, цветовых решений. Рассказываем, в чем польза от мудборда и как его составить за три шага.
Почему мудборд не пустая трата времени
Почему мудборд не пустая трата времени
Мудборд помогает убедиться, что заказчик и исполнитель поняли друг друга и задача принята правильно. Пример: заказчик Y приходит в Out of Cloud за фирменным стилем. Мы проводим брифинг клиента, уточняем характеристики продукта и ожидания клиента. Затем начинаем работать над «доской настроения».

Ниже — мудборд, который помог определиться с общим настроением фирменного стиля: использовали крупную типографику и яркие цветовые акценты на светлом фоне.
Еще одно полезное свойство мудбордов — они помогают четко донести мысли до клиента. Задача дизайна не только быть эстетически приятным и отражать дух бренда, но и увеличивать показатели метрик. С мудбордом легче объяснить заказчику, почему невысокий баннер в теле письма сработает лучше и что такое заметные кнопки CTA.
Цветовая палитра, структура, графическое решение — ищем референсы
Цветовая палитра, структура, графическое решение — ищем референсы
При подготовке мудборда мы идем от общего к частному. Сначала подбираем цветовую палитру: дизайнеры и контент-маркетологи Out of Cloud пользуются функцией фильтра по цвету. Она есть у Dribbble, Behance и Adobe Color.
Поиск по цвету в Dribbble
Еще один способ — вбить в поиске Google или Pinterest запрос «palette + название цвета».
Поиск по цвету в Pinterest

Далее переходим к поиску референсов по структуре. У всего есть структура, будь то главный баннер письма, лендинг или рекламные креативы. Базовая структура — это набор обязательных элементов: хедер, футер, тело. Структура блоков внутри тела зависит от задачи. Например, если цель — увеличить клики в email-рассылке, лучше выбрать структуру с яркими и заметными CTA.
Референсы для лендингов на Behance.
Совет: лучше формулировать поисковый запрос на английском, тогда выбор больше
Последний шаг — подобрать графическое решение. Уделяем внимание деталям и подбираем визуал, который решит задачу и отразит дух бренда: фотографии или векторные иллюстрации, абстрактный фон или градиентный, гротескные шрифты или антикву. Чаще всего ищем такие референсы на Pinterest, Shutterstock, Behance или Dribbble.
Поиск тематических векторных изображений на Shutterstock
Кульминация работы: создаем мудборд
Кульминация работы: создаем мудборд
Переходим к созданию мудборда: собираем на одном пространстве все элементы, которые приглянулись. Для этого выбираем удобный инструмент: подойдут Figma, Canva, Adobe Photoshop или Adobe Spark, «Google Презентации» или PowerPoint.
Главный принцип мудборда — единообразие и сочетаемость его частей. Важно, чтобы он передавал общее настроение. Например, из мудборда выше мы понимаем, что итоговый дизайн будет минималистичным с использованием 3D-элементов и скульптур. Приветствуются абстрактные формы, яркие цветовые акценты и шрифты без засечек.

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