Пост из русскоязычного блога сервиса дизайна Canva.
Зотолое сечение, или божественная пропорция — самое загадочное правило дизайна и вызывает много споров. Разбираемся, как использовать его, чтобы ваши дизайны выделялись.
Что общего у пирамиды в Гизе и Мона Лизы с логотипом Пепси? И то, и другое создано с помощью золотого сечения. В этой статье мы разберем, что это такое и как его использовать в создании дизайна.
Правило золотого сечения
Золотое сечение — пропорция, которую заметили еще древние египтяне. Чтобы её получить, нужно разделить линию на две части так, чтобы длинная часть соотносилась с короткой в такой же пропорции, как вся линия соотносится с длинной. Оказывается, эта пропорция всегда равняется 1,618. Это число еще называют числом «фи».
На это число обратили внимание художники, скульпторы, архитекторы — его назвали божественной пропорцией и стали использовать в произведениях искусства, чтобы добиться идеальной композиции, наилучшего сочетания всех элементов произведения.
С тех пор золотое сечение находят в пропорциях гениальных произведений: пирамидах в Гизе и афинском Парфеноне, «Сотворении Адама» и сводах Сикстинской капеллы, созданных Микеланджело, «Мона Лизе» Да Винчи. Замечают золотое сечение в искусстве и дизайне наших дней. Его находят даже в логотипах современных компаний — например, Пепси и Твиттера. Именно с этим математическим явлением многие связывают привлекательность этих предметов искусства и дизайна.
Давайте разберемся, как применять золотое сечение как пропорцию в дизайне. Для начала примерим ее на разные фигуры. Вот, например, квадрат и прямоугольник. Одна сторона у них одинаковая, а другая у прямоугольника больше в соотношении 1 к 1.618:
Если объединить эти фигуры, получится прямоугольник с золотым сечением. Его еще называют золотым прямоугольником:
Особенность этого прямоугольника в том, что, сколько бы вы ни отрезали от него квадратов, стороны оставшегося прямоугольника всегда будут сохранять соотношение 1 к 1,168.
Заметили цифры в квадратах? Это математическая последовательность, которая раскрывает математическое совершенство золотого сечения, — последовательность Фибоначчи (поэтому божественную пропорцияю часто называют «золотое сечение Фибоначчи»). Она составляется по простейшему правилу: каждое следующее число — это сумма двух предыдущих:
0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144…
Следующий шаг — спираль, построенная на основе золотого сечения. Чтобы создать ее, соединим углы квадратов дугой:
Такую спираль можно встретить не только в чертежах, но и в живой природе. Цветы и стебли, раковины и даже ураганы созданы как будто с помощью божественной пропорции.
Следущий шаг — впишем в квадраты круги. Они тоже соотносятся друг с другом в пропорции 1:1.618 и соответствуют правилу золотого сечения.
Итак, мы составили прямоугольники, спираль и круги на основе золотого сечения. Пора разобраться, как это применяют художники и чем он может быть полезен дизайнерам.
Как использовать золотое сечение в дизайне
Золотое сечение можно использовать, чтобы создать привлекательный макет, гармонично расположить элементы дизайна и согласовать их размеры между собой, сделать красивые снимки и рисунки.
1. Принцип золотого сечения в макетах
«Золотой прямоугольник» можно использовать для того, чтобы согласовать размеры элементов макета. Самый простой способ — установить между ними соотношение 1 к 1,618.
Например, если применить правило золотого сечения к макету шириной 960 пикселей и разделить ширину на 1,618, то его высота составит 594 пикселя. Разобьем получившийся прямоугольник на две части с соотношением сторон 1 к 1,168. Осталось только заполнить две части запоминающимися снимками — и макет готов.
Макет из двух колонок, построенный на основе «золотого прямоугольника»
Такое деление на колонки подойдет для веб-дизайна. Вот более сложный пример — сайт National Geographic. На что вы посмотрели в первую очередь на этой странице? Наверняка на заголовок и крупный снимок, после — на снимки поменьше и колонку слева. Золотое сечение помогает создать четкую иерархию элементов и управлять вниманием пользователя.
Золотое сечение помогает выделить главное на сайте National Geographic
Попробуйте определить, как работает золотое сечение в шаблонах «Обложка фотокниги» и «Обложка книги по урбанистике».
2. «Воздух» между элементами
«Воздух» — это свободное пространство вокруг элементов дизайна. Он структурирует макет и выделяет важные детали. Чтобы грамотно распределить интервалы между объектами, наложите на свой макет «золотой прямоугольник» (несколько, если нужно).
Располагайте элементы по краям или углам полученных областей — и макет будет выглядеть цельным и законченным.
Дизайн-студия Moodley разработала айдентику для фестиваля искусств Bregenzer Festspiele. В корпоративный стиль вошли логоиип, подпись и шаблоны для программ, афиш и наружной рекламы. При этом на афишах вокруг коллажей из картин и фотографий много свободного пространства. Золотое сечение помогает распределить его так, чтобы оно подчеркивало основные элементы дизайна, обращало на них внимание смотрящего. Используйте это при создании вашей айдентики.
А вот визитные карточки, которые разработало сингапурское дизайн-агентство Lemon Graphic для Terkaya Wealth Management. Всего три элемента — два логотипа и подпись — выстроены в красивую композицию с помощью свободного пространства. Понадобилось два «золотых прямоугольника», чтобы создать этот дизайн
Оформите свои визитки с помощью шаблонов «Визитка директора музыкальной группы» и «Визитка свадебного ассистента».
3. Содержание — в сердце «золотой спирали»
Золотую спираль можно использовать для того, чтобы распределить объекты на плоскости. В центр можно поставить самые важные детали, а остальные — привязать к линии спирали.
Это сайт графического дизайнера Тима Роузиля отличается плотной версткой и интересным расположением элементов, основанным на золотом сечении. Обратите внимание, как автор привязал крупные элементы сайта (Текст Bonjour My Name is Tim) к более широкой части спирали, а мелкие (описание своей работы и логотип) организовал в ее центре. Именно в таком порядке глаз читающего и познакомится с материалом на странице. Так золотое сечение помогает управлять порядком чтения.
На экспериментальном плакате Saastamoisen säätiö элементы становятся меньше и плотнее по мере того, как золотая спираль заворачивается к своему центру. С каждым шагом уменьшается и размер букв, и расстояние между ними.
Дизайнеры из Helms Workshop использовали золотую спираль в логотипе пивоварни Fullsteam Brewery. Они «разложили» по квадратам элементы дизайна: сначала глаз цепляется за потрет, после взгляд останавливается на штампе в правом углу и переходит к мелкой подписи ABV и месту производства. Так на одной картинке разместился целый рассказ о бренде: его владелец (к слову, вымышленный), традиции, истоки.
Попробуйте организовать свой дизайн с помощью золотой спирали с нашими шаблонами «Бюро путешествий «Дороги» и «Медцентр университета».
4. Золотое сечение в фотографии и архитектуре
Скульпторы и архитекторы использовали в своих работах золотое сечение, потому что увидели в нем божественную гармонию. Эта пропорция действительно помогает сделать снимки более выразительными и эстетически привлекательными. С ее помощью можно расставить акценты на картине или подчеркнуть важные детали на снимке.
Чтобы применить золотое сечение в фотографии, разделим снимок на девять частей: проведем три линии по горизонтали и три по вертикали. При этом соотношения между столбцами и между строками составляют 1 к 0,618 к 1. Посмотрите: на картинке крайние столбцы и строки шире центральных.
На линиях, которые мы начертили, и их пересечениях и будут останавливать свой взгляд зрители.
Другой (слегка упрощенный) способ организовать снимок с помощью золотого сечения — это так называемое «правило третей». Снимок точно так же делят вертикальными и горизонтальными линиями, но на равные прямоугольники — в соотношении 1 к 1 к 1. Важные элементы помещают вокруг центрального прямоугольника, в его четырех углах.
Вот, например, обложка Complex magazine, в проектировании которой использовали принцип золотого сечения. Центральный квадрат наполнен деталями, в его углах — глаза и нос модели, а по краям композиции размещены квадраты с «воздухом».
А эту обложку Pilot magazine создали по упрощенному правилу третей. Снова глаза — самая выразительная часть лица — на пересечении двух линий.
Обычно, делая снимок, начинающие фотографы стремятся поместить модель в центр. Но если выровнять лицо по одной из линий золотого сечения, композиция становится динамичнее и интереснее. Пример — эффектная обложка Feld magazine.
В этой обложке хочется обратить внимание не только на снимок, но и на шапку журнала. Начертите золотую спираль — и вы сразу заметите, что именно на ней построена иерархия элементов обложки.
Используйте правило третей в фотографии и правило золотого сечения в дизайне. Начните с наших шаблонов «Цитата дня» и «Коту нужно внимание».
5. Формы: как круги помогают создавать логотипы
В нашем запасе остался еще один способ использования золотого сечения — построенные на основе этой пропорции окружности. Они помогут создать аккуратный логотип.
Создавая сложную фигуру, можно использовать круги, чтобы проверять детали на соразмерность и пропорциональность. Вот, к примеру, логотипы Пепси и Твитера.
Логотип Пепси построен на двух окружностях, созданных по принципу золотого сечения. При этом внутренний круг почти не заметен: его можно выделить, если внимательно посмотреть на белый «блик» на логотипе. Заметили?
С логотипом Твитера немного сложнее. Те же два круга помогли дизайнерам сделать аккуратные крылья, пропорциональные телу птички.
Принцип золотого сечения — это не неприступный закон искусства. Это математика, которая помогает сделать любые визуальные произведения более выразительными и притягательными. Попробуйте применить ее к своей композиции — и оцените четкую структуру, гармоничность и эстетичность, которые она привнесет в ваш дизайн.
Блог о визуальной грамотности 