Обучение графическому дизайну: 20 правил, которые существуют для того, чтобы их нарушали

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

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

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

Типичным примером плохой читаемости является малый контраст (рис. 1) между текстом и фоном, поэтому каждый раз, когда вы сомневаетесь, прищурьтесь так сильно, чтобы буквы сливались в единое пятно. Если не удалось распознать — увеличиваете контраст между фоном и сообщением.

Другой распространенной ошибкой является злоупотребление (рис. 2) заглавными буквами. Мало того, что заглавные буквы напрягать читателя, они также препятствуют способности быстро различать буквы. Заглавные имеет одинаковую высоту и выглядят как столбики, мешая понять информацию. А вот буквы в нижнем регистре буквы имеют уникальную форму, что позволяет глазу быстрее идентифицировать букву и слово.

Еще одна ошибка — это размер (рис. 3) шрифта. Подумайте о своей аудитории и сделайте шрифт крупнее. Если вы не уверены, напечатайте на принтере и проверьте себя и сделайте еще чуть больше.

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

Почаще заглядывайте в таблицу на странице 32 в книге «Основы стиля в типографике» Роберта Брингхерста. Автор рассчитал среднее количество знаков в строке. Золотого правила не существует, но есть оптимальное число 45-60 знаков с пробелами.

Интервал между словами (на рисунке) равен строчной «i». Пробелы, больше чем эта величина ухудшают читабельность. Бытует мнение, что русском языке слова длиннее, чем в английском, поэтому пробел между словами может быть шире. В Adobe Illustrator стандартный пробел равен величине «i».

Если вы дизайнер, то вы наверняка сталкивались с основным инструментам — выравнивание. Существует четыре вида выравнивания или выключка: по левому краю, по правому краю, по центру и полная выключка. Если вы не уверены, какое выравнивание текста выбрать, выбирайте выключку влево: варианты «Вправо» и «По ширине» в веб-дизайне себя не оправдывают.

Выровненный по левому (рис. 1 слева) краю — этот тип является наиболее распространенной формой. Он является наиболее удобочитаемым и дает красивый, аккуратный левый край текста. Если сомневаешься, выравнивать текст по левому краю.

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

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

Основная ошибка начинающего дизайнера или верстальщика — применение полной выключки (рис. 2 слева) на сайте, в презентации или документах. Смотрится убийственно плохо. Применяйте этот тип выключки в исключительных случаях.

Используйте сетку для организации элементов на странице. Я рекомендую использовать сетку в любом дизайне. Она помогает структурировать информацию и мысли. Сетка может превратить проектирование в увлекательный процесс. Ограничение вертикальными и горизонтальными линиями создает из среднего дизайна чистый ясный проект.

Сетки бывают разных форм и размеров, могут быть гибкими и адаптивными к дизайну. Сетки помогают создать более аккуратный, более логичный дизайн.

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

Простой способ превратить ваш дизайн из любительского в профессиональный — распознать и устранить «вдов» с «сиротами». «Вдовы» и «сироты» обязательно появятся в любом дизайне с текстом. Иногда строка из одного или нескольких слов оказываются не на том месте. Такие строки называются «висячими». «Висячая» строка та, которая «оторвана» от своего абзаца и «висит» в одиночестве на странице.

«Вдова» — это целое слово в конце абзаца или очень короткая строка в конце текста (см. слева 2). «Сирота» — это висячая строка (см. слева 1), которая попадает на начало новой страницы или колонки. Делайте так, чтобы «вдовы» и «сироты» не портили вам внешний вид верстки.

Есть несколько способов справиться с вдовами и сиротами. Первое, что можно сделать — вручную отредактировать текст. Отрегулируйте длину строки с помощью трекинга. Совет два — увеличьте текстовое поле сверху и сбоку, чтобы устранить проблему.

Не злоупотребляйте пробелами. Все, что вам нужно сделать, чтобы начать новую строку — это нажать Shift+Enter. Чтобы начать новый абзац нажмите Enter.

Лишними считаются пробелы, которые следуют непосредственно за пробелами. Между словами всегда должен находиться один пробел. Запомнить просто.

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

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

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

Шрифты строятся с большой осторожностью и вниманием к формам и пропорциям каждой буквенной формы, поэтому не искажайте надобности.

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

Размер текста 10 пт, интерлиньяж — 24 px. 10 / 2 = 5 + 10 = 15.
Исключение: это правило хорошо работает в веб-дизайне. Делать верстку книги по этому правилу не самая хорошая идея. Для книги, где стоимость зависит количества страниц в издании применяется немного другой расчет.

Сергей Рассказов советует применять правило «минус пяти». Во всех редакторах интерлиньяж стоит 120% (при 10 кеглей будет стоять значение будет 12). «В большинстве случаев в текстовом наборе кириллицей, можно списать 5% и выиграть при наборе 10/11,5. Малое количество выносных элементов в нашей заборной кириллице большего и не требует» — советует автор.

Правильное использование белого пространства делает ваш дизайн особенным. Вы можете поставить акцент на конкретном аспекте вашей композиции, позволить дизайну «дышать», сбалансируйте элементы и главное — добавите изысканности вашей работе. Основное правило — не забивайте пустые пространства элементами.

Негативное пространство поможет лучше разобраться в белом пространстве вашего дизайна.

Абзац — это небольшой текстовый блок, который состоит из заголовка, подзаголовка и ограничен небольшим количеством строк. Оставляйте в одном абзаце 3-4 длинных предложения и 5-6 строк. Современный читатель предпочитает короткие абзацы длинным «простыням». Разделяйте блоки теста двойным межстрочным пробелом.

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

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

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

Длинное тире — знак пунктуации, всегда отбивается пробелами между словами. Дефис не найти на клавиатуре, он набирается набором клавиш: Mac — alt+shift+дефис, Windows — alt+ctrl+дефис. Жмите одновременно.

Кавычки — парный знак препинания. Кавычки нужны для выделения текста: прямая речь, цитаты, названия газет, компаний и др. Основные кавычки в русском тексте отбиваются французскими «елочками». Внутри текста с «елочками» используется закавычивание немецкими "лапками".

Еще правило, которое я всегда забываю — знаки препинания, например точка или запятая, ставятся после кавычек. Путаю, потому что в англоязычном варианте точки и запятые ставят внутри кавычек.

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

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

Одним из самых больших отличий вектора от растра является возможность масштабирования элементов. Поскольку растр состоит из пикселей, в определенный момент масштабирования изображение становится непригодным (как вы видите слева «квадратиками»). Векторные изображение не имеет этой проблемы и выдерживает любые масштабирования.

Помнишь радость открытия эффектов в Adobe Photoshop? Весело было добавить градиенты, тени, фаски и множество других эффектов к дизайну? Что ж, дни искусства закончились (к сожалению), так что настало время отправить спецэффекты в старый сундук. (Шутка)

Один из самых применяемых эффектов сегодня — это наложение тени или «drop shadow». Наступила эпоха плоских дизайнов, поэтому обращайся с эффектами осторожно.

В заключение могу сказать, что есть только одно последнее правило: никаких правил нет. Яркий пример — легендарный дизайнер Дэвид Карсон, создатель журнала Ray Gun. В 1994 году Карсон дал интервью музыканту Брайану Ферри, которое посчитал очень скучным. В журнале интервью нельзя было прочитать, так как было набрано Zapf Dingbats, (шрифт, состоящий из символов). Нарушение правил иногда является лучшим способом подать заявку и стать легендой в дизайне.

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

Источник статьи: Canva