Как сделать «волнистый» угол у изображения?

Question

[Артем Федоров]

Как вообще создавать такие вот "вогнуто-волнистые" углы через фотошоп или иллюстратор, через что, через Figma, может есть какие-то решения готовые?

Comments

[Ankhena]

1. Банальный вариант.
Фон однотонный => берете накладываете "уголок" нужной формы.
2. Рисуете фигуру, применяете маску.

[Артем Федоров]

Ankhena, найти бы ещё такую фигуру)

[Ankhena]

Артем Федоров, перышком. Или объединением/вычитанием простых фигур.

[Александр Васильев]

Потом снова будут спрашивать - как такое сверстать.

[Ankhena]

Александр Васильев, куда денутся.
Только это верстается довольно просто.

[Ankhena]

Артем Федоров,
Например, так в Фигме: вычитаем из прямоугольника круг и скругляем углы

Скрин

[Александр Васильев]

Ankhena, вопросы плодятся из-за формулировок. Надо как-то стандартизировать наименование этого «модного» дизайнерского тренда.
«Вогнуто-волнистые углы…

[Артем Федоров]

Александр Васильев, я просто задал вопрос, лишь бы докопаться. Как из называть по вашему?

[Ankhena]

Александр Васильев, придумайте и несите в массы.

[Артем Федоров]

Ankhena, спасибо!

[Александр Васильев]

Артем Федоров, все в порядке)))
Просто так поэтично эти штуки еще не называли. Обычно спрашивают как их верстать и чем только не обзывают.
А тут чувствуется рука художника

[ANKU]

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

Если в ФШ то можно шаблонизировать - отрисуйте фигуры масок, которые часто используете, сделайте слой под избражение, выполните все сведения, разбейте на папки, подпишите чтоб не запутаться. Экспортните проектом. Потом просто открываете проект, меняете картинку, включаете нужную слой-маску и экспортируете.

Answer 1

[ImagineTables]

1. Два round rect'а (широкий и высокий слева, короткий и узкий справа) слить, затем вычесть круг из правого нижнего угла.

См. https://www.youtube.com/watch?v=yGOCqLBMRJg

2. Использовать комбинированный шейп как маску прозрачности.

Как вариант, накачать .csh с девианта и рутрекера, в том числе с разной геометрией и рамками, но тут проще самому нарисовать. (.csh это кастомные шейпы).