火星网校
新拟物风格，UI设计的新趋势终于来了？
发布时间：2024-09-04 17:51:07 浏览量：226次
静电说：最近设计群开始流行一个名词叫做“新拟物”，什么叫做新拟物风格呢？简单粗暴先看图感受一下：
其实这种风格在去年年底已经开始有讨论的声音，它的原词叫做New skeuomorphism（新拟物风格），经过简化后成为一个新词Neuomorphism，另外，还有一个词来描述这种风格，那就是Soft UI。
新拟物风格是啥？
人类总是喜新厌旧的，这一点任何时候都存在，要知道，扁平化设计已经从iOS7一直流行至今，时间也从2013年推出到现在经历了7个年头。在iOS7之前，全写实风格的拟物化设计才是主流。
7个年头对于每个人的审美都是一个很大的挑战。没有光影质感的各种线性化图标，插画已经让人感到视觉疲劳。设计师希望在里边加入一些新的东西。
但是，这种变化并不能完全说是之前拟物风格的回归。仔细观察，你会发现这种质感的表现是及其克制的，想象一下你手中的Apple Pencil，苹果的Air Pods，通体白色光洁的塑料质感，才是这种风格的精髓。在这种风格里，你无法找到类似于“杂点”，“粗糙感”类似的名词。
总体来说，这是对前代超逼真的拟物风格+扁平风格的一次结合。很多拟物元素都做了最大化的精简，同时又兼具立体感，比如阴影，及微小的渐变。
新拟物风格特征
颜色：新拟物风格大多数使用浅色，其实浅色系设计我们总会想到Dribbble风，是的。现在Dribbble风已经让人腻味，于是设计师考虑变换颜色，将纯白中加入一点点其他颜色，比如灰色，米色，渐变，当然这种颜色都是微小的，低饱和度的。
阴影：是的，拟物风格怎么可能没有阴影及高光。新拟物风格尝试在纯色界面中凸显元素的凸起和凹陷感，这个时候就会使用投影，内阴影和内高光等表现方式。这种方式让元素呈现立体感的同时，也更加纯粹。并且，几乎所有的设计工具都可以轻松完成这种效果。但是，新拟物的阴影必须足够的柔和，如果你的设计中出现了过于强烈的阴影，那么这种风格可能就不是所谓的“新拟物”了。
简而言之，这是一种在纯色背景中营造凸起和凹陷感的“纯洁的”UI风格。
要设计新拟物，建议背景色不能为全白或者全黑色，你必须要使用一种中间色调，比如不同层次的灰色表现。
从下图中，我们也可以看出单纯的阴影卡片表现和新拟物中的卡片表现有何不同？下图左侧为新拟物塑造的卡片，右侧为常用的卡片形式。区别在哪里呢？新拟物是凸起来的，而常规的卡片则是浮在背景上的。
由于新拟物风格在颜色上的运用规则，我们可以发现，这种仅靠阴影和高光支撑起来的风格，区块之间的对比度并不是很高。我们整体感觉画面会非常素。要避免这种情况，只能在区块中的内容上下功夫，将区块内容做到尽可能的强对比，同时在不同的交互状态中作出较大的差异化。
不同的交互状态必须有足够的识别度是必须的，下图是正确的表现方式：
而下图的识别度则过低：
如下图的智能家居应用，开关按钮，仅仅通过凹凸感来表达开启和关闭，是否足够合适呢？用户是否会混淆呢？答案显而易见。
静电的建议：
对于新拟物风格，我们可以多去了解其趋势和进化方向。但是目前来说，这种由Dribbble上兴起的热潮只能在更多“实验性”风格作品上大放异彩。其根本原因就是上文提到的非常大的弊端。不少设计师说：新拟物起始于Dribbble，也会终结于Dribbble。这句话也不为过，因为不少Dribbble风的设计仅仅在设计师圈子中流行，并没有很好地运用到商业设计中去，这是个很大的问题。
如果你一定要使用新拟物，请记住，新拟物需要用良好的内容+可识别性的颜色去撑起来整个框架。但个人感觉，这是一种适合于展示，并不适合实际使用，或者实际使用场景很受限的设计风格。
如果说无边框设计和单纯使用排版来创造UI是可以被用户接受的话，目前这种新拟物风格在用户可用性和友好程度上并不高，我们仅仅把他们当做实验性风格去尝试就好。也许某一天，新拟物风可以在设计师的不断尝试中获得更好的体验和视觉兼顾。
对于现阶段商业设计师来说，我们可以从轻拟物风格上获取灵感，逐渐的，微小的运用到现在的UI风格中，形成属于自己独特风格的作品，而不是照搬全抄的使用，这无疑是更明智的选择。
关于如何设计新拟物风格，静电会在《静电的UI设计教室》课程中详细讲解。有兴趣的小伙伴可以下滑页面了解课程详情咨询报名。
想要了解更多关于新拟物风格的内容吗？点击咨询火星时代教育，探寻UI设计的更多乐趣！
热门课程推荐
热门资讯
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
2. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
那么,要学习UI设计就要学习哪些课程呢? 其实,UI设计课程涉及到许多领域,一般分为艺术设计课程、设计辅导课程、图形课程、测试课程、动画示范课程等几...
-
8. Photoshop操作教程：自制电子印章 | PS技巧详解
想要学会制作电子公章吗？跟随本教程，详细介绍Photoshop操作步骤，让您轻松掌握PS技巧，制作精美电子印章。
-
学习平面设计要用到哪些软件？随着社会的发展，平面设计在我们日常生活中越来越重要。想了解平面设计软件都有哪些吗？本文为您介绍Photoshop、CorelDRAW、AI和CAD这四款必备的设计软件。
-
10. 物联网APP UI设计:创造智能硬件领域的沉浸式体验
ui设计应该让用户一目了然,能够快速找到所需的信息和功能。在设计过程中,应尽量使用简洁的图标、文字和色彩,避免过多的视觉干扰。符合用户习惯:ui设...
