UI дизайн. Дизайн сайта. Часть первая. Правило равновесия.

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

Композиция “copmpositio” от латинского языка - сложение, сопосталевние, приведение частей в единство. Это древнее правило, известное архитекторами еще в древней Греции, используется и опытными веб-дизайнерами сегодня.

Основы композиции в веб-дизайне

• Правило равновесия
• Правило ритма
• Правило перспективы
• Вертикали и горизонтали как постоянные оси по отношению ко всем другим направлениям.

Правило равновесия.

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

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

Радиальная. В ее основу входит теория Фибоначчи. Web-дизайн чаще всего не использует данное равновесие.

Трансляцонная (криталографическая). Для Web-дизайнера это наиболее интересная симметрия, так как такая симметрия подразумевает повторение элементов композиции через определенные промежутки.В Web дизайне это модульная сетка, которая значительно упрощает и ускоряет работу. О работе с модульной сеткой вы узнаете немного позже.

Асимметрия

Асимметрия - отсутствие или нарушение симметрии. Асимметрия сохраняет равновесие композиции. Асимметричная симметрия достигается с помощью простого правила - правила третей. Расположить элементы в каждом кейсе вам поможет правило третей. Для этого достаточно разделить длину на три и ширину на три равные части. у вас должна получиться сетка. После того как у вас получится сетка , вы должны аккуратно расположить элементы на пересечениях этих линий или на самих линиях.

Иногда картинку хочется сделать объемной, в этом нам поможет перспектива. Но как расположить элемент в перспективе? У правила третей есть еще одно правило - правило диагоналей, которые находятся под наклоном. Применяется на практике оно тоже просто. Проводим диагонали и получаем треугольник, который можно переворачивать как угодно.Проще говоря вам необходимо расположить сетку в перспективе. На линиях этих треугольниках вы можете расположить нужные элементы.

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

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

Оригинальная статья на сайте https://onlinebd.ru/blog/ui-dizain-dizain-saita-chast-pervaya-pravilo-ravnovesiya