本文主要介紹的是晶白風格，enjoy~

今天和大家聊聊設(shè)計中的白色，說到白色不得不說蘋果的白雪設(shè)計語言，在很多設(shè)計師心中，白雪設(shè)計是蘋果的設(shè)計巔峰期，也是蘋果設(shè)計最黃金時期。

當年喬布斯就是靠著這款iMac把蘋果起死回生的，這款電腦設(shè)計，采用了透明的設(shè)計，也是蘋果白雪設(shè)計語言典型的代表作。

整個白雪語言不止是在硬件ID設(shè)計，在蘋果的一系列軟件里面也大量運用到，比如垃圾桶這個圖標，白色的設(shè)計，但是細節(jié)卻是讓人過目難忘。

雖然蘋果iOS系統(tǒng)更新了幾個版本，但是白色的設(shè)計理念一直伴隨到現(xiàn)在，如上圖我們能看到一些細微的變化，比如白色由之前純白慢慢有些透明度變化。

新的備忘錄，從擬物變成扁平，但是整體的設(shè)計語言的延續(xù)還是很明顯的。

Finder的設(shè)計也是延續(xù)之前，其實“最大化”按鈕已更改為“全屏”可以說蘋果的設(shè)計一直都在變化，但是都有一個核心理念在延續(xù)著每一次的變化，就是白雪設(shè)計語言！

包括全球的一些知名應(yīng)用，整體的風格也逐漸驅(qū)動，都以內(nèi)容為主，設(shè)計輔助內(nèi)容，整體白色為主。那么今天我們一起來學習下，今天和大家研究的趨勢也是白色，不過我個人叫它為-晶白，因為它不僅僅是純白，在白色的風格基礎(chǔ)上，有很多微妙的變化。

什么是晶白風格？

簡單來說，晶白就是在白色質(zhì)感下，通過一些透明度變化、投影、外發(fā)光等等，讓整體設(shè)計更加富有層次感！晶白不一定是純白，因為它的細節(jié)變化，使得在不同背景，不同場景會呈現(xiàn)出不一樣的設(shè)計細節(jié)！我們來看一些案例：

這個設(shè)計就是一個晶白風格，整體視覺就是大拇指點贊的圖形，這個圖形整體為白色質(zhì)感，但是相對于扁平的純白色圖形，這種晶白質(zhì)感更有細節(jié)，層次更加豐富，同時白色的質(zhì)感很好的和背景融為一體。

美拍早期的啟動圖標，整體風格同樣運用的晶白處理，相對千篇一律的白色，這種質(zhì)感會顯得更加精致。

這套UI作品，采用晶白設(shè)計手法，來加強背景的Z空間，通過白色的疊加和前景白色形成一個很有層次的空間。

這套圖標系列作品，上面線型圖標雖然設(shè)計很棒，但是在線型圖標爛大街的今天很難讓人過目不忘，設(shè)計師將新的風格改成這種面型，同時質(zhì)感運用這種晶白，通過透明度的處理，顯得非常有細節(jié)和層次感，每一個都很精致。

晶白除了運用在圖形里面，在一些網(wǎng)站背景或者插圖都可以運用，國外知名IT服務(wù)公司DigitalOcean的官網(wǎng)設(shè)計中，背景就是運用這種晶白質(zhì)感，將抽象的IT服務(wù)變得更好理解。

晶白風格特點

1. 白色透明漸變

晶白最大一個特點就是運用漸變，白色到透明的漸變，通過透明度來拉開明暗差別，形成設(shè)計空間感。漸變可以是純白色變化，也可以是帶環(huán)境色的白色漸變，如上圖中，漸變白色就是帶有環(huán)境色的漸變過度！

一個網(wǎng)站設(shè)計，整體輔助圖形運用的抽象幾何圖形，呈現(xiàn)出秩序感，整體的圖形細節(jié)配合，白色透明度變化，很好的將每個圖形的背景色融于其中，細節(jié)豐富。

此圖形采用的立方塊設(shè)計，整體也是從白色過度到透明，透明的白色透出深色的背景，整體呈現(xiàn)出高級感。

這個LOGO設(shè)計，也是采用白色到透明運用，很巧妙的通過一個漸變和字母轉(zhuǎn)折關(guān)聯(lián)起來。

2. 多色透明漸變

這套插畫作品整體也是運用的白色到透明質(zhì)感，但是除了運用白色到透明，也充分運用背景藍色，通過環(huán)境色運用，整體層次更加豐富。

這組圖形的設(shè)計，也是采用環(huán)境色運用，重復(fù)運用背景多色漸變，整體更加融合一體。

這組插畫設(shè)計，插畫中核心人物太空人整體呈現(xiàn)白色質(zhì)感，但是在頭部以及白色的投影上重復(fù)運用背景橙色，使得更加整體協(xié)調(diào)。

3. 投影運用

晶白風格，還一個很重要特點就是運用投影，來形成前后關(guān)系，上圖在桃心交叉點，運用透明處理，形成兩層空間感。

這個時鐘的圖標,運用投影拉開層次，讓整體沒有那么平淡。

這個 LOGO就是一個很好運用投影的案例，通過白色暗面，凸現(xiàn)白熊的立體感。

UI中運用

這個數(shù)獨游戲設(shè)計中，頁面主圖形就是運用晶白作為主圖形風格，整體顏色清爽，細節(jié)豐富，其實白色透明幾何圖形作為背景，主圖形，運用白色和環(huán)境色融合處理，整體呈現(xiàn)高級感。

航空公司的選座設(shè)計，作者很好的將飛機運用晶白設(shè)計手法，讓飛機整體有一定厚重感，然后將選座的操作行動點融于其中。

在這個引導(dǎo)頁設(shè)計中，核心的主風格插畫，也是運用晶白質(zhì)感，通過環(huán)境色處理，背景處理，整體既有空間感，也充滿細節(jié)。

這組引導(dǎo)頁設(shè)計中，核心色調(diào)也是圍繞白色處理，很好通過灰色調(diào)來體現(xiàn)生活場景感。

在UI中作為背景運用，也是常用的一種方式，讓整體界面空間感更強。

這組卡片設(shè)計非常棒，作者很好的將這種晶白質(zhì)感和文案融合在一起，運用幾何圖形的表現(xiàn)很好的讓整個背景生動起來，同時也不影響文案閱讀 。

運用在頁面背景，簡單干凈，如果你的背景太空，不知道放什么圖形，運用這個風格準沒錯。

Riko的這套作品就是很好將晶白作為整體的背景圖形處理，圖標，引導(dǎo)頁以及背景底紋都是運用這個風格，在配合干凈的配色，整體呈現(xiàn)出高級感。

Yar設(shè)計的官方榜單，很好的運用晶白質(zhì)感效果作為背景，將榜單名詞凸現(xiàn)出來，恰到好處。

圖標中運用

晶白在圖標中運用比較方法，能讓圖形更加更豐富，呈現(xiàn)出透明的細節(jié)質(zhì)感，無論是在圖標運用還是在界面運用。

系統(tǒng)小圖標，相對傳統(tǒng)的線型圖標，這種帶透明度的小細節(jié)會讓圖形更加有層次感。

一組面的圖形運用，簡單的技法，讓你的圖標差異性瞬間拉開。

透明的變化有很多，可以是帶漸變，可以是純透明度變化，也可以在透明漸變中加一些立體感。

非常精致的一個設(shè)計，巧妙的將讀書和頭像剪影融合在一起了，扁平和擬物的巧妙結(jié)合。

誰說扁平就一定要同質(zhì)化，一點點簡單的變化讓簡約而不簡單。

很巧妙的背景融合，一個帶著環(huán)境色的漸變，讓整個圖形層次更加分明。

插畫中運用

這只老鷹的插圖設(shè)計，造型優(yōu)美對稱，技法上通過透明度運用，讓整個羽毛充滿層次。

設(shè)計師很好的將抽象的幾何圖形，以及白色，藍色透明的融合，很好呈現(xiàn)出科技感。

脈脈的一組插畫設(shè)計，整體運用白色質(zhì)感，以及脈脈品牌藍色，非常酷。

總結(jié)

趨勢的關(guān)注和研究，是設(shè)計師必備的技巧，我們只有通過大量閱讀提煉出有用風格去學習，運用，落地到我們?nèi)粘ＴO(shè)計中，才算真正融匯貫通，希望在設(shè)計日記里，能夠與大家一起來挖掘最新的趨勢和方向！

相關(guān)閱讀

跳槽進大廠，這些設(shè)計技法必須會（系列一）

跳槽進大廠，這些設(shè)計技法必須會：系列第二彈-卡通簡筆風格

跳槽進大廠，這些設(shè)計技法必須會（三）：柔光風格

作者：我們的設(shè)計日記，微信公眾號：我們的設(shè)計日記（ID：helloskys）

本文由 @我們的設(shè)計日記 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議