扁平化設(shè)計(jì)為印刷品、網(wǎng)頁(yè)設(shè)計(jì)和移動(dòng)操作系統(tǒng)的UI設(shè)計(jì)帶來(lái)了新的變化。扁平化設(shè)計(jì)最核心的地方就是放棄一切裝飾效果，諸如陰影，透視，紋理，漸變等能做出3D效果的元素一概不用。所有元素的邊界都干凈利落，沒(méi)有任何羽化，漸變，或者陰影。

更少的按鈕和選項(xiàng)使得界面設(shè)計(jì)干凈整齊，使用起來(lái)格外方便。可以將信息和事物的工作方式更加簡(jiǎn)單直接的展示出來(lái)，減少認(rèn)知障礙的產(chǎn)生。越來(lái)越多的公司正在效仿，比如下面藍(lán)藍(lán)設(shè)計(jì)這些優(yōu)秀的國(guó)外扁平化網(wǎng)頁(yè)設(shè)計(jì)作品：

Who Wanna

藍(lán)藍(lán)設(shè)計(jì)分享的這篇文章雖然原本是”寫(xiě)給自由設(shè)計(jì)師的10條建議”。
但仔細(xì)讀下來(lái)，發(fā)現(xiàn)對(duì)于坐班的UI設(shè)計(jì)師人來(lái)說(shuō)，也很有價(jià)值。
提率，收獲更好的成果。
 
對(duì)于很多人來(lái)說(shuō)，自由工作是夢(mèng)寐以求的事。能夠自由分配時(shí)間，無(wú)人監(jiān)督，聽(tīng)起來(lái)就很棒。
實(shí)際上，在家工作容易缺少動(dòng)力，而且很多事情容易讓你分心，自制力不強(qiáng)的人當(dāng)不好自己的老板，無(wú)法有效的進(jìn)行個(gè)人管理。同樣的，自由界面設(shè)計(jì)師也有相似的問(wèn)題。

一般自由UI設(shè)計(jì)師都會(huì)列出一堆待辦事項(xiàng)，面對(duì)長(zhǎng)長(zhǎng)的列表，很多人感嘆工作多得做不完，因此壓力很大。下面是幾條小建議，讓你的自由工作”有章可循”、更效率，同時(shí)也能盡情的享受自由工作所帶來(lái)的的生活樂(lè)趣。

1.培養(yǎng)良好的生活習(xí)慣

培養(yǎng)的良好的生活習(xí)慣，做事才能清清爽爽。對(duì)于很多自由設(shè)計(jì)師來(lái)說(shuō)，良好的生活習(xí)慣就是，早上按時(shí)起床，充分洗刷，穿好衣服，吃早餐，然后開(kāi)始坐到桌子前，準(zhǔn)備工作了。
不要一起來(lái)穿著睡衣就工作，不吃飯、不洗刷你會(huì)感到很疲憊，至少，你也要喝點(diǎn)咖啡，喝點(diǎn)熱飲。
好的開(kāi)始確保了一天的工作效率。

2.有規(guī)律的工作時(shí)間

部分自由設(shè)計(jì)師很任性，想什么時(shí)候工作就什么時(shí)候工作，但我認(rèn)為，自由設(shè)計(jì)師工作時(shí)間必須有規(guī)律，工作時(shí)間最好設(shè)置在上午九點(diǎn)到下午五點(diǎn)之間。

網(wǎng)頁(yè)設(shè)計(jì)中，切圖輸出是指設(shè)計(jì)師將手邊繪制完成的原始圖稿轉(zhuǎn)換成網(wǎng)頁(yè)用的圖片格式、并交由下一位人員網(wǎng)頁(yè)排版的重要步驟。選擇適合的圖片格式不但可以將讓界面設(shè)計(jì)得到合理的顯示效果、甚至還可以有效的控制圖檔的檔案大小，節(jié)省下載時(shí)間、有效的減少服務(wù)器的負(fù)擔(dān)。
以UI設(shè)計(jì)師最常用的 Photoshop 以及 Illustrator 為例，都提供了「儲(chǔ)存為網(wǎng)頁(yè)用…」的功能。與默認(rèn)的存盤(pán)模式不同，在這個(gè)模式中，軟件提供了仿真圖文件輸出的質(zhì)量調(diào)整、檔案大小控制等針對(duì)網(wǎng)頁(yè)圖文件需求的選項(xiàng)：

最近幾年，網(wǎng)頁(yè)設(shè)計(jì)發(fā)生了翻天覆地的變化，現(xiàn)代UI設(shè)計(jì)的趨勢(shì)從擬物化逐漸向扁平化轉(zhuǎn)移，所以從最近瀏覽的網(wǎng)頁(yè)界面設(shè)計(jì)中我們可以發(fā)現(xiàn)，網(wǎng)站里的字體變多了，變大了，網(wǎng)頁(yè)都是以?xún)?nèi)容為主，最重要的是，網(wǎng)頁(yè)登陸速度迅速了許多。

而這一切的改變給用戶(hù)帶來(lái)了清新、整潔、干凈的體驗(yàn)。今天藍(lán)藍(lán)設(shè)計(jì)為大家整理了以清新、干凈為主題的網(wǎng)站設(shè)計(jì)，它們都用自己的方式詮釋了對(duì)扁平化的理解，趕緊來(lái)看看吧

Themes Kingdom

我們灰常樂(lè)意每周展現(xiàn)界面設(shè)計(jì)精美的網(wǎng)站，不斷為你提供UI設(shè)計(jì)靈感。而今天藍(lán)藍(lán)設(shè)計(jì)打算另辟蹊徑，為UI設(shè)計(jì)師收集了既能提供設(shè)計(jì)靈感又實(shí)用的優(yōu)秀案例，與過(guò)往選擇單一”主題”的例子有所不同。我們將為你呈現(xiàn)不同的工具和技術(shù)分享網(wǎng)站，可讓你在得到UI設(shè)計(jì)靈感的同時(shí)還能發(fā)現(xiàn)不錯(cuò)的工具或服務(wù)。在這篇文章中你將看到美觀(guān)又實(shí)用的網(wǎng)站，全部都不容錯(cuò)過(guò)哦親！

QUOjs

QuoJS是個(gè)微型的、模塊化的、面向?qū)ο蠖趾?jiǎn)潔的JavaScript庫(kù)，可簡(jiǎn)化HTML文檔的遍歷甚至是使用，亦可為移動(dòng)網(wǎng)頁(yè)的快速開(kāi)發(fā)對(duì)Ajax交互作出簡(jiǎn)化。

我們?cè)?/span>網(wǎng)站設(shè)計(jì)中，如果想要獨(dú)樹(shù)一幟，不妨在最直接吸引眼球的色彩上下下功夫，大膽的使用色彩，能夠讓你的網(wǎng)站界面設(shè)計(jì)更個(gè)性化。然而配色問(wèn)題一直是UI設(shè)計(jì)行業(yè)的挑戰(zhàn)，如何用好色，配好色，分清主次，自然需要潛心研究了。如果做得好，那么效果會(huì)極具沖擊力。

更多巧用色彩沖擊力的網(wǎng)站設(shè)計(jì)欣賞：http://www.skdbbs.com/

Spring/Summer

天賦異稟的UI設(shè)計(jì)師們總是能把普通的事物變得那么美好，譬如這里鞋類(lèi)網(wǎng)站設(shè)計(jì)，當(dāng)穿在腳上的鞋子踏進(jìn)屏幕后，會(huì)發(fā)生什么奇妙的變幻呢？
找一個(gè)得閑的時(shí)間，泡杯咖啡，靜靜來(lái)欣賞藍(lán)藍(lán)設(shè)計(jì)這如藝術(shù)品一樣的網(wǎng)站界面設(shè)計(jì)吧：）

更多的鞋類(lèi)網(wǎng)站設(shè)計(jì)欣賞：http://www.skdbbs.com/

Peter Nappi

現(xiàn)代網(wǎng)站設(shè)計(jì)的配色方案，除了一些簡(jiǎn)約網(wǎng)站界面設(shè)計(jì)常常使用灰色與白色，其他網(wǎng)站大多以白色為背景，再搭配其他顏色。然而，在藍(lán)藍(lán)設(shè)計(jì)這個(gè)展示中，我們可以看到有一些非常有冒險(xiǎn)精神的UI設(shè)計(jì)師混合了一些不尋常的色彩。這種UI設(shè)計(jì)你可能從來(lái)都沒(méi)想過(guò)，但它們都看起來(lái)非常完美，來(lái)學(xué)習(xí)一下吧。

TriplAgent

深色的背景界面設(shè)計(jì)看起來(lái)具有神秘感，能提供前景元素、背景元素的高度對(duì)比。有了黑色的鋪墊渲染，任何一個(gè)色彩都可以輕易在它之上煥發(fā)光彩。
那么怎么才能更好的在網(wǎng)站設(shè)計(jì)中運(yùn)用深色背景呢？想要成為一名”高級(jí)黑”UI設(shè)計(jì)師嗎？先來(lái)欣賞藍(lán)藍(lán)設(shè)計(jì)的絕贊網(wǎng)站設(shè)計(jì)范例吧。

更多優(yōu)雅的黑色系網(wǎng)站設(shè)計(jì)欣賞：http://www.skdbbs.com/

Negative Space

不知道大家發(fā)現(xiàn)沒(méi)有，國(guó)外很多個(gè)性的網(wǎng)站設(shè)計(jì)或者有范的UI設(shè)計(jì)師在設(shè)計(jì)他們的網(wǎng)站時(shí)，都會(huì)在底部有一個(gè)非常大的頁(yè)腳！這似乎成了標(biāo)榜個(gè)性的一個(gè)界面設(shè)計(jì)因素，
早在幾年前很少會(huì)有人注意到這一塊！而現(xiàn)在不一樣了，這里就是營(yíng)造氛圍調(diào)節(jié)頁(yè)面氣質(zhì)最佳的地方！
盡管這個(gè)元素在頁(yè)面的底部，但作為設(shè)計(jì)師的你可千萬(wàn)不能被忽視。如果它是引人注目的，游客肯定會(huì)關(guān)注它。并且會(huì)心一笑對(duì)你這個(gè)設(shè)計(jì)贊不絕口！他們會(huì)覺(jué)得你是一個(gè)注意細(xì)節(jié)的UI設(shè)計(jì)師！
一個(gè)不錯(cuò)的頁(yè)腳設(shè)計(jì)可以給訪(fǎng)客傳遞一個(gè)非常好的印象，特別是您花時(shí)間將這里打扮的花哨的話(huà)！
如果你想知道如何使你的網(wǎng)站設(shè)計(jì)的頁(yè)腳有趣和獨(dú)特的話(huà)，嘿嘿，別急，那么接下來(lái)您要看到的藍(lán)藍(lán)設(shè)計(jì)的網(wǎng)站設(shè)計(jì)案例肯定會(huì)給你靈感啦。
這些設(shè)計(jì)都是非常有趣的，他們肯定會(huì)激發(fā)你想出更贊的創(chuàng)意。來(lái)吧，現(xiàn)在就開(kāi)始你的”頁(yè)腳”之旅吧！

更多大頁(yè)腳創(chuàng)意網(wǎng)站設(shè)計(jì)欣賞：http://www.skdbbs.com/

webdesignerdepot