因?yàn)樵性盏腅xformation哲學(xué),我愛(ài)上了留白設(shè)計(jì)

2015-3-13    用心設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)sillybuy.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)

每一個(gè)扁平化界面設(shè)計(jì),都是我們的心靈碰撞致力于最棒的 metro ui 設(shè)計(jì)

作者:http://www.xiusheji.net/article-1376-1.html

如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請(qǐng)點(diǎn)這里

原研哉撰寫(xiě)的《設(shè)計(jì)中的設(shè)計(jì)》相信設(shè)計(jì)師們都不會(huì)陌生,就算沒(méi)有仔細(xì)鉆研過(guò),也一定聽(tīng)聞過(guò)其中“Exformation”的核心理念(這一點(diǎn)單憑無(wú)印良品的極簡(jiǎn)主義風(fēng)格設(shè)計(jì)就足以證明)。Exformation可以理解為Information的反義詞,用原研哉的話來(lái)說(shuō)就是一個(gè)“將已知轉(zhuǎn)為未知”的過(guò)程。
 
若是要將這樣的理論融入到我們的設(shè)計(jì)中,那么不得不提的一定就是留白設(shè)計(jì)了。干凈的設(shè)計(jì)在網(wǎng)頁(yè)設(shè)計(jì)中被越來(lái)越廣泛的使用,從內(nèi)容之間到整體布局都會(huì)發(fā)現(xiàn)短暫或大片的留白設(shè)計(jì)。AnyForWeb今天為大家收集了各種網(wǎng)頁(yè)留白的設(shè)計(jì),供大家學(xué)習(xí)參考。
 
1.第一個(gè)網(wǎng)頁(yè)留白設(shè)計(jì)的案例就將留白所要呈現(xiàn)的效果表現(xiàn)的淋漓盡致,中部的圖片成了整個(gè)頁(yè)面的視覺(jué)中心,圖片周邊的紋理設(shè)計(jì)讓整體看起來(lái)不再單調(diào)。該網(wǎng)站無(wú)論從整體還是細(xì)節(jié)上來(lái)看,都秉承著極簡(jiǎn)主義的設(shè)計(jì)風(fēng)格。
 

 
2.用素描效果的圖片作為網(wǎng)站首頁(yè)是不是也很不錯(cuò)?素描的背景雖然通常會(huì)使用留白,但它的留白一定不會(huì)是普通的純色塊,陰影光線都恰到好處,不知不覺(jué)中為網(wǎng)站增添了許多藝術(shù)氣息。
 

 
3.高清真實(shí)大圖的使用在《2014年全球網(wǎng)站設(shè)計(jì)的15個(gè)趨勢(shì)》中被提及,下面這個(gè)案例中就得到了很好的體現(xiàn)。不僅如此,大片的真實(shí)場(chǎng)景留白也成了頁(yè)面中的亮點(diǎn)。高速公路的上空顯得無(wú)比遼闊,是不是會(huì)讓你有無(wú)限遐想呢?
 

 
4.突出重點(diǎn)內(nèi)容是留白設(shè)計(jì)的其中一個(gè)作用,如下案例所示,用戶(hù)一定會(huì)集中所有的精力看文字表述。與留白設(shè)計(jì)搭配,設(shè)計(jì)師們可以選擇色彩較為鮮艷的內(nèi)容,這樣能讓主要內(nèi)容更加突出明顯。
 

 
5.朦朧的線條形狀與留白的設(shè)計(jì)似乎都是以極簡(jiǎn)風(fēng)格著稱(chēng),那這兩者互相搭配會(huì)不會(huì)令網(wǎng)站看起來(lái)很無(wú)聊呢?下面的案例告訴你答案當(dāng)然是否定的。大片留白、線條組成的簡(jiǎn)單圖形、優(yōu)美的線條,以及清淡的色調(diào),不僅不會(huì)讓網(wǎng)站變得無(wú)趣無(wú)味,反而會(huì)制造出一種高大上的感覺(jué)。

 
6.這個(gè)網(wǎng)站使用單頁(yè)式的網(wǎng)頁(yè)設(shè)計(jì)手法,并且全局不間斷的使用網(wǎng)頁(yè)留白,每一個(gè)部分之間都運(yùn)用了漸變的色彩設(shè)計(jì),利用最簡(jiǎn)單的方法,讓網(wǎng)頁(yè)變得美妙起來(lái)。

 
7.扁平化的風(fēng)格似乎特別適合留白的設(shè)計(jì),兩者之間的隨意搭配就能表現(xiàn)出清新可愛(ài)的格調(diào)。但在這其中也有一點(diǎn)需要注意,在色彩的應(yīng)用上建議使用透明度較低的顏色,一定能為網(wǎng)頁(yè)的可愛(ài)指數(shù)加分。
 

 
8.漫畫(huà)風(fēng)的網(wǎng)頁(yè)設(shè)計(jì)本來(lái)就不多見(jiàn),帶著詼諧幽默的漫畫(huà)風(fēng)網(wǎng)頁(yè)設(shè)計(jì)就更加稀有了,這個(gè)案例就是其中一員。誰(shuí)說(shuō)留白設(shè)計(jì)是高端極簡(jiǎn)的專(zhuān)利和代名詞,下面的案例也許會(huì)顛覆你心中對(duì)留白的傳統(tǒng)看法。案例中的留白是不是讓網(wǎng)頁(yè)看起來(lái)更像是我們童年時(shí)代最?lèi)?ài)的連環(huán)畫(huà)呢?
 

 
9.無(wú)論從色彩還是結(jié)構(gòu)上,Yogy的網(wǎng)站都屬于比較簡(jiǎn)單的類(lèi)型。網(wǎng)站中的留白設(shè)計(jì)讓布局看起來(lái)不那么緊湊。單一化的色彩也讓整個(gè)頁(yè)面看起來(lái)不那么凌亂,卻又不失可愛(ài)俏皮的瀏覽體驗(yàn)。

 
10.SUBSIGN的留白設(shè)計(jì)僅限于Logo周?chē)闹虚g部分,這樣做的好處是營(yíng)造出了一種聚光燈的效果,讓用戶(hù)在瀏覽時(shí)能夠更加專(zhuān)注于留白以?xún)?nèi)的Logo部分。留白以外的設(shè)計(jì)運(yùn)用了底紋的效果,讓整體看起來(lái)不那么乏味或倉(cāng)促。
 

 
 
Exformationd 深層含義被解釋為“不是讓你知道一件事情,而是讓你發(fā)現(xiàn)自己多么的不了解”。希望AnyForWeb分享的案例能為大家?guī)?lái)一些靈感和感悟。

分享本文至:

日歷

鏈接

個(gè)人資料

存檔