2020年初最火爆的新拟物设计趋势遭遇滑铁卢？

新拟物设计（Neumorphism UI）是2020年 UI 设计的主要趋势之一，在 dribbble 上可以看到很多这种风格的作品，也有人称之为 Soft UI。这种类似于浮雕的效果风格的出现，给目前流行的扁平化设计增加了一种新的设计形式，但其实它不一定是最实用的设计。

01

什么是新拟物化设计

新拟物Neumorphism是基于New+Skeuomorphism英文单词的拼写，是一种使用对象阴影的模糊、角度和强度来突显出对象的样式。其柔和的阴影和整体的外观使该设计看起来逼真、未来、有吸引力。

这种风格最初来自乌克兰设计师 Alexander Plyuto 发布的新作品「Skeuomorph Mobile Banking」。这个作品自发布以来就获得了极大关注，热度持续飙升并登上 Popular 榜首。大家都开始用这种风格出作品，便成为了新的设计趋势。

前身

新拟物的前身是 Skeuomorphism（拟物），即在界面中模仿现实物纹理材质的设计，让人们在使用界面时联想到现实物体的使用方式。拟物写实的设计风格曾经风靡全球。

直到苹果公司发布 iOS7 系统，使用了简洁的设计风格，才使拟物风格逐渐过时。扁平风格作为更高效简洁的风格被全面普及，拟物风格再没被广泛应用。

然而设计趋势一直在改变，苹果公司最新发布的 iOS 13 系统中，就出现了轻拟物的手法。虽然拟物效果能否回归尚且未知，但新风格的出现可以在扁平同质化时带来一些灵感。

02

如何实现

新拟物主要由三个元素组成：1 个背景+ 2 个投影。再在此基础上，改变颜色和大小参数以达到不同效果。

使用浅色背景时效果显著，但使用深一点的颜色时，效果像是外发光或者普通投影。因此大多数作品都采用比较素的颜色作为背景。

新拟物在色彩使用上比较克制，没有大面积的平铺颜色，仅在极少的位置进行色彩点缀以吸引眼球。

元素动画效果很难做得轻快，视觉层级上跟背景没有分离开，所以动画效果只要出现移动，会让人觉得有些不合理。

在开发上，要实现新拟物，主要有两个方式。

切图：对元素的每个状态（Normal、Hover、Pressed），设计师都需要分别提供一张切图。

代码实现：这个风格的实现效果是对元素增加两个不同方向的投影，通过代码可以实现。但是需要开发对每个元素添加投影，工作量繁重。

03

注意事项

不适宜用于按钮

新拟物将按钮的选中状态呈现得很美观，但是对于患有视力障碍的群体及使用设备的屏幕质量较差或对比度较低的用户而言，不同按钮状态间的微妙差别让人难以分辨。

卡片和滑动条

卡片和滑动条可能是新拟物的最佳使用场景。但是卡片的结构需要处理恰当。需要确保图片、图标和字体间的层级清晰，间距足够明显。

04

评价

可辨识性较差

新拟物仅通过柔和的阴影来区分元素，缺少对比度，因此对视力低下、失明、色盲的用户来说，可辨识性较差，不太友好。用户在户外时，阳光、屏幕眩光和缺乏对比度使用户的使用受到更大的影响，尤其是对于已经有视觉障碍的用户。

让用户思考

带有阴影的元素通常比较突出。但是在新拟物中，样式非常统一，大多数元素都会得到突出，在一个屏幕上互相竞争，这导致用户难以轻易理解页面中视觉层次和信息层级关系，界面缺少适当的焦点，从而在眼动追踪中造成混乱。

界面上缺少信息层级关系，会对用户的决策过程及思考过程产生重大影响。如存在多个可操作的内容，但是重点不突出，这会让用户在当前的流程上产生困惑，从而可能导致错误的判断和误操作，好的 UI/UX 不需要让用户思考。

到底点击了吗

对象的阶段由内部/外部阴影决定和标识。由于新拟态围绕着各种阴影色调和角度变化，因此会给用户带来困惑，可点击与不可点击之间的界限在哪里。

05

改良应用

风格融合

新拟物易产生界面层级混乱的问题，因此可以考虑将新拟物作为局部高光来使用，融合扁平化风格，可以良好地保障信息层级的划分。

叠加深浅模式

新拟物按钮多是叠加在浅色背景上的浅色按钮，这造成了前文所述的可辨识性差的问题，因此可以将新拟物的深浅模式叠加使用。

扁平风格多年流行后，设计潮流开始往回走，但并不是直接回到拟物风格，而是在效率和视觉效果中找一个平衡点。

不论新拟物的对错，起码引起了设计师注意，也激发了很多设计师的灵感，试着做一下效果图，或许会有新的发现！

本篇文章部分图片素材来源自网络

文章版权为51design所有 若需转载请注明来源并链接原文

- END -