Золотое сечение в дизайне и жизни

золотое сечение баннер

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

Что общего у пирамиды в Гизе и Мона Лизы с логотипом Пепси? И то, и другое создано с помощью золотого сечения. В этой статье мы разберем, что это такое и как его использовать в создании дизайна. 

Правило золотого сечения

Золотое сечение — пропорция, которую заметили еще древние египтяне. Чтобы её получить, нужно разделить линию на две части так, чтобы длинная часть соотносилась с короткой в такой же пропорции, как вся линия соотносится с длинной. Оказывается, эта пропорция всегда равняется 1,618. Это число еще называют числом «фи».

1-0814

Формула золотого сечения

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

С тех пор золотое сечение находят в пропорциях гениальных произведений: пирамидах в Гизе и афинском Парфеноне, «Сотворении Адама» и сводах Сикстинской капеллы, созданных Микеланджело, «Мона Лизе» Да Винчи. Замечают золотое сечение в искусстве и дизайне наших дней. Его находят даже в логотипах современных компаний — например, Пепси и Твиттера. Именно с этим математическим явлением многие связывают привлекательность этих предметов искусства и дизайна. 

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

2-0814

троим прямоугольник с помощью золотого сечения

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

3-0814

«Золотой прямоугольник»

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

4-0814

Заметили цифры в квадратах? Это математическая последовательность, которая раскрывает математическое совершенство золотого сечения, — последовательность Фибоначчи (поэтому божественную пропорцияю часто называют «золотое сечение Фибоначчи»). Она составляется по простейшему правилу: каждое следующее число — это сумма двух предыдущих: 

0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144…

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

5-0814

Спираль с пропорциями золотого сечения

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

image29-0913

Золотое сечение: примеры в природе

Следущий шаг — впишем в квадраты круги. Они тоже соотносятся друг с другом в пропорции 1:1.618 и соответствуют правилу золотого сечения.

7-0814

Золотое сечение на примере кругов

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

Как использовать золотое сечение в дизайне

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

1. Принцип золотого сечения в макетах 

«Золотой прямоугольник» можно использовать для того, чтобы согласовать размеры элементов макета. Самый простой способ — установить между ними соотношение 1 к 1,618.

Например, если применить правило золотого сечения к макету шириной 960 пикселей и разделить ширину на 1,618, то его высота составит 594 пикселя. Разобьем получившийся прямоугольник на две части с соотношением сторон 1 к 1,168. Осталось только заполнить две части запоминающимися снимками — и макет готов.

8-0814

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

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

9-0814

Золотое сечение помогает выделить главное на сайте National Geographic

Попробуйте определить, как работает золотое сечение в шаблонах «Обложка фотокниги» и «Обложка книги по урбанистике».

2. «Воздух» между элементами

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

12-0814

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

Дизайн-студия Moodley разработала айдентику для фестиваля искусств Bregenzer Festspiele. В корпоративный стиль вошли логоиип, подпись и шаблоны для программ, афиш и наружной рекламы. При этом на афишах вокруг коллажей из картин и фотографий много свободного пространства.  Золотое сечение помогает распределить его так, чтобы оно подчеркивало основные элементы дизайна, обращало на них внимание смотрящего. Используйте это при создании вашей айдентики.

Фирменный стиль фестиваля Bregenzer Festspiele от дизайн-студия Moody

А вот визитные карточки, которые разработало сингапурское дизайн-агентство Lemon Graphic для  Terkaya Wealth Management. Всего три элемента — два логотипа и подпись — выстроены в красивую композицию с помощью свободного пространства. Понадобилось два «золотых прямоугольника», чтобы создать этот дизайн

Снимок экрана 2019-08-29 в 17.28.33

Такой текст сложно и скучно читать

Оформите свои визитки с помощью шаблонов «Визитка директора музыкальной группы» и «Визитка свадебного ассистента».

3. Содержание — в сердце «золотой спирали»

Золотую спираль можно использовать для того, чтобы распределить объекты на плоскости. В центр можно поставить самые важные детали, а остальные — привязать к линии спирали.

0913image-01

Это сайт графического дизайнера Тима Роузиля отличается плотной версткой и интересным расположением элементов, основанным на золотом сечении. Обратите внимание, как автор привязал крупные элементы сайта (Текст Bonjour My Name is Tim) к более широкой части спирали, а мелкие (осаисание своей работы и логотип) организовал в ее центре. Именно в таком порядке глаз читающего и познакомиться с материалом на странице. Так золотое сечение помогает управлять порядком чтения.

0913image-02

Сайт графического дизайнера Тима Роузиля

На экспериментальном плакате Saastamoisen säätiö элементы становятся меньше и плотнее по мере того, как золотая спираль заворачивается к своему центру. С каждым шагом уменьшается и размер букв, и расстояние между ними.

19-0814

Айдентика Saastamoisen säätiö

Дизайнеры из Helms Workshop использовали золотую спираль в логотипе пивоварни Fullsteam Brewery. Они «разложили» по квадратам элементы дизайна: сначала глаз цепляется за потрет, после взгляд останавлвается на штампе в правом углу и переходит к мелкой подписи ABV и месту производства. Так на одной картинке разместился целый рассказ о бренде: его владелец (к слову, вымышленный), традиции, истоки.

0913image-03

Айдентика Fullsteam Brewery от Helms Workshop

Попробуйте организовать свой дизайн с помощью золотой спирали с нашими шаблонами «Бюро путешествий «Дороги» и «Медцентр университета».

4. Золотое сечение в фотографии и архитектуре 

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

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

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

0913-image-06

Золотое сечение: пример использования в фотографии

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

Вот, например, обложка Complex magazine, в проектировании которой использовали принцип золотого сечения. Центральный квадрат наполнен деталями, в его углах — глаза и нос модели, а по краям композиции размещены квадраты с «воздухом». 

Обложка Complex Magazine

Обложка Complex Magazine

А эту обложку Pilot magazine создали по упрощенному правилу третей. Снова глаза — самая выразительная часть лица — на пересечении двух линий. 

25-0814

Обложка Pilot Magazine, Jason Mildren

Обычно, делая снимок, начинающие фотографы стремятся поместить модель в центр. Но если выровнять лицо по одной из линий золотого сечения, композиция становится динамичнее и интереснее. Пример — эффектная обложка Feld magazine.

0913-Обложка Feld Magazine

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

27-0814

Золотая спираль в обложке Feld Magazine

Используйте правило третей в фотографии и правило золотого сечения в дизайне. Начните с наших шаблонов «Цитата дня» и «Коту нужно внимание».

5. Формы: как круги помогают создавать логотипы

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

30-0814

Живая обложка группы Cropp Russia

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

Логотип Пепси построен на двух окружностях, созданных по принципу золотого сечения. При этом внутренний круг почти не заметен: его можно выделить, если внимательно посмотреть на белый «блик» на  логотипе. Заметили?

image13-0903

Логотип Пепси и золотое сечение

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

image11-0903

Логотип Твитера и золотое сечение

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

Подписывайтесь на обновления в Телеграме, Фейсбуке, ВКонтакте и Яндекс Дзене, чтобы всегда быть в курсе трендов графического дизайна и возможностей Canva, которые помогут воплотить их в жизнь!

Ваше секретное средство для потрясающих дизайнов