UI设计中的新拟物风格是怎样的?

html-css07

UI设计中的新拟物风格是怎样的?,第1张

新拟物风格是否适合所有类型的APP场景还有待探讨,或许在一些工具类的APP可以考虑进行尝试,例如:音乐播放器、计算器、签到类、操作工具类APP,在UI设计上可以考虑在部分按钮、卡片式设计、表单类的内容上进行尝试。

1. 基本原理

最基础的新拟物化效果分别有「凸起效果」和「凹陷效果」,两者差异化在于对光影的处理方式不同。凸起效果使用外投影来实现,叠加层级依次为:基层-亮投影-暗投影凹陷效果效果使用内投影来实现,叠加层级依次为:亮投影-暗投影-基层。亮、暗投影的数值建议偏移值形成正负并保持一致,透明度依据实际情况进行调整。

2. 结合颜色

以深色、单色、渐变三组颜色进行了尝试,整体上来的处理方式都是以基层的颜色为基础对HSB进行调整,深色与单色的处理方式较为一致,渐变色的投影或阴影则需要根据不同的颜色进行调整,来达到合适的效果。我们可以通过HSB的颜色模式来进行微调,达到明暗投影的效果

3. 设计方式拓展

常态的表现往往并不难满足我们所有的设计,因此我们可以基于常态的设计样式再结合其他的设计方式,让整体的感受更加丰富。

4. 小结

新拟物化的设计虽然新颖,但是否适合所有的设计?这个是值得思考的问题。面对一个新的趋势,建议可以多去研究和了解这方面更深层的内容,这样在实际应用才能更加得心应手。

以上就是关于UI设计中的新拟物风格的相关分享,希望对大家有所帮助,想要了解更多内容,欢迎及时关注本平台!

其实设计的风格有很多,比如我们现在最常见的简约风格、扁平化风格等。当然作为一个设计师除了要掌握已经流行的风格,还要对正在悄悄萌芽的风格有一定的了解。比如说以下几种风格:

一、新拟物化

新拟物化是2020年处于风口浪尖的一种视觉风格,新拟物化从最初诞生到现在,已经有一定的改变了,并且在向着更加复杂、完善的方向发展,有着更为良好的可访问性,开始具备更多拟物化的设计特征,但是更加新鲜、现代,并且更能渲染出独特的氛围感。

二、柔和渐变

渐变这种设计趋势正在进入两极分化的一个阶段。一方面,在视觉设计领域,一部分渐变变得更加夸张,但是在 UI 设计领域,无论是背景、UI元素(比如按钮、卡片和图形),渐变依然存在,只不过会显得更加微妙柔和。

在 UI 设计领域,还有的设计师会使用双色渐变,并且结合模糊效果,让它更加柔和。

三、几何元素

几何元素既可以作为背景来使用,也可以作为装饰细节,让你的设计越来越有趣。几何元素在最近几年受到的关注非常多,在设计上的应用也颇为广泛,甚至有人将几何元素拼接成为马赛克,最终呈现出来的视觉效果非常酷!

四、色调柔和背景

很多令人惊艳的、轻巧且极富美学价值的背景设计,它们用明亮柔和的色彩铺满背景,展现出极强的色彩和搭配的技巧。使用色调柔和的背景能够让整个设计都显得现代而沉静,清新,让内容真正抓住用户的注意力。

五、插画和3D元素

插画毫无疑问是非常流行的。不过,不论是配色还是视觉风格,无论是什么样的插画风格,最终的目标依然是要契合产品和 UI,所以很多插画都选择了相对扁平的风格,或者选择模拟类似3D的视觉外观。相比于每个数字项目都在使用的免费图片,插画真的是向前走出了一大步!

六、抽象图形

和传统的规则的几何图形不同,抽象而不规则的图形可以让界面显得更加不拘一格和好玩,更通俗的来讲,就是让 UI 界面更加「有机」,我认为这是一件好事。使用钢笔工具在原始的圆形和矩形上进行编辑,尝试不同的轮廓,承载不同的颜色和渐变效果,最后生成的效果会非常有趣。如果你不想去自己绘制,可以尝试一下 Blobmaker 这个工具,能够帮你节省时间~

七、深色模式

深色模式在这2年绝对是人所共知的一个设计风尚了,如今的深色模式 UI 设计已经深入到各个不同的应用。简单来说他是整个界面配色反转之后的效果,便于用户在深夜更轻松地浏览界面信息。只不过在具体的设计实施上,深色模式远不是简单的色彩反转就可以实施的,有很多注意事项,尤其是在对比度控制上。

八、倾斜角度

最初大家在 Dribbble 上会倾向于使用非标准的排版布局方式来呈现UI界面,后来这种展现方式开始逐渐在实际的设计项目中应用开来。在实际的设计当中,绝大多数情况下都会挑选30度到50度之间的倾斜角度。这种方法非常不错,可以多尝试。

九、弥散的阴影

阴影是拟物化设计当中最重要的视觉元素之一,而如今它又再次大规模流行开来了。只不过相比于之前「沉重」的阴影,柔和的弥散阴影在美学上更加令人愉悦,通常,阴影会让 UI 元素的「可点击感」更强,并且有助于区分界面中的层次结构。

十、简约加粗的字体

实际上早在 iOS 7 的时代,曾经一度流行过笔触纤细且字体宽度比较窄的字体,不过很庆幸这个时代过去了。现在所流行的字体更加讲究字体的可读性,字体的外轮廓都大体趋近于正方形,外观显得更加大气而现代。以上就是正在流行或者将要流行的UI设计风格,希望对你有所帮助!

宽泛而言,拟物化指“对实际物体的模仿重现”。

例如,通过逻辑推理得出,苹果的电子书应用页面类似一个便宜的松木书架;苹果的记事本程序类似于一本黄色的标准纸簿,这种类型的拍纸簿有格子,有空白,并于约1978年绝版。

拟物化渗透在苹果以及其它用户界面的每个角落——应用窗口的阴影效果,以及虚拟按键的炫光效果,使得它们看似实体按键。

扩展资料

不可否认,iOS7的确是在尝试改变,并且其中新增的一些功能体验或部分界面确实有值得称赞之处。iOS7扁平化的设计完全打破了iOS6及以往的拟物化风格,在所有细节中都在追求极简化与细致化的平衡,不过在其中也难免具有一些问题。

比如扁平化相对于原有的立体感会造成的最典型问题,是其失去了原有的操作触感,这是一个会更多的影响到苹果iOS老用户的问题。

参考资料来源:凤凰网-新扁平化/旧拟物化实景PK iOS7对比iOS6

参考资料来源:中国新闻网-苹果iOS7操作系统为何舍弃拟物化设计?