{"id":14291,"url":"\/distributions\/14291\/click?bit=1&hash=257d5375fbb462be671b713a7a4184bd5d4f9c6ce46e0d204104db0e88eadadd","hash":"257d5375fbb462be671b713a7a4184bd5d4f9c6ce46e0d204104db0e88eadadd","title":"\u0420\u0435\u043a\u043b\u0430\u043c\u0430 \u043d\u0430 Ozon \u0434\u043b\u044f \u0442\u0435\u0445, \u043a\u0442\u043e \u043d\u0438\u0447\u0435\u0433\u043e \u0442\u0430\u043c \u043d\u0435 \u043f\u0440\u043e\u0434\u0430\u0451\u0442","buttonText":"","imageUuid":""}

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

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

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

Как играть и выигрывать в шрифты: строим грамотную структуру

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

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

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

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

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

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

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

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

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

Как модульная сетка помогает структурировать информацию

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

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

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

Ад перфекциониста: какой дизайн и почему вызывает дискомфорт

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

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

Нас тревожит все, что выбивается из привычного порядка вещей.

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

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

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

Что не так с Facebook* с точки зрения дизайна

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

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

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

Дизайнер выбрал очень близкие, но разные, цвета, размеры шрифтов тоже почти одинаковы.

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

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

Что посмотреть и почитать про дизайн

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

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

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

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

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

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

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

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

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

0
1 комментарий
Никита Гусь

Спасибо за ссылки в конце статьи :)

Ответить
Развернуть ветку
-2 комментариев
Раскрывать всегда