3D新拟物风格的兴起

Sponsor

前言：前两年设计界一度追寻着扁平风，因为它简洁、清爽，一目了然的感觉。翻看前两年分享的文章也有大量关于扁平风的介绍。但是设计开始同质化，万物皆偏平的时候，3D风格又成了新的流行趋势。今天推荐这篇文章讲的是3D与UI的结合，文章会江街道 3D 新拟物风格为何会兴起以及其实现策略。

01 UI 视觉的变革：往往都是从小小的图标开始

在 2020 年的苹果全球开发者大会（ WWDC ），苹果发布了新的 macOS 11（又名 Big Sur ）。其中在 UI 视觉方面 macOS Big Sur 系统最大的变化就是图标上， Big Sur更新了很多新设计风格的应用图标。

关于 Big Sur 的新图标的讨论很多，很多都在激烈争论。人们对苹果公司没有将完全扁平设计引入 Mac 感到松了一口气，但分歧并未停止。有些人认为这引领一种新的图标表现方式，而有些人则认为这是丑到了天际。

但苹果的设计就是这样，不管你你喜不喜欢，过一段时间他总会流行起来。就像iPhone11刚面世时，背面的摄像头组被无数人吐槽一样，而现在这个设计已经成了高端机的标板。

大家还能想起来 UI 扁平化设计已经流行了多少年了吗？

从 2013 年 6 月 11 日苹果发布 iOS 7 算起，现在已经将近 8 年了，这 8 年时间扁平化像飓风一般席卷了整个 UI 设计圈，一夜间几乎所有的 APP UI 都被拍扁了。

其中以 Instagram 的换标作为扁平盛行时代的里程碑

但扁平化设计的确已经一统江湖太久了，人们似乎已经有点厌倦了。其实设计风格就是这样，并没有绝对的好与不好，只要审美不疲劳，就可以继续流行下去，至于流行多久我们经常会用一个词去形容—耐看度。

扁平化带给我们的是画面的轻盈和设计的高效率，但是缺点也是明显的，场景表现过于单一的问题，设计感体现较为有限，于是很多设计师都在尝试用新的设计风格替代或者进化现在的扁平化设计风格，今天我们就来探讨一下新拟物背景下 3D 与平面的结合设计，能在 UI 中擦出什么样的火花。

02 以前的拟物风格：为什么会被淘汰，它的特征是什么

2014 年我的作品- Cache https://www.zcool.com.cn/work/ZMjY1OTEwMA==.html

现在这样的风格会被我们称之为重度拟物风格，他不好看了？技术落后了吗？当然不是！只是目前不流行了！

他的特点是强调光影对比与物理质感，色彩都会比较偏“暗”，而且伴随设计的往往是难和慢！刻画一个细节需要很久，在强调设计效率组件化的今天，这种费时又难学的设计方法必然不会成为主流。

当前的UI流行趋势是强调高饱和的色彩搭配（在没有光影细节之下也只有色彩可以玩了），这种风格明显也不符合趋势，被“淘汰”也就难免了。

从设计角度上解析，图标主要是由四方面构成：构图+光影+色彩+纹理：

而拟物风格图标在这四方面更加强调构图、光影和纹理，而色彩则是更多去搭配纹理质感，所以你看到多数拟物风格图标在质感上很棒，但是色彩却没有那么丰富。

03 新拟物风格会流行起来吗？应如何进行设计？

说到新的拟物风格，这只是一个概念，也有称之为轻拟物，轻偏平，这里并没有通用的称呼和预设的设计方法，一切的 UI 设计风格都是为产品本身服务，如果新的设计风格能让产品整体体验得到“提升”，哪怕这种提升只是成功获取到了用户的注意力，那这个设计就是有价值的。

在所有都拟物的时代，如果你是平坦的，那么就会吸引更多的目光。

在所有都扁平的时代，如果你是凹凸的，那么就会吸引更多的目光。

所以当下如果你的产品中想要吸引目光就要有点与众不同的东西，要么是独门的功能，要么就是吸晴的设计。

显然扁平的彩色图标现在已经达不到这个效果了，而以前的拟物又显得有点过时，在这种时代背景下，新的风格必然就会被碰撞出来。

于是乎我们就会看到以下的一些大厂“创新”，你不止能看到轻拟物设计，还能看到“实物”设计……

不得不说，各位设计师们还真是拼了…

“哪怕这种提升只是成功获取到了用户的注意力，那这个设计就是有价值的。”没毛病！各位加油！

当然苹果 Big Sur 带给我们的图标设计创新更加有趋势意义，这种 3D+ 平面的设计组合方法更加能给我们一些设计启迪和思考，并且这种 3D 图标与之前的拟物风格有着明显的视觉区别：

我用 3D 重构了一个计算器 icon，以此为例来进行分解，如下：

与 2D 设计方法设计图标一致，都是先勾画图形（建模），然后填色、加材质和灯光，但不同的是在 3D 环境下，这一切都比 2D 环境下简单了，而且视觉效果更佳，整体画面感更佳立体，质感更加饱满，并且根据渲染器的参数调节和材质质感的不同，即使是在同一模型下，也能制造出很多种不同的视觉体验。

图标背板的选择上，由于选择了 3D 作为主体表现，3D 背板过于抢视线，图标为了突出主体而非背景，建议使用 2D 平面背板与 3D 前景图标进行结合。

3D 设计图标的确有一些天然的优势，特别是在质感和光感的表达准确度上，是绝对超过 2D 的。

但是 2D 图标在一些风格的设计也是很难替代的，比如线性图标和渐变风格图标。

04 常见的 ICON 用 3D 重构展示：业务未来你将会在产品中看到更多

05 观察总结：提升视觉、提升效率才是关键

3D 设计的确可以提升UI整体的视觉氛围，并且现在在一些 APP 中已经可以看到小范围 3D 案例了（比如支付宝），但是多是以插画的形式出现，其实与产品 UI 还是有一定距离的。

未来 3D 设计一定会是 UI 中大展身手，但是目前的常见的 3D 设计软件实在是太庞大了，我与许多 3D 行业的同行聊天的时候，大家普遍的认知是现在的 3D 软件（包括C4D ）的实际最佳场景依然是动画设计，UI 的中的 3D 属于非常轻量级的，用现在主流的 3D 设计软件做 UI 应用案例，有点用巡航导弹打蚊子的感觉，而且这个蚊子还是距离一米以内。这有点像当年的 PS 来做 UI，虽然可以完成但是效率不高，学习曲线也高，于是 Sketch 和 Figma 这样的产品顺理成章的取代了 PS 在 UI 界的地位。

作为设计师，追求趋势是不可避免的。同时也需要不断的学习，提升效率！

最后给大家准备了Arnold & C4D 打造的创意 3D 图标素材下载（ C4D,Fig ma）

素材下载：

在「设计达人」公众号回复「3D图标」自动获取。

作者 | 残酷de乐章
来源 | 三分设（id：SFun-Share）

赞助商链接

喜欢这篇文章吗？欢迎分享到你的微博、QQ群，并关注我们的微博，谢谢支持。
版权：除非注明，本站文章均为原创文章，转载请联系我们授权，否则禁止转载。