Как менеджеру научиться различать качество дизайна — принципы и законы. Часть 3

Привет, друзья! Я Иван Ребиков, основатель и управляющий партнер Landau Interactive. Мы продолжаем разговор о базовых правилах дизайна. Напоминаю, что в первой части обсуждали истоки представлений о дизайне, во второй — основные законы и правила.

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

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

Первый принцип: чем проще, тем лучше

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

Второй принцип: не стоит использовать близкие начертания

Например, если мы берем вариант «Medium», то должны использовать не следующее по жирности начертание «Semi Bold», а более жирное. Тогда не будет ощущения, что это однородные элементы, выполненные чуть-чуть по-разному. Будет видно, что это совершенно другой элемент, и зрительно читатель не попытается их состыковать, как в примере со скруглениями.

Точно так же не нужно использовать рядом близкие размеры шрифтов: 12 и 14, 14 и 16. Если мы хотим выделить текст, нужно сделать шрифт либо значительно больше, либо значительно меньше.

Третий принцип: нельзя использовать близкие цвета, похожие на основной

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

Эти три принципа помогают нам избавляться от мусора в шрифтах.

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

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

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

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

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

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

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

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

В качестве примера взглянем на новый интерфейс Facebook* с точки зрения рассмотренных правил и принципов.

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

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

Мы рассмотрели основные законы и правила дизайна. Теперь вы знаете, как общаться с дизайнерами, если у них что-то «поплыло» или «поехало», и владеете безотказной базой с безупречной логикой.

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

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

Ниже я выделил студии, задающие тренды в мировом дизайне. Их работы для меня — что-то вроде идеала.

Дельные статьи про принципы и правила дизайна, а также про колористику, которую мы не успели затронуть.

Ресурсы, с которыми я работаю по шрифтам и шрифтовой схеме.

Сервис для поиска бесплатных иконок:

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

Подписывайтесь на наш Телеграм, чтобы не пропустить анонс новых статей и кейсов.

*Meta, владеющая Facebook, Instagram и Messenger, признана экстремистской в России.

#дизайн #принципы_дизайна #веб_дизайн