Закругле­ние углов относи­тельно содержания

ok|notok (ru)


Объекты и предметы с закруглёнными углами воспринимаются нами более органично чем с острыми углами, так как в природе почти не существует абсолютно острых углов.

На улицах городов вы видите красивые вывески, в кармане телефон, а в телефоне миллионы приложений сайтов и все это с закруглённым элементами.

Основные варианты закругления углов (удачные и не очень):

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

Хороший дизайнер чувствует на сколько можно скруглить углы. Но если у него плохое чувство «прекрасного», он может заучить одно правило:

«Область контента не должна пересекать центр круга скругления»

Если у контента есть подложка, то она может пересечь только одну из осей (проходящих через центр круга). Например, экран устройства — это подложка для контента, поэтому пересекает вертикальную ось скругления.


Парочка примеров из сферы промышленного дизайна:

Для эргономичности у смартфонов скругляют углы
Иногда слишком стараются в этом уйти от конкурентов


Экран ноутбука, для увеличения долговечности корпуса, так же закругляют
Тот же ноутбук, но более позней версии

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

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

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

«Если длинна закруглённой части больше длинны не закруглённой, то эту фигуру можно считать кругом»

На такие фигуры правило закругления не действует.


В конце еще хотелось бы напомнить о правильном вложении закругленных объектов:

Радиусы: 90-70-50.
Закругления пропорционально уменьшаются в зависимости от расстояния до границы родительской фигуры.
Радиусы: 90-90-15.
Вторая вложенная фигура не может иметь такой же радиус, как и внешняя. У третьей слишком маленький радиус для такого расстояния от внешней границы.

Радиус скругления внутренней фигуры всегда меньше радиуса внешней. Чем меньше радиус у вложенного объекта, тем больший отступ от границ родительского объекта.

Email me when Блогеры Рунета (RU-UA) publishes stories