Содержание
Каждый день менеджеры разного уровня принимают решение о том, какой утвердить баннер, буклет, листовку, веб-сайт, в конце концов. А сколько презентаций рождается на свет в стенах любой средней руки компании, страшно и представить. И давайте будем честными — мир вокруг нас не становится прекрасней от всего этого потока.
Как оценить работу вашего дизайнера, принять правильное решение и не подвергнуть риску визуальный имидж вашего бизнеса? Вот несколько простых правил, которые помогут вам оценить дизайн и принять верное решение при производстве на свет новых графических материалов.
Краткость
Нужно ли говорить о том, насколько перенасыщено сегодняшнее информационное поле? Нам приходится каждый день сталкиваться с огромным количеством новостей, анонсов, рекламы. У нас нет времени вникать в их суть, мы читаем заголовки, «сканируем» информацию.
Чтобы привлечь внимание среди этого информационного шума, смело удаляйте все лишнее из макетов. Удалили? Отлично, а теперь еще раз подумайте и еще раз откажитесь от всего несущественного. И так два-три раза. Это касается как текстовой информации, так и графической.
Хороший пример — главная страница сервиса по поиску жилья в путешествиях AirBnb. Все четко и по делу, ничего лишнего. Учитесь давать информацию порциями!
На главной странице AirBnb нет ничего лишнего, информация строго дозирована.
Сетка
Когда вы определились с контентом и форматом, самое время приступить к скелету макета, так называемой модульной сетке.
Модульная сетка — система горизонтальных и вертикальных (а порой еще диагональных) направляющих, которые помогают согласовать между собой отдельные элементы композиции. Она привносит в дизайн порядок, цельность и связь всех его частей, позволяет рационально организовать любое графическое пространство, будь то бланк, визитка, сайт или страница презентации.
Несколько примеров правильной организации модульных сеток.
Если вы не уверены в том, как лучше построить ваш макет, — попробуйте задать вертикальные направляющие с одинаковым шагом и встраивайте все элементы дизайна в получившуюся сетку.
Небольшой совет: старайтесь оптимизировать количество вертикальных направляющих в соответствии с контентом. Чем их меньше, тем лаконичнее смотрится материал.
Воздух
Нам очень часто хочется разместить как можно больше информации на ограниченном пространстве, чтобы донести до конечного пользователя максимальное количество деталей. В результате получается каша из текста и картинок, лишенная смысловой нагрузки для постороннего человека.
Чтобы привлечь внимание к информации, ее нужно выделить из общей массы. Можно придумать разные варианты — яркие цвета, крупный шрифт, особые графические элементы. Но чтобы все это сработало, вокруг каждого блока информации нужно оставлять свободное пространство. Чем больше воздуха вокруг элемента, тем выше его значимость для пользователя. Также увеличивая или уменьшая пространство между элементами, можно влиять на логическую связь между ними.
Пример хорошей структуры документа — результат достигнут за счет воздуха между блоками и заголовками.
Шрифт
Многие вообще не обращают внимание на шрифты и относятся к их выбору и использованию весьма небрежно. На самом деле, любой шрифт сам по себе является законченным объектом дизайна. Практически любой хороший шрифт — результат кропотливой работы опытных дизайнеров.
В профессиональной среде бытует мнение, что разработка шрифтов — это верх дизайнерского ремесла. Советую вам на досуге погрузится в эту тему. Человек, который знает что такое антиква, гротеск, кернинг, лигатура, капитель, интерлиньяж и многое другое из мира шрифтов и типографики обречен быть внимательным к деталям.
Хороший пример работы со шрифтами на сайте — silotheatre.co.nz.
Вот несколько простых советов:
Совет 1. Не стоит использовать в одном макете много различных шрифтов — как правило, достаточно двух шрифтов. Дальше вы можете оперировать по необходимости различными начертаниями и размерами.
Например, в интерфейсах многих устройств используется лишь один форменный стиль и часто даже не во всех начертаниях.
Helvetica Neue — фирменный шрифт Apple iOS.
Совет 2. Частая ошибка — это выделение слов или фраз жирным или наклонным начертанием (италиком). Помните, жирным вы можете выделять, например, заголовки, а наклонным шрифтом делать сноски или отступления. Воздержитесь от разных начертаний в рамках одного абзаца, а тем более предложения.
Совет 3. Берегитесь непропорционально масштабированных начертаний. Давайте доверять дизайнерам шрифтов, которые тщательно подпирали пропорции каждой буквы. Любое непредусмотренное масштабирование делает текст непригодным для чтения. Пожалуй, есть только один пример, когда непропорциональное масштабирование оправдано — это надпись «Минздрав предупреждает…» на пачках сигарет.
И напоследок еще несколько коротких советов: не стоит выделять слова в тексте заглавными буквами, не стоит ставить в конце предложения несколько восклицательных или вопросительных знаков, не стоит использовать шрифт Comic Sans (только если вы не имеете дело с комиксами).
Цвет
Наверно, самая субъективная тема — это выбор цветов. Существует большое количество ассоциаций цветов с определенными стилями. Например, синий и серый — это деловой стиль, оранжевый — веселье и хорошее настроение, зеленый — цвет всего натурального, красный — страсть и агрессия, белый — чистота, желтый — старость, а коричневый — зрелость. Конечно, стоит задуматься, насколько те или иные тона соответствуют сообщению, которое вы хотите передать.
Вот некоторые рекомендации по выбору цветов:
Совет 1. Не используйте в одном макете чересчур много цветов. Есть много примеров отличных многоцветных решений, но это работа профессиональных дизайнеров. Если у вас нет соответствующего опыта, ограничьтесь тремя-четырьмя базовыми цветами.
Совет 2. Пользуйтесь онлайн-сервисами по подбору цветовых сочетаний, например kuler.adobe.com или colorschemedesigner.com. Это экономия времени и гарантированный результат.
Сервис Kuler помогает выбрать цветовые сочетания.
Композиция
Для простоты композицию можно определить как взаимодействие двух или более элементов в одной графической области. Посредством этого взаимодействия автор передает некий дополнительный смысл, идею, расставляет акценты. Посмотрите на ваш макет с этой точки зрения, абстрагируясь от контента. Что вы видите? Эмоции? Динамику? Дополнительный смысл?
Давайте рассмотрим несколько инструментов работы с композицией и общим сюжетом.
Симметрия и асимметрия. Важно в первую очередь тем, кто работает с печатной продукцией или же при рассмотрении малых форм в контексте общего. Мы привыкли к симметрии, ее просто реализовать, рука так и просится упорядочить информацию. Но попробуйте побороть свое желание, добавьте асимметрии, сломайте стройность, и вы увидите, как в композиции появится эмоция. Или же доведите идею симметрии до максимума.
Примеры симметрии и ассиметрии.
Контраст. Это универсальный инструмент для того, чтобы передать эмоции широкого спектра. Контраст может передаваться через форму, цвет, размер, динамику и даже смысл. Сложное и простое, яркое и не очень, большое и маленькое, статичное и динамичное — пробуйте разные приемы, чтобы выделить главное из общего.
Золотое сечение или правило третей. Правило трете можно считать упрощенной моделью золотого сечения. Попробуйте разделить всю видимую область на три части по вертикали и горизонтали, а в дополнение к этому провести диагонали. А теперь все важные элементы расположите на получившихся линиях или их пересечениях. Чувствуете разницу?
Хорошо демонстрируют праавила третей работы фотографов — например, эта фотография Мартины Франк.
Аккуратность
Представим, что вы оцениваете макет дизайнера и не можете понять, что вас в нем смущает. Присмотритесь к деталям. Отсутствие выравнивания, разные межстрочные интервалы в тексте, картинки низкого качества и многие другие мелочи — все это признаки грязного, неаккуратного дизайна.
Не теряйте время, ищите новых дизайнеров. С такими исполнителями не имеет смысла говорить про сочетание цветов, подбор шрифтов и расстановку акцентов на макете. Ваш бизнес — не поле для эксперимента и обучения.
Визуальное восприятие формирует наше первое впечатление о бренде или продукте и является стимулом для продолжения общения — или наоборот, причиной больше к вам не возвращаться. Помните об этом, когда формируете визуальный образ своего бизнеса.
