又一新的UI趋势来了？Squirclemorphism！

静电说：现在各种新的UI趋势层出不穷，从简单的扁平化设计，到物料设计，再到新拟物风格（neuomorphism）和毛玻璃风格（glassmorphism）。而在最近的文章中，静电发现了另一篇关于趋势的研究。我们把它称之为：Squirclemorphism。emmm，这个词挺不好翻译，大概为一种带有圆角的矩形。

Squirclemorphism是什么？ 

它不是圆角矩形，也不是圆形。形状独特而微妙，但有很大的不同。当 iOS 7 出现时，它首先在数字设计中被注意到。应用程序图标被 squircle 掩盖。从那时起，设计师就爱上了这种形状。

在Figma工程师的一篇探讨中，我们可以一窥Squirclemorphism的究竟。

而在Sketch的设定中，我们也可以找到其身影。在这个软件中，这两个名词被翻译为圆角和平滑圆角。

那我们就索性把这种“平滑圆角”叫做“Squirclemorphism（超圆角or方圆角）”吧。

Squirclemorphism 的兴起

最初，这种形状用于重新创建 iOS 应用程序图标。正如我所提到的，标准圆角矩形和方圆角之间的区别很微妙但很明显。我们一直想让我们的设计看起来很现代，所以我们希望用这种新形状来给我们的应用程序图标来点新鲜感。

然后设计师意识到它可能用于其他元素。我们中的一些人开始在卡片角落使用它，制作优雅的图标。这只是一个开始……

现在您可能会在 UI 设计中随处看到各种形式的圆角形状。不仅仅是图标，还有各种图形的边缘。

Squirclemorphism这种图形的规律，就是它看起来是矩形，但又不是完完全全的矩形。现在，越来越多的地方开始使用这种非规则的圆角矩形来进行页面创意，这就是今天我们所要阐述的重点，毕竟，单单是超圆角矩形的图标就太Out了。

Instagram上的

Squirclemorphism

最初，我注意到Squirclemorphism在 Instagram 上越来越受欢迎，因为它必要的创新元素。在 Dribbble 中，这种创新也会被大量使用。看看下面的图片，哪些地方使用了这些不规则的圆角。

当然，Dribbble上的设计也非常多，大家仔细观察下图：

您肯定会注意到，大多数设计只是为了展示其创作者的技能。它们不在实际应用中使用。

在Figma中使用

Squirclemorphism

默认情况下，Figma会创建规则的圆角矩形。为了实现我们要的特殊形状，您必须在圆角半径中添加“圆角平滑（Corner  smoothing）”。要激活这个选项，您必须按拐角半径图标以显示每个拐角的详细半径设置。然后在带有 3 个点的弹出菜单图标下，您将找到“角平滑（Corner  smoothing）”选项。单击它，您将看到一个带有滑块的弹出窗口。

如果要达到类似iOS的效果，滑动到60%左右，要最大化效果，使用100%。就是这么简单！

在Sketch中使用

Squirclemorphism

在 Sketch 中制作这种效果更容易。当您的图层具有圆角矩形形状时，您所要做的就是转到检查器面板（右侧的面板）并选择下拉菜单“半径（圆角”）。将选项更改为“平滑角”。现在，你的Squirclemorphism就制作好了。

原文：https://blog.prototypr.io/squirclemorphism-in-user-interfaces-9a3f2c157c08

作者：Thalion

总结

Squirclemoprhism 始于一个小元素——iOS7 应用程序图标。现在它几乎用于所有具有圆角的元素。显然，并不是所有的Squirclemoprhism在实际应用中都很好，但这种趋势为我们提供了一种思路：UI创意大多源于细节，多琢磨细节，你也可以让这一创意成为“趋势”。

各位设计师小伙伴，你如何看待 Squirclemorphism？是否使用带有平滑角的形状呢？欢迎在评论区留言。