Сетка
Дизайн-альманах Readymag — образовательный проект об основах дизайна. Эта глава рассматривает визуальную структуру нескольких онлайн-магазинов, сайтов медиа, книг и журналов. Вы узнаете, как обращать хаос в космос при помощи такого инструмента, как сетка.
1
Вступление
2
Теория
3
Практика
Невидимые линии
Порядок
Структура
Модуль
Структура
Соразмерности
Модульные шкалы
Сетка
Теория
Назовём сетку основным инструментом дизайнера при проектировании любого пространства. В зависимости от сложности продукта, в ход идут либо несколько направляющих, либо многослойные модульные системы. Как правило, разрабатывая сетку, дизайнер заранее вводит все переменные макета — типографические элементы, иллюстрации, графику и фотографии. Желательно сразу представлять себе композицию будущего макета и законы, по которым она будет существовать: комбинирование изображений между собой, их взаимодействие с типографикой, организацию пятен и контраста на полосе.
По сути, проектируя сетку, дизайнер вырабатывает набор правил и ограничений, по которым ему предстоит сыграть в предстоящей партии. Эти правила и ограничения создают в процессе работы определённое мыслительное напряжение, зачастую определяя и направляя развитие макета, а порой ставя непростые вопросы, ответы на которые могут привести к неочевидным, но убедительным результатам.
Хорошую сетку можно сравнить с решёткой, по которой взбирается плющ, — она даёт функциональную опору, формирует пространство, которое осваивает растение, но не препятствует естественному росту и органичному распространению побегов. Подобным образом, работая с грамотно организованной сеткой, дизайнер опирается на спроектированную систему гармоничных отношений, позволяющих, варьируя интонации, сохранять регулярный и выразительный образ продукта. Это помогает читателю воспринимать главное и получать (в идеале) зрительное удовольствие в процессе работы с информацией.
Теория
Сетка
1.
Практически в каждом макете есть оси, невидимые линии, по которым выстраиваются ключевые элементы — текстовые блоки, заголовки, иллюстрации. Эти линии и есть элементы сетки. Сетка может быть очень простой и определять лишь базовые линии строк и поля в простой по структуре книге. Она может быть очень сложной и управлять разнообразными текстами, заголовками, фотографиями, анонсами и графиками на газетной передовице. В многополосном журнале сетка может неожиданно менять количество колонок от раздела
к разделу, а на сайте растягиваться и сжиматься вслед за окном браузера.
Структурная основа композиции не всегда видна невооружённым взглядом, но найти макет без сетки сложно: велика вероятность, что она там всё-таки есть.
W
W
W
W
W
W
W
W
W
2.
Книги или статьи по истории типографики могут отпугнуть неподготовленного читателя математикой и геометрией, ведь в них упоминаются ряды Фибоначчи, пропорции золотого сечения, модулор Ле Корбюзье, изыскания швейцарских модернистов. Однако построение модульных сеток, хотя и базируется часто
на сложных соотношениях целого и частного, — дело исключительно практическое. Лишь один раз столкнувшись с необходимостью создать многостраничный документ, вы поймёте, что крайне утомительно на каждой полосе заново придумывать, куда поставить заголовок или подпись
к фотографии, какой кегль шрифта выбрать для заголовка в три строки и сколько отступить от лида.
Процесс многократно облегчается, когда вы задаете оси и отступы сразу для всех страниц. Что же касается упомянутых выше теорий (которые сложны только на первый взгляд), то они разными способами помогают построить модули, но если вы уверены в собственном художественном чутье, то можете расставлять направляющие линии на глаз и не думать про золотое сечение. Итак, важнейшая функция модульной сетки — облегчение задачи дизайнера при работе
с многосоставным или многостраничным документом.
Многостраничные издания как правило содержат большое количество визуальных элементов и включение их в ясную и продуманную структуру позволяет упростить работу дизайнера.
The New York Times
M
Fantastic Man
M
