身为科技设计师,你真的懂“毛玻璃”吗?

原标题:身为设计师,你真的懂“毛玻璃”吗?

相信所有的UI设计师都知道毛玻璃效果,并且大部身为设计师分设计师在设计工作中都曾运用过毛玻璃效果,但具体什么是毛玻璃呢?又是为什么会出现毛玻璃效果的呢?关于这个问题TuD的同学们也展开了一次讨论;

身为科技设计师,你真的懂“毛玻璃”吗?

(图你真的懂“毛玻璃”吗片摘自站酷)

身为科技设计师,你真的懂“毛玻璃”吗?

什么是“毛玻璃科技”效果

毛玻璃,学名「类玻璃柔光材质」在设计中也叫「玻璃拟态」(Gl科技ass morphism)。在生活中叫磨砂玻璃,俗称“毛玻璃”。

(图科技片摘自36kr)

毛玻璃效果最早在UI设计中的应用是在2007年微软的Windows Vista和win7的系统UI中。苹果在2013年发布的IOS7系统和2014年发布的OS X 10科技.10Yosemite系统中广泛使用了这个效果,在当时移动设计扁平化视觉风格主流的年代,这个变化着实让大家耳目一新。

身为科技设计师,你真的懂“毛玻璃”吗?

(Windows Vis科技ta界面)

身为科技设计师,你真的懂“毛玻璃”吗?

(苹果IOS7)科技

在之后的很长时间里,科技这种风格成为了设计师们常用的手法。直到在近期发布的Win11以及Mac OS Big Sur中强化了毛玻璃质感,又将玻璃拟态风格的趋势掀起了一个小高潮。

身为科技设计师,你真的懂“毛玻璃”吗?

(Win科技11界面)

身为科技设计师,你真的懂“毛玻璃”吗?

(Mac OS Big Sur界面)科技

0科技2

毛玻科技璃效果的视觉表现特征

毛玻璃效果本就如其名,主要以模拟磨砂玻璃的质感与视觉效果为主科技,具备以下几个特点:

身为科技设计师,你真的懂“毛玻璃”吗?

1.透明(还原真实玻璃的科技特性)

2.模糊(使用背景模糊/高斯模糊模仿磨砂玻璃效果,保证准确传递信息层级的同时,让视觉更有层次且透气)科技

3.悬浮科技(采用细微的阴影,在界面中多以弹窗、浮窗、抽屉等形式出现)

4.边界细节的处理(采用细腻的边框模拟玻璃的厚度,从而带来更加精致的视觉感受)科技

关于玻璃拟态的技术实现方法和技术参数在这里就不过多介绍了,各大设计平台已经有非常多的分享。这里就提供一些玻璃拟态、亚克力拟态的应科技用案例供大家欣赏:

身为科技设计师,你真的懂“毛玻璃”吗?

(OS Big Sur科技)

身为科技设计师,你真的懂“毛玻璃”吗?

(音乐播放器)科技

身为科技设计师,你真的懂“毛玻璃”吗?

(品牌科技应用-腾讯文档品牌升级)

身为科技设计师,你真的懂“毛玻璃”吗?

(车载HMI界科技面)

身为科技设计师,你真的懂“毛玻璃”吗?

(移动UI,dribbble设计师 Ghani 科技Pradita作品)

03科技

为什么选择科技玻璃拟态效果?

以科技上聊的内容其实网络上有很多分享了,接下来我们聊聊玻璃拟态背后的逻辑。

我们发现,大部分设计师都科技只是知道毛玻璃的样式,知道有哪些大公司、设计师、设计团队和产品采用了这种设计手法,但很少有人去研究玻璃拟态为什么存在,为什么UI设计中要选择使用玻璃拟态的效果?为什么不是塑料拟态、沙子拟态、水泥拟态、金属拟态等等其他材质的拟态呢…?

设计中的“拟态科技”顾名思义,就是通过视觉的形式从而“模拟某种状态或形态”让使用者对现实中的事物产生联想,尽可能模拟和还原一种使用场景和状态。因此,我们认为以下几点才是采用玻璃拟态的核心原因:

1. “玻璃”在生活中给人们留下的印象多是科技精致、轻盈、易碎、高档品等;

2. 玻璃在生活中无处不在,大家对玻璃都不科技陌生,更有一种原生的熟悉感,从内心更容易被接受不排斥;

3. 几乎所有的移动终端设备的屏幕都采用玻璃(钢化玻璃)材质(尤其是iphone),这样一来从触觉上和视觉上统科技一,更有助于引导和还原用户的使用场景与感受;

4. 加上磨砂玻璃本身就有的属性,柔和且易更容表现视觉上的层次科技感,朦胧增加细节上的空间感与透气性。

身为科技设计师,你真的懂“毛玻璃”吗?

(图片摘自3科技6kr)

04科技

总科技结

我们认为,拟态的设计手法是移动UI设计历史上“重拟物”表现形式科技的一种蜕变与延展。

随着行业的发展与互联网软硬件的进步,今天的拟态设计并不只是设计趋势的轮回,而是在以Material Design为代表的,主张以内容为核心进行设计的科技扁平化设计思维的进一步延伸。

是移动UI设计从抵制过度设计、放弃重拟物设计到解放设计生产力时期至今设计行业整体水平的科技提升与进步。

通过我们的观察和经验,得知玻璃拟态设计目前大多用于系统级的界面,毕竟这种设计在提升用户体验的同时,为硬件性能带来了一定的压力。所以,建议广大设计师们也不要盲目跟风,选择适合科技自己产品和内容的设计表现形式。

希望大家能够秉着创新精神多探索、科技多尝试,同时也期待行业中下一个具有代表性的设计风格的到来。

文章来源:Tu Design,版权归原作者所有科技。

话题发科技起人:TuDesign 成员 瑞雪

总结成员:TU科技D成员 Kai

版权声明:“IXDC”所推送的科技文章,除非确实无法确认,我们都会注明作者和来源。本公众号对转载、分享的内容、陈述、观点判断保持中立,不对所包含内容的准确性、可靠性或完善性提供任何明示或暗示的保证,仅供读者参考。文内出现的商标及图像版权属于其合法持有人,只供传递信息之用,非商务用途。如无意侵犯到您的权益,请及时联系我们处理。本公众号不承担任何责任,并拥有对此声明的最终解释权。

免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。

原创文章,作者:admin,如若转载,请注明出处:http://www.kshuanzhen.cn/kshuanzhen/11114.html

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注