Как называется прямоугольник со скругленными углами
Перейти к содержимому

Как называется прямоугольник со скругленными углами

  • автор:

Как называется прямоугольник с закруглёнными углами?

Как называется этот округлённик? Или у него нет научного названия?

Голосование за лучший ответ
https://ru.wikipedia.org/wiki/Суперэллипс
5 секунд потребовалось, чтобы загуглить
Каиркан КульжановПрофи (804) 2 года назад
Не то, так как это целая категория фигур, а не только скруглённый прямоугольник
. Мыслитель (8266) Каиркан Кульжанов, Так скругленный прямоугольник это частный случай суперэллипса.
RomanПрофи (763) 2 года назад

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

Сквиркл. суперэллипс с определенными параметрами
Каиркан КульжановПрофи (804) 2 года назад
Сквиркл это скруглённый квадрат

Краткое название отсутствует, есть частный случай сквиркл (square (квадрат) + circle (круг)), т. е квадрокруг.

округленник на самом деле отличное слово для этого. Голосую за него!
Похожие вопросы
Ваш браузер устарел

Мы постоянно добавляем новый функционал в основной интерфейс проекта. К сожалению, старые браузеры не в состоянии качественно работать с современными программными продуктами. Для корректной работы используйте последние версии браузеров Chrome, Mozilla Firefox, Opera, Microsoft Edge или установите браузер Atom.

Суперэллипс — фигура, которую многие видят каждый день, но не догадываются об этом

Приветствую Вас! Сегодня мы поговорим об интересной кривой, у которой есть своё название — суперэллипс.

Оглянитесь вокруг. Какие фигуры вы видите? Скорее всего, большинство фигур имеет либо прямые (острые, тупые) углы либо эллипсоидные (не всегда идеально круглые) границы. Однако, существуют и гибриды. Суперэллипсы — это семейство кривых, которые лежат где‑то между эллипсами и прямоугольниками.

Для начала вспомним, что из себя представляет обычный эллипс — кривую второго порядка:

Коэффициенты a и b определяют «приплюснутость» эллипса по горизонтали и вертикали соответственно:

Но что, если вторые степени заменить чем‑то другим? Если возвести в куб, в четвертую степень и т.д?

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

Площадь Сергеля

Архитектор Пит Хейн искал наиболее эстетичную, но и эффективную форму, о чем писал:

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

Но мы в смирительной рубашке, вынуждены принимать то одно, то другое, когда часто какая‑то промежуточная форма была бы лучше. Рисовать что‑то от руки — например, многоуровневое дорожное кольцо, которое они пробовали в Стокгольме, — не годится. Суперэллипс решил проблему. Он не круглый и не прямоугольный, а что‑то среднее. Тем не менее, она фиксирована, она определенна — в ней есть единство.

Уравнение суперэллипса в общем виде записывается следующим образом:

В зависимости от соотношения параметра n можно получить целую россыпь фигур.

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

Когда n = 1, вы получаете ромб с вершинами на осях координат.

Когда n = 2, вы получаете эллипс (или, если a и b равны — окружности).

Если значение n > 2, у вас получается суперэллипс. (при проектировании площади, о которой я говорил выше, использовался параметр 2,5).

По мере приближения n к бесконечности получаем прямоугольник.

Сквиркл - особый суперэллипс с n=4

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

Если вы повернете суперэллипс вокруг главной оси, получится суперяйцо, которое устойчиво относительно своих биологических аналогов:

Форму суперэллипса имеют архитектурные объекты, предметы интерьера, логотипы брендов и команд:

Однако подавляющее число людей впервые увидело суперэллипс. когда взяли в руки Iphone! Дело в том, что начиная c шестой версии iOs, дизайнеры перестали использовать прямоугольники с закруглением, а перешли к суперэллипсам:

По ощущениям здесь используется суперэллипс с коэффициентом n = 5..7. Если и этого недостаточно, то знайте, что супСуперэллипс — фигура, которую многие видят каждый день, но не догадываются об этомерэллипс фигурировал в статье «Геометрическое моделирование и гидродинамический анализ плавающих сперматозоидов», жаль только, что этой публикации нет в открытом доступе.

Больше математики в Telegram — «Математика не для всех»

Закругленные углы (суперэллипс) в экосистеме Apple

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

Squircle

Для этой фигуры есть термин. Она называется squircle (суперэллипс), и представляет собой помесь круга и квадрата. В отличие от обычных закругленных прямоугольников, у которых угол имеет идеальный полукруг, суперэллипс имеет более сжатую форму. Скругление угла не начинается внезапно, вместо этого кривая начинается глубоко внутри прямой и постепенно перерастает в видимую кривую (как показано на изображении 1.1). Изображение 1.0 Третья комбинированная фигура усиливает этот эффект. Видимая синяя часть подрезается, чтобы получились более гладкие и мягкие углы Изображение 1.1 Суперэллипс (красная фигура) начинает округляться глубже по прямой линии, чем простой прямоугольник с закругленными углами (синяя фигура) В то время, как прямоугольники с закругленными углами имеют постоянный угловой радиус, угловой радиус суперэллипса уменьшается или сжимается по мере углубления кривой, а затем снова симметрично расширяется на другой стороне кривой. (Подробнее о математических расчетах, лежащих в основе этой фигуры стоит прочитать в этой статье).

Эффект

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

Примеры

Мне стало любопытно, насколько распространена форма суперэллипса в экосистеме Apple, поэтому я начал фотографировать все, что мог, и накладывать фигуры на изображения (см. изображение 2.2). Я рассмотрел HomePod, где суперэллипс очевиден, а также iPad, клавиши новой клавиатуры iPad, Apple Watch и кнопки покупки в приложениях Apple TV, Apple News и Apple Music. Как оказалось, суперэллипс есть везде. Изображение 2.0 HomePod. При любом освещении вы не найдете острого угла Изображение 2.1. Клавиатура iPad Изображение 2.2 Типичный прямоугольник с закругленными углами, наложенный на силуэт iPad. Обратите внимание на едва заметные розовые участки, где закругленный прямоугольник выступает за суперэллипс (корпус iPad) Изображение 2.3 Пункт управления, элементы управления внешним видом и подписка в Apple News +. Обратите внимание, что, несмотря на нарушение руководящих принципов Apple по поводу встроенных в приложение покупок, кнопка «Get Started» имеет форму суперэллипса Изображение 2.4 Суперэллипс дебютировал на iPhone в iOS 7, представив новую, более мягкую форму иконок приложений Мой любимый пример – HomePod. В отличие от большинства колонок, которые прячут, чтобы не нарушать интерьер, HomePod предназначен стать элементом декора комнаты. Подобно керамическим изделиям ручной работы, HomePod прекрасно смотрится при любом освещении. Ключевым моментом является его форма – независимо от того, как свет падает на устройство, зритель не может выделить острый край. Попытки использования кривых линий, как средства смягчения продукта не новы. Пит Хейн использовал squircle в 1959 году для решения транспортных проблем в Стокгольме. Центральное место в архитектурном стиле Захи Хадид занимали мягко округленные формы, чтобы напомнить о природе и придать новым строениям ощущение футуристичности. Что примечательно, так это необычайная простота суперэллипса. Эту фигуру можно использовать в наборе продуктов – цифровых или физических – без изменения основополагающих принципов или необходимости выполнения сложных математических расчетов. Именно это Apple сделала для своих аппаратных и программных интерфейсов. В результате вся экосистема компании из Купертино кажется более дружелюбной, доступной и восхитительной. Мне пришла идея написать эту статью, когда я добавлял суперэллипс в наше приложение Minimal | Notes. Если вы дизайнер или iOS-разработчик, который хочет добавить суперэллипс в свой продукт, ознакомьтесь с этими простыми инструкциями. Перевод статьи medium.com

Векторные инструменты: Прямоугольник со скруглёнными углами и Эллипс

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

Первый инструмент в стеке векторных форм — это «Прямоугольник» (Rectangle Tool), подробная инструкция по работе с ним здесь.

В данном материале я расскажу о двух следующих инструментах векторных форм — Эллипсе и Прямоугольнике со скруглёнными углами.

Прямоугольник со скруглёнными углами (The Rounded Rectangle Tool)

Рассмотрим следующий инструмент в стеке инструментов формы Photoshop — это «Прямоугольник со скруглёнными углами» (The Rounded Rectangle Tool).

rounded rectangle

Выбор инструмента «Прямоугольник со скруглёнными углами».

«Прямоугольник со скруглёнными углами» очень похож на стандартный «Прямоугольник», за исключением того, что он позволяет нам добавлять к прямоугольнику закругления на углах. Значение округлости углов задаётся при помощи опции «Радиус» (Radius) в панели параметров. Чем выше значение, тем более округлыми становятся углы. Вы должны заранее установить значение опции «Радиус», прежде чем начнёте создавать вашу форму, так что я сейчас установлю его на 20 пикселей:

опция радиус

Используйте опцию «Радиус» (Radius), чтобы установить величину округлости углов.

После того как вы установите значение радиуса скругления, рисуйте прямоугольник точно так же, как бы и рисовали обычный прямоугольник. Начните с нажатия левой клавишей мыши внутри документа, чтобы установить начальную точку для фигуры, затем, не отпуская клавишу, протащите курсор по диагонали, чтобы нарисовать остальное. Так же, как и при рисовании обычного прямоугольника, отобразится пустой контур фигуры:

скруглённые углы прямоугольник

Рисование прямоугольника со скруглёнными углами в Photoshop, методом протаскивания курсора, после установки значения радиуса углов в панели параметров.

Когда вы отпустите клавишу мыши, Photoshop завершит создание фигуры и заполнит её цветом:

прямоугольник со скруглёнными углами залитый цветом

Форма заполняется цветом, когда вы отпустите кнопку мыши.

Вот еще один пример прямоугольника с закругленными углами, на этот раз у меня значение радиуса установлено в 150 пикселей, что достаточно много в данном случае (радиус скругления больше половины высоты прямоугольника), так, что левая и правая стороны прямоугольника получились полностью изогнутыми:

слишком большой радиус скругления Прямоугольник со скруглёнными углами

Чем выше значение радиуса, тем больше скругление углов.

К сожалению, в Photoshop CS6 нет никакого способа предварительного просмотра скруглений, чтобы просмотреть, как округлые углы будут соотноситься по размеру с прямоугольником, это можно сделать только при создании прямоугольника, и мы, если понадобится, не сможем изменить размер радиуса «на лету».

Все это означает, что рисование прямоугольников со скруглёнными углами является методом «проб и ошибок».

Если вы нарисуете такой прямоугольник и решите, что вам не нравится округлость углов, всё, что вы действительно можете сделать, это только отметить шаг, нажав Ctrl+Z и попытаться создать новый, предварительно задав другое значение радиуса скруглений в панели параметров.

Но в Photoshop CC редактирование скруглений уже возможно, и присутствуют другие приятные функции, об новшествах прямоугольника со скруглёнными углами в Photoshop CC подробно рассказано здесь.

Те же сочетания клавиш, которые мы узнали о для стандартного инструмента «Прямоугольник», также применяются и к «Прямоугольнику со скруглёнными углами». Применение клавиш Shift и Alt вместе или в отдельности позволит создавать правильный квадрат от угла или от центра.

Инструмент Эллипс (Ellipse Tool)

В Photoshop инструмент «Эллипс» позволяет нам создавать эллиптические или круглые формы. Я выберу его на панели инструментов:

Ellipse Tool

Выбор инструмента «Эллипс» (Ellipse Tool)

Так же, как и с другими инструментами формы, которые мы рассмотрели выше, чтобы нарисовать эллиптическую форму, нажмите левой клавишей мыши внутри документа, чтобы установить начальную точку, и, не отпуская клавишу, протащите курсор, чтобы нарисовать остальное:

эллипс

Рисование эллиптической формы с помощью инструмента «Эллипс» (Ellipse Tool).

Отпустите кнопку мыши, чтобы завершить создание формы и Photoshop зальёт его выбранным цветом:

эллипс заполненный цветом

Заполненная цветом форма

Чтобы с помощью Ellipse Tool нарисовать круг правильной формы, во время протаскивания курсора зажмите клавишу Shift и отпустите её только после того, как закончите протаскивать курсор, т.е. точно по аналогии с созданием правильного квадрата инструментом «Прямоугольник». Чтобы начать рисовать эллиптическую форму от её центра, а не края, зажмите клавишу Alt:

круг, нарисованный инструментом "Эллипс"

Правильный круг, нарисованный инструментом «Эллипс» (Ellipse Tool).

В следующем материале я расскажу о двух оставшихся инструментах Photoshop — «Многоугольник» (Polygon Tool) и «Линия» (Line Tool), а также,о построении с помощью этих инструментов звёзд и указательных стрелок.

Владелец данного сайта. Графический дизайнер, специалист по Фотошопу с опытом 10+ лет. Также веду канал о графическом дизайне на Ютуб и развиваю тематическое сообщество во ВКонтакте. Связаться со мной можно через комментарии, форму обратной связи или по электронной почте [email protected]

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *