快好知 kuaihz

跳槽进大厂,这些设计技法必须会 (四):晶白风格

本文主要介绍的是晶白风格,enjoy~

今天和大家聊聊设计中的白色,说到白色不得不说苹果的白雪设计语言,在很多设计师心中,白雪设计是苹果的设计巅峰期,也是苹果设计最黄金时期。

当年乔布斯就是靠着这款iMac把苹果起死回生的,这款电脑设计,采用了透明的设计,也是苹果白雪设计语言典型的代表作。

整个白雪语言不止是在硬件ID设计,在苹果的一系列软件里面也大量运用到,比如垃圾桶这个图标,白色的设计,但是细节却是让人过目难忘。

虽然苹果iOS系统更新了几个版本,但是白色的设计理念一直伴随到现在,如上图我们能看到一些细微的变化,比如白色由之前纯白慢慢有些透明度变化。

新的备忘录,从拟物变成扁平,但是整体的设计语言的延续还是很明显的。

Finder的设计也是延续之前,其实“最大化”按钮已更改为“全屏”可以说苹果的设计一直都在变化,但是都有一个核心理念在延续着每一次的变化,就是白雪设计语言!

包括全球的一些知名应用,整体的风格也逐渐驱动,都以内容为主,设计辅助内容,整体白色为主。那么今天我们一起来学习下,今天和大家研究的趋势也是白色,不过我个人叫它为-晶白,因为它不仅仅是纯白,在白色的风格基础上,有很多微妙的变化。

什么是晶白风格?

简单来说,晶白就是在白色质感下,通过一些透明度变化、投影、外发光等等,让整体设计更加富有层次感!晶白不一定是纯白,因为它的细节变化,使得在不同背景,不同场景会呈现出不一样的设计细节!我们来看一些案例:

这个设计就是一个晶白风格,整体视觉就是大拇指点赞的图形,这个图形整体为白色质感,但是相对于扁平的纯白色图形,这种晶白质感更有细节,层次更加丰富,同时白色的质感很好的和背景融为一体。

美拍早期的启动图标,整体风格同样运用的晶白处理,相对千篇一律的白色,这种质感会显得更加精致。

这套UI作品,采用晶白设计手法,来加强背景的Z空间,通过白色的叠加和前景白色形成一个很有层次的空间。

这套图标系列作品,上面线型图标虽然设计很棒,但是在线型图标烂大街的今天很难让人过目不忘,设计师将新的风格改成这种面型,同时质感运用这种晶白,通过透明度的处理,显得非常有细节和层次感,每一个都很精致。

晶白除了运用在图形里面,在一些网站背景或者插图都可以运用,国外知名IT服务公司DigitalOcean的官网设计中,背景就是运用这种晶白质感,将抽象的IT服务变得更好理解。

晶白风格特点

1. 白色透明渐变

晶白最大一个特点就是运用渐变,白色到透明的渐变,通过透明度来拉开明暗差别,形成设计空间感。渐变可以是纯白色变化,也可以是带环境色的白色渐变,如上图中,渐变白色就是带有环境色的渐变过度!

一个网站设计,整体辅助图形运用的抽象几何图形,呈现出秩序感,整体的图形细节配合,白色透明度变化,很好的将每个图形的背景色融于其中,细节丰富。

此图形采用的立方块设计,整体也是从白色过度到透明,透明的白色透出深色的背景,整体呈现出高级感。

这个LOGO设计,也是采用白色到透明运用,很巧妙的通过一个渐变和字母转折关联起来。

2. 多色透明渐变

这套插画作品整体也是运用白色到透明质感,但是除了运用白色到透明,也充分运用背景蓝色,通过环境色运用,整体层次更加丰富。

这组图形的设计,也是采用环境色运用,重复运用背景多色渐变,整体更加融合一体。

这组插画设计,插画中核心人物太空人整体呈现白色质感,但是在头部以及白色的投影上重复运用背景橙色,使得更加整体协调。

3. 投影运用

晶白风格,还一个很重要特点就是运用投影,来形成前后关系,上图在桃心交叉点,运用透明处理,形成两层空间感。

这个时钟的图标,运用投影拉开层次,让整体没有那么平淡。

这个 LOGO就是一个很好运用投影的案例,通过白色暗面,凸现白熊的立体感。

UI中运用

这个数独游戏设计中,页面主图形就是运用晶白作为主图形风格,整体颜色清爽,细节丰富,其实白色透明几何图形作为背景,主图形,运用白色和环境色融合处理,整体呈现高级感。

航空公司的选座设计,作者很好的将飞机运用晶白设计手法,让飞机整体有一定厚重感,然后将选座的操作行动点融于其中。

在这个引导页设计中,核心的主风格插画,也是运用晶白质感,通过环境色处理,背景处理,整体既有空间感,也充满细节。

这组引导页设计中,核心色调也是围绕白色处理,很好通过灰色调来体现生活场景感。

在UI中作为背景运用,也是常用的一种方式,让整体界面空间感更强。

这组卡片设计非常棒,作者很好的将这种晶白质感和文案融合在一起,运用几何图形的表现很好的让整个背景生动起来,同时也不影响文案阅读 。

运用在页面背景,简单干净,如果你的背景太空,不知道放什么图形,运用这个风格准没错。

Riko的这套作品就是很好将晶白作为整体的背景图形处理,图标,引导页以及背景底纹都是运用这个风格,在配合干净的配色,整体呈现出高级感。

Yar设计的官方榜单,很好的运用晶白质感效果作为背景,将榜单名词凸现出来,恰到好处。

图标中运用

晶白在图标中运用比较方法,能让图形更加更丰富,呈现出透明的细节质感,无论是在图标运用还是在界面运用

系统小图标,相对传统的线型图标,这种带透明度的小细节会让图形更加有层次感。

一组面的图形运用,简单的技法,让你的图标差异性瞬间拉开。

透明的变化有很多,可以是带渐变,可以是纯透明度变化,也可以在透明渐变中加一些立体感。

非常精致的一个设计,巧妙的将读书和头像剪影融合在一起了,扁平和拟物的巧妙结合。

谁说扁平就一定要同质化,一点点简单的变化让简约而不简单。

很巧妙的背景融合,一个带着环境色的渐变,让整个图形层次更加分明。

插画中运用

这只老鹰的插图设计,造型优美对称,技法上通过透明度运用,让整个羽毛充满层次。

设计师很好的将抽象的几何图形,以及白色,蓝色透明的融合,很好呈现出科技感。

脉脉的一组插画设计,整体运用白色质感,以及脉脉品牌蓝色,非常酷。

总结

趋势的关注和研究,是设计师必备的技巧,我们只有通过大量阅读提炼出有用风格去学习,运用,落地到我们日常设计中,才算真正融汇贯通,希望在设计日记里,能够与大家一起来挖掘最新的趋势和方向!

相关阅读

跳槽进大厂,这些设计技法必须会(系列一)

跳槽进大厂,这些设计技法必须会:系列第二弹-卡通简笔风格

跳槽进大厂,这些设计技法必须会(三):柔光风格

本站资源来自互联网,仅供学习,如有侵权,请通知删除,敬请谅解!
搜索建议:大厂  大厂词条  技法  技法词条  跳槽  跳槽词条  这些  这些词条  必须  必须词条  
设计

 方军:产品设计一、二

最近想产品想的多,所想比较小众,所想中能大众的 ,其实不是产品的部分,而是关于范畴这件事。最近比较痛苦的就是,发现讨论讨论经常发现大家不是在同一层面、同一词汇体...(展开)