Прилагане на Златно съотношение в съвременните дизайни

Идеалната уеб страница е едновременно функционална и хармонична, но дори и най-опитите уеб дизайнери могат да имат проблеми да ви кажат какво дава естествения поток на дизайна. Въпреки цветовите и навигационните теории, понякога най-важният аспект на естетиката на перфектната уеб страница изглежда неизразим. Не знаем защо работи, но понякога просто го прави. Всичко може да се дължи на проста концепция.

Като подкрепите дизайна на уебсайта си с буквално естествен ред, зрителите може да открият, че вашият дизайн е по-интересен и естествено приятен. Тази концепция се нарича златно съотношение, математическа концепция, която природата се подчинява и която ние, хората, подсъзнателно разпознаваме като израз на съвършенство.

Златното?

С прости думи, златното съотношение (известно още като божествена пропорция или златна среда), е математическа константа, която се появява многократно в природата и произведенията на изкуството.

Изразява се като уравнение, когато а е по-голям от б, (a + b) разделена на а е равно на а разделена на б (просто погледнете изображението по-долу), което е равно на около 1.618033987. Този брой, често представен от гръцкия символ "phi", е златно съотношение.

(Източник на изображението: mathsisfun.com)

Същата теория може да се използва за изграждане на правоъгълник, наречен златен правоъгълник. Изображение, което следва златното съотношение, може да се постави спретнато в правоъгълник, който се подчинява на съотношението.

(Източник на изображението: creativeautomaton.com)

За да построите златен правоъгълник, изберете число, което ще бъде дължината на късата страна на правоъгълника. За аргумент, да кажем 500 пиксела. Умножете това с 1.618. Резултатът, 809 пиксела, е дължината на дългата страна на вашия правоъгълник. Следователно, правоъгълник, който е 500 пиксела по 809 пиксела, е златен правоъгълник. Той се подчинява на златното съотношение.

Естествена красота

Всъщност учените не са сигурни какво е съотношението, което хората харесват толкова много. Това, за което са сигурни, е колко много ни харесва. Проучванията показват, че дори малки промени в изображението, което го прави по-вярно до златното съотношение, имат голямо влияние върху мозъците на онези, които търсят.

Човешкото лице следва същото съотношение и ние откриваме хора, чиито лица са по-истински от съотношението по-привлекателно. Черупките, класическите ренесансови шедьоври, архитектурата от древността и дори частите на човешкото тяло са пропорционални на базата на съотношението до самите пръсти.

(Източник на изображението: in2visualdesign)

Нещо дълбоко в сърцето на нашия ум регистрира златното съотношение, което е красиво, което художниците и архитектите са използвали хиляди години, съзнателно или не. Това е първичен език в образите. Резултатът е органичен, интуитивен и просто се чувства добре.

Божествена композиция

Как тогава използвате това магическо число в състава на вашата уеб страница? Математиката може да изглежда като задушаваща кутия, в която твоята креативност ще се бори, но златното съотношение е просто полезна насока. Наличието на основна насока, от която да се изгради, може да ви даде по-креативна стая, като вземете част от предположенията за пропорции и разположение.

Мислете за него като за инструмент вместо за клетка. В най-основните си, можете да използвате златното съотношение, за да определите размера и разположението на областите на съдържанието и страничните ленти. Положението с фиксирана ширина е най-лесното приложение. Определете общия размер на оформлението си чрез метода за създаване на златен правоъгълник.

За решетки / блокове

Квадратът, създаден от редовете, ще бъде вашият блок със съдържание. По-малкият правоъгълник ще бъде странична или навигационна лента. След като сте измислили размера на вашия правоъгълник, разберете колко широка е навигационната ви лента, за да бъде лесно.

За този пример ще кажем, че вашият правоъгълник е 525 пиксели от 850 пиксела.
525 е а и 850 е (a + b), и б ще бъде ширината на страничната ви лента.
Да намеря б, ние просто изваждаме от (a + b), което е 325.
Следователно ширината на страничната ви лента е 325.

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

За текст

Има по-бърз начин да получите необходимите измервания и той може да се приложи с текстово съдържание.

Да кажем, че текстът ви от контекста е с размер 12.
Умножете 12 с 1.618, златното съотношение и ще получите 19.416.
Заглавният текст с размер 19 или 20 ще следи отблизо златното съотношение.

Златното съотношение е език, който вашият ум разбира, а чрез общуване с него вашите идеи ще се сблъскат по-ефективно. Не е нужно да се придържате към него точно; основният принцип е достатъчен. Прилагайки съотношението към размерите на изображението, връзката между разположението на текста и изображението и създаването на подразделения в страничните ленти са всички възможни понятия.

Работа в мрежата: Правилото на третините

Ако математиката не е чаша чай, концепцията за златното съотношение може да бъде опростена. Най- правило на трети урежда поставянето на интересни места в дадена сцена. Разделете всяко изображение на трета хоризонтално и вертикално. Ще получите 9 мрежи.

(Източник на изображението: digital-photography-school.com)

Според правилото на третите, върховете на тези линии (където линиите се пресичат) са идеалното разположение за интересни места. Хората, които сканират страницата, са по-склонни да забележат неща, поставени в близост до точките, а разделянето е удобно за гледане. По-сложният дизайн е възможен чрез разбиване на тези трети на допълнителни трети.

(Източник на изображението: net.tutsplus.com)

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

Колони и размери на шрифтове: последователности на Фибоначи

Друг прост инструмент за уеб дизайн, свързан със златното съотношение е Числата на Фибоначи. Последователността на Фибоначи започва с 0 и 1. Предишните две числа се добавят заедно, за да се получи следващото число в последователността: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34 ... и така нататък.

Малка математика ни казва, че връзката между последователните номера на Фибоначи е поразително близка до златното съотношение - разделете произволния номер в последователността с номера преди него и ще получите - предполагате - 1.618.

Както и при златното съотношение, числата на Фибоначи могат да се използват, за да диктуват връзката между заглавието и размерите на текста. Тя може да се използва и за обозначаване на ширината на колоните и е особено ефективна в блогове и други текстоплотни оформления. Композицията може да бъде изградена и върху концепцията за облицовка на Фибоначи, в която размерът на плочките се изгражда при използване на последователността на Фибоначи.

(Източник на изображението: Wikipedia.org)

Златни спирали и групиране на съдържание

Друг възможен метод за използване както на златното съотношение, така и на числата на Фибоначи, е златни спирали и спирали на Фибоначи. Златни спирали се разширяват с коефициент, равен на златното съотношение за всяко тримесечие, което те правят, и спиралите на Фибоначи се формират с използване на фибоначи.

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

(Източник на изображението: fabiovisentin.com)

Спиралите могат да служат като насока за плътност на съдържанието и групиране. Те могат да служат като основа за съотношението на заглавните изображения на уебсайта, лентите за търсене и лентите с инструменти.

Когато избирате идеалната снимка за първа страница, изградена около големи графики, като начални страници на магазини и фотографски сайтове, можете да се възползвате и от златните спирали и фибоначи..

Мощните съобщения често са подсъзнателни, а златното съотношение е една от най-плодотворните подсъзнателни реклами на природата. Използвайки божествената пропорция, вие си давате край на естествената логика и органичната благодат, към която всички хора имат подсъзнателно привличане. Златното съотношение е още един инструмент в творческото Ви разположение.

Още за четене:

Прилагане на Златно съотношение към уеб оформления и обекти

Бележка на редактора: Тази публикация е написана от Крис Пентаго за Hongkiat.com. Крис е опитен уеб разработчик, дизайнер и интернет маркетолог, който се интересува от ключови технологии, за да направи вашия онлайн бизнес успешен..