Мудборды

Автор: Алена Переяславец
Что такое мудборд?
После вечера в слезах, анализа, почему что-то пошло не так и двух бокалов вина, я решила вернуться к началу начал — созданию мудборда.
Как-то мне пришлось в буквальном смысле лить слезы из-за мудборда.

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

Я, как хваткий боец, упустила этап мудборда и сразу приступила к работе. Доделав все слайды спустя 6 часов, мы отправили их на фидбек. В результате клиент написал, что по стилистике это совершенно не то, что он ожидал.
Я очень расстроилась, ведь проделала много работы, и все впустую.
Мудборд («доска настроения») — это набор картинок, которые передают настроение и стилистику будущего проекта. Под стилистикой имеется в виду цвета, иконки, фотографии, иллюстрации, кнопки и т.д.
1
Шрифты
В презентации планируется использоваться шрифты с засечками, «под старину» или легкие современные шрифты без засечек?
Какая комбинация шрифтов хорошо передает настроение презентации?
2
Цвета
Какая цветовая палитра будет использоваться: пастельные цвета, градиенты, темные цвета или наоборот светлые?
3
Иконки
Если в презентации вы планируете использовать иконки, то можете показать их стилистику: залитые, частично залитые, линейные с тонкой обводкой или линейные с толстой обводкой, более формальные или более фановые.
4
Фотографии
Если планируете использовать фотографии, покажите примеры. Это могут быть кадры людей крупным планом, панорамы города, предметная съемка и пр. Главное, чтобы примеры передавали настроение, которое вы хотите создать в презентации.
5
Иллюстрации
Иконки и иллюстрации должны гармонировать между собой, быть в одном стиле и создавать одно настроение. Покажите примеры иллюстраций, которые подходят под задуманную вами стилистику.
6
Графики и диаграммы
Найдите интересные примеры визуализации информации, примеры графиков и таблиц, стилистика которых подходит под презентацию.
7
Композиция
Мудборд может вам помочь найти интересные композиционные решения в размещении элементов на слайде. Композиция может быть сбалансирована и строга, а может быть динамичной, современной и даже немного хулиганской. Что больше подходит под вашу задумку?
8
Другие элементы
В мудборд можно включать другие элементы дизайна, не обязательно из мира презентаций. Это может быть дизайн кнопок, элементов интерфейса, паттернов. Главное, чтобы вы видели разумное применение этим элементам на слайдах.
Зачем нужен мудборд?
Чтобы экономить время и нервы :)
Это облегчает жизнь в миллион процентов. Как говорит моя мама, зачем придумывать велосипед с ноля?

Будучи недизайнером, компоновать и сочетать бывает невероятно сложно. А ведь большинство людей, которые регулярно делают презентации — недизайнеры. Хорошо подобранный мудборд и отличное знание PowerPoint помогут вам сделать крутую презентацию, используя готовые дизайнерские решения.
Как сделать мудборд?
Вам понадобится следующее:
— Возможность делать скриншоты;
— Программа, куда вы будете вставлять картинки (PowerPoint, Paint, Photoshop, Illustrator, Word).

Либо же можно сохранять картинки онлайн, например, на доске в Pinterest.
Шаг 1: Ищем картинки и вдохновляемся
Все, что нужно — это зайти на Behance, Dribbble (это сайты, где дизайнеры выкладывают свои работы), Pinterest и выбрать те проекты, которые вам нравятся и подходят под настроение презентации. Сохраняйте эти картинки в папку у себя на компьютере или на доске в Pinterest.

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

Примеры «влияния»:
1. Если вы представляете юр. фирму и выступаете перед советом директоров крупной корпорации, то скорее всего презентация должна быть сдержанной, серьезной, без ярких вырвиглазных цветов и без экспериментов в композиции слайдов.

2. Если вы делаете презентацию для выступления перед школьниками, то скорее всего презентация должна быть вовлекающей, нескучной и «фановой»: с насыщенными цветами, гифками, видео и анимацией.

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

В мудборде главное — передать настроение, которое человек должен ощущать во время просмотра презентации.

Важное правило: не все, что вам понравится, пригодится или подойдет для вашего проекта.

Вы спросите: «Почему»?
Продемонстрирую на примерах.
В годовом отчете банка такой художественный стиль будет неуместен, хоть он мне и понравился.
Это уже ближе, такой стиль по ощущениям будет больше подходить для финансовой сферы.
Вывод: ищем проекты, которые максимально близко передают то настроение, которого мы хотим достичь при помощи презентации. Главное — следить за тем, чтобы мудборд не был похож на корзину, в которую свалили всё подряд.
Шаг 2: Анализируем картинки, которые нашли
Предположим, нам необходимо сделать презентацию о бренде ювелирных украшений, и у нас получился вот такой мудборд:
Пример мудборда. Картинки взяты из разных проектов на behance.net.
Давайте проанализируем мудборд и подумаем, как такая стилистика может повлиять на презентацию:
1
Настроение
Презентация будет светлой и сдержанной, местами консервативной.
Так как ювелирные изделия всегда считались предметом роскоши, то классичесий выдержанный стиль подойдет.
2
Цветовая палитра
Вы можете найти готовую палитуре или сгенерировать самостоятельно, например, на сайте Coolors или Khroma.

Мне понравился синий цвет на одном из референсов, но мне не подходит розовый. Я узнала код синего цвета, ввела его на сайте Сoolors и подобрала цвета. Вот что вышло у меня примерно за 30 секунд:
Цветовая палитра, подобранная к изначальному синему цвету с помощью Coolors
3
Шрифты
Для заголовков мы можем использовать шрифт с засечками, а для основного — без. В одном из проектов используется шрифт Warnock pro, но он платный. На Google Fonts вы можете подобрать похожий шрифт в свободном доступе. Например, Playfair Display.

Бесплатный шрифт из Google Fonts, который можно использовать для заголовков
4
Фотографии
В нашем проекте главное — продукт, значит фото должны быть хорошего качества и показывать детали ювелирных изделия. В мудборде кроме самого продукта показываем фотографии девушек с украшениями.

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

Если же вам нужно просто фото для дизайна, а не для демонстрации линейки изделий, бесплатные качественные фото есть на Unsplash, Pixabay, Pexels.
Шаг 3: Делаем презентацию
Сможете ли вы повторить определенные дизайнерские решения в PowerPoint или Keynote — уже зависит от ваших скиллов и знания инструментов.
Эти инструменты не могут полностью заменить Photoshop или Illustrator, но позволяют реализовать достаточно интересные решения.
Мой личный вывод
Мой опыт в дизайне — больше трех лет. За это время я ни разу не пожалела, что лишний раз сделала мудборд для проекта. И в ближайшее время не планирую отказываться от этого инструмента.

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

Мудборд стоит использовать как толчок для вашего творчества, с него можно начинать презентацию. Перед созданием презентации, кроме создания мудборда, не забывайте хорошо проработать контент и нарисовать сториборд. А дальше — пользуйтесь своей творческой жилкой, адаптируйте дизайн под контент презентации и впечатляйте аудиторию своими презентациями :)
Примеры мудбордов от команды Reprezent
Другие интересные статьи о мудбордах для любителей «покопать в теме»
Как 1+1 Digital используют мудборды для разработки концепций диджитал-продуктов: https://telegraf.design/zachem-nam-nuzhen-moodboard

Design Mood. 7 Motives to Create Mood Boards: https://tubikstudio.com/design-mood-7-motives-to-create-mood-boards

Примечание автора: еще есть такое понятие, как stylescapes. Я детально не изучала, чем это отличается от мудборда, для меня это аналогичное понятие. Если кто-то захочет изучить разницу, то можно поискать статьи в Google. Буду рада, если поделитесь своими выводами, можете писать нам на idea@reprezent.ua :)
Получать новые статьи прямо на e-mail
Мы работаем над новыми полезными статьями. Чтобы получать обновления нашего блога, оставьте, пожалуйста, свой e-mail.
Нажимая на кнопку, вы даете согласие на обработку персональных данных. Пользовательское соглашение Reprezent.
Рекомендуемые статьи