新拟物风格，UI设计的新趋势还是昙花一现？

据说点击 蓝色字体 关注同学都升职加薪了

——————————————————

静电说：最近设计群开始流行一个名词叫做“新拟物（Neuomorphism）”，什么叫做新拟物风格呢？简单粗暴先看图感受一下：

其实这种风格在去年年底已经开始有讨论的声音，它的原词叫做New skeuomorphism（新拟物风格），经过简化后成为一个新词Neuomorphism，另外，还有一个词来描述这种风格，那就是Soft UI。

新拟物风格是啥？

人类总是喜新厌旧的，这一点任何时候都存在，要知道，扁平化设计已经从iOS7一直流行至今，时间也从2013年推出到现在经历了7个年头。在iOS7之前，全写实风格的拟物化设计才是主流。

古老的拟物风格

7个年头对于每个人的审美都是一个很大的挑战。没有光影质感的各种线性化图标，插画已经让人感到视觉疲劳。设计师希望在里边加入一些新的东西。

我们可以从苹果的例子说起，仔细观察，你会发现iOS13中的部分图标设计已经出现了“进化趋势”，虽然它们还只是萌芽。画笔变的有质感起来，而之前的版本中，则只是单纯的线条。

但是，这种变化并不能完全说是之前拟物风格的回归。仔细观察，你会发现这种质感的表现是及其克制的，想象一下你手中的Apple Pencil，苹果的Air Pods，通体白色光洁的塑料质感，才是这种风格的精髓。在这种风格里，你无法找到类似于“杂点”，“粗糙感”类似的名词。

总体来说，这是对前代超逼真的拟物风格+扁平风格的一次结合。很多拟物元素都做了最大化的精简，同时又兼具立体感，比如阴影，及微小的渐变。

新拟物风格特征

颜色： 新拟物风格大多数使用浅色，其实浅色系设计我们总会想到Dribbble风，是的。现在Dribbble风已经让人腻味，于是设计师考虑变换颜色，将纯白中加入一点点其他颜色，比如灰色，米色，渐变，当然这种颜色都是微小的，低饱和度的。

阴影： 是的，拟物风格怎么可能没有阴影及高光。新拟物风格尝试在纯色界面中凸显元素的凸起和凹陷感，这个时候就会使用投影，内阴影和内高光等表现方式。这种方式让元素呈现立体感的同时，也更加纯粹。并且，几乎所有的设计工具都可以轻松完成这种效果。但是，新拟物的阴影必须足够的柔和，如果你的设计中出现了过于强烈的阴影，那么这种风格可能就不是所谓的“新拟物”了。

简而言之，这是一种在纯色背景中营造凸起和凹陷感的“纯洁的”UI风格。

要设计新拟物，建议背景色不能为全白或者全黑色，你必须要使用一种中间色调，比如不同层次的灰色表现。

从下图中，我们也可以看出单纯的阴影卡片表现和新拟物中的卡片表现有何不同？下图左侧为新拟物塑造的卡片，右侧为常用的卡片形式。区别在哪里呢？新拟物是凸起来的，而常规的卡片则是浮在背景上的。

由于新拟物风格在颜色上的运用规则，我们可以发现，这种仅靠阴影和高光支撑起来的风格，区块之间的对比度并不是很高。我们整体感觉画面会非常素。要避免这种情况，只能在区块中的内容上下功夫，将区块内容做到尽可能的强对比，同时在不同的交互状态中作出较大的差异化。

不同的交互状态必须有足够的识别度是必须的，下图是正确的表现方式：

而下图的识别度则过低：

如下图的智能家居应用，开关按钮，仅仅通过凹凸感来表达开启和关闭，是否足够合适呢？用户是否会混淆呢？答案显而易见。

由此可见， 能支撑起新拟物风格内容信息区块划分的不能单单只是凸起的卡片，而是卡片中的内容 ，毕竟卡片与背景的对比度过低。所以，如果你要使用新拟物，不妨在卡片中的内容上下功夫。下面两幅图是比较适当的例子，因为这位设计师凸显了内容本身，或者是用颜色来形成对比度。

轻拟物的弊端和争议

易用性和用户友好性： 设计师阿伦·扬格拉这么说：与没有阴影的对象相比，带有阴影的对象通常会被突出显示。但是，通过“神经同构”，大多数元素都会漂浮并脱颖而出，在一个屏幕上相互竞争。很难理解设计中的确切层次，这会导致屏幕缺少适当的焦点，从而在眼动追踪中造成混乱。屏幕上缺少层次结构会对用户的决策过程产生重大影响。因此，由于存在多个可操作的项目，但缺少设计层次结构和重点，这会阻碍用户理解屏幕上正在发生的事情，从而可能导致混乱和错误的判断。

好的UI / UX不需要用户思考。而很明显，新拟物风格并不是那种一目了然，并不需要用户思考的设计。下面的几个按钮，你觉得哪个更想点击？

图片来自@Michal Malewicz

由于Neuomorphism具有各种阴影色调和角度，因此人们不禁要问，可单击的内容与不可单击的内容之间的细线在哪里。根据产品的功能和要求，每个应用神经同构的产品都可以具有自己的UI阶段规则；但是由于阴影，角度和浮动水平的不同，由于缺乏一致性，迷失方向的可操作项，“神经变形”会给用户带来混乱，最终为残疾用户造成使用障碍。

静电的建议：

对于新拟物风格，我们可以多去了解其趋势和进化方向。但是目前来说，这种由Dribbble上兴起的热潮只能在更多“实验性”风格作品上大放异彩。其根本原因就是上文提到的非常大的弊端。不少设计师说：新拟物起始于Dribbble，也会终结于Dribbble。这句话也不为过，因为不少Dribbble风的设计仅仅在设计师圈子中流行，并没有很好地运用到商业设计中去，这是个很大的问题。

如果你一定要使用新拟物，请记住，新拟物需要用良好的内容+可识别性的颜色去撑起来整个框架。但个人感觉，这是一种适合于展示，并不适合实际使用，或者实际使用场景很受限的设计风格。

如果说无边框设计和单纯使用排版来创造UI是可以被用户接受的话，目前这种新拟物风格在用户可用性和友好程度上并不高，我们仅仅把他们当做实验性风格去尝试就好。 也许某一天，新拟物风可以在设计师的不断尝试中获得更好的体验和视觉兼顾。

对于现阶段商业设计师来说，我们可以从轻拟物风格上获取灵感，逐渐的，微小的运用到现在的UI风格中，形成属于自己独特风格的作品，而不是照搬全抄的使用，这无疑是更明智的选择。

关于如何设计新拟物风格，静电会在《静电的UI设计教室》课程中详细讲解。有兴趣的小伙伴可以下滑页面了解课程详情咨询报名。

——————————————————

▼

往期精彩回顾

▼

给小白UI设计师的黑苹果推荐配置及安装指南（2020更新版）

如何才能写一份引入瞩目的简历？（附精选UI简历模板下载）

通过大量调研，我们终于发现Sketch卡顿的原因

自我提升 抗击疫情两不误！设计师礼包免费限时领

节后开工遭遇肺炎疫情肆虐，UI设计师应如何应对？