設(shè)計(jì)趨向每年都在改變，出于種種因素，有的設(shè)計(jì)趨向在演進(jìn)中日益隱沒(méi)，有的則在大家的熟練使用進(jìn)程中漸入佳境，甚至逐步褪變成為主流。作為一個(gè)專(zhuān)業(yè)的設(shè)計(jì)機(jī)構(gòu)，我們對(duì)于所有關(guān)聯(lián)的技術(shù)和設(shè)計(jì)趨向都極度敏感。通過(guò)過(guò)去一年的觀察，我們能夠總括出下面16大設(shè)計(jì)趨向。

1. 可用性設(shè)計(jì)

2017年，設(shè)計(jì)的大方向繼續(xù)向著客戶傾斜?？蛻趔w驗(yàn)在整個(gè)設(shè)計(jì)中的權(quán)重將繼續(xù)加大。如果你的設(shè)計(jì)在可用性上瑕疵的話，再炫酷也不會(huì)有人問(wèn)津。

如果不能專(zhuān)注地做好客戶體驗(yàn)設(shè)計(jì)，在即將到來(lái)的未來(lái)，你是無(wú)法持久地吸調(diào)用戶的。無(wú)論是谷歌在算法上的變更，還是客戶行徑數(shù)據(jù)的變遷，都指向同一個(gè)方向：你的網(wǎng)站必須加載得更快，也必須更加易用。

對(duì)于電商網(wǎng)站而言，加載速度的影響會(huì)更為明顯，由于加載速度每延遲一秒，就意味著27%的銷(xiāo)量流失掉了。其他的網(wǎng)站也類(lèi)似，只不過(guò)形成的影響不盡相同。

2. 響應(yīng)式設(shè)計(jì)

時(shí)至今日，響應(yīng)式網(wǎng)站設(shè)計(jì)不再是一個(gè)可選項(xiàng)，而是必選項(xiàng)了。手機(jī)端無(wú)疑已經(jīng)是真確意義上的“第一屏”了。不同類(lèi)別不同尺寸的屏幕讓設(shè)計(jì)師們面對(duì)的界面是真確意義上的“碎片化”的屏幕選項(xiàng)，所以響應(yīng)式不得不為之。

對(duì)，你必須得讓你的設(shè)計(jì)可用，這樣一來(lái)，你就必須讓所有屏幕都能夠正常顯示。值得留意的是，作為目前的一項(xiàng)鐵律，如果你的網(wǎng)站用手機(jī)打開(kāi)而無(wú)法正常瀏覽的話，通常意味著你需要修改和調(diào)整了。

在即將到來(lái)的將來(lái)，響應(yīng)式是必須品，不存在某個(gè)尺寸或格式可以搞定所有問(wèn)題，并且變?yōu)轫憫?yīng)式的將不僅僅是網(wǎng)頁(yè)本身，還有LOGO、Banner等所有關(guān)聯(lián)元素。最值得進(jìn)修的案例就是Netflix了，全面響應(yīng)式的設(shè)計(jì)，讓你徹底告別拉伸和馬賽克。

3. APP設(shè)計(jì)入侵網(wǎng)站設(shè)計(jì)范疇

網(wǎng)站設(shè)計(jì)早就應(yīng)當(dāng)向APP設(shè)計(jì)進(jìn)修了，它應(yīng)當(dāng)更加高效，更低干擾，應(yīng)當(dāng)能提供定制化的客戶體驗(yàn)。

隨著網(wǎng)絡(luò)的膨脹和網(wǎng)絡(luò)空間的飽和度的提升，設(shè)計(jì)和策劃人員也著手在網(wǎng)頁(yè)的個(gè)性化瀏覽上下功夫，添加更多齊備“排他性”的特質(zhì)。

你要懂得移除非必須的信息，讓客戶能夠盡可能快地同你的網(wǎng)頁(yè)內(nèi)容實(shí)行交互。

4. 更智能的菜單

一些客戶已經(jīng)著手厭倦漢堡菜單和導(dǎo)航圖標(biāo)，但是這種情形僅僅只是著手，由于菜單正在進(jìn)化為越來(lái)越智能。

采用隱藏式導(dǎo)航的網(wǎng)頁(yè)正在逐步增多，這或許很快會(huì)成為一種常態(tài)。這一設(shè)計(jì)出現(xiàn)的原因是，這樣的設(shè)計(jì)能夠讓客戶更少被非關(guān)鍵信息所干擾。

但是，即使我們看不到菜單的存在，但是經(jīng)驗(yàn)告訴我們，菜單純定是存在的，因此我們無(wú)需為此擔(dān)心——由于當(dāng)我們需要它的時(shí)候，菜單會(huì)在適合的地方出現(xiàn)。

專(zhuān)家還估測(cè)，未來(lái)的菜單可能是多方向滾動(dòng)的，不過(guò)就目前而言，這并沒(méi)有明晰的準(zhǔn)則，未來(lái)會(huì)有種種可能性。

5. 模塊和模塊化文本

沒(méi)人會(huì)喜愛(ài)翻看文章的時(shí)候，發(fā)現(xiàn)導(dǎo)語(yǔ)又臭又長(zhǎng)，是吧？那么在網(wǎng)頁(yè)上，最佳的體現(xiàn)方式是提供一份簡(jiǎn)短版本的導(dǎo)語(yǔ)，然后設(shè)計(jì)前來(lái)救場(chǎng)：提供一套模塊化的部署計(jì)劃。
模塊化設(shè)計(jì)之下，每個(gè)部分都會(huì)劃分成為單獨(dú)的區(qū)塊，便于使用。但是這一的設(shè)計(jì)并不會(huì)顯得單調(diào)，相反，它更加難于估測(cè)，它可能會(huì)將內(nèi)容以更讓人感興趣、更符合于探索的方式體現(xiàn)出來(lái)。

就像讀雜志一樣，客戶的實(shí)現(xiàn)會(huì)從一個(gè)內(nèi)容區(qū)塊跳轉(zhuǎn)到另外一個(gè)區(qū)塊，從一種類(lèi)別跳轉(zhuǎn)到另外一種類(lèi)別。

6. 無(wú)限滾動(dòng)和模塊化設(shè)計(jì)

這也是網(wǎng)站設(shè)計(jì)近期著手潮流的一種玩法，模塊化滾動(dòng)頁(yè)面設(shè)計(jì)。網(wǎng)頁(yè)被劃分成眾多單獨(dú)的模塊，每個(gè)模塊內(nèi)的滾動(dòng)交互單獨(dú)于其他的模塊。

聽(tīng)起來(lái)太過(guò)復(fù)雜？這倒不然，實(shí)際上你可能會(huì)在某些網(wǎng)站中看到過(guò)類(lèi)似的狀況，側(cè)邊欄的滾動(dòng)速度和頁(yè)面正文的滾動(dòng)速度不同。當(dāng)然，在模塊化滾動(dòng)的頁(yè)面中，這種狀況會(huì)更加明顯，特質(zhì)也更加顯著。腦補(bǔ)一下，兩欄式頁(yè)面，兩列內(nèi)容獨(dú)立滾動(dòng)，就像下面這個(gè)案例：

模塊化無(wú)限滾動(dòng)也是基于一個(gè)相同的假設(shè)：向下滾動(dòng)一直更容易的使用，客戶不用停下來(lái)點(diǎn)擊翻頁(yè)。這也難怪越來(lái)越多的客戶沉迷于這種交互形式。

7. Material Design

實(shí)際上Material Design 的推出能夠追溯到2013年，但是它的潮流真確著手于2015年。如果你仔細(xì)觀察過(guò)各個(gè)范疇的設(shè)計(jì)風(fēng)格的改變，你會(huì)發(fā)現(xiàn) Material Design 著手大規(guī)模地出當(dāng)前網(wǎng)頁(yè)、APP甚至藝術(shù)作品當(dāng)中，我們能夠預(yù)見(jiàn)到 2017年 Material Design 設(shè)計(jì)風(fēng)格的爆發(fā)式潮流。

8. 扁平化設(shè)計(jì)

嚴(yán)格意義上來(lái)講，Material Design 算是扁平化設(shè)計(jì)中的一個(gè)分支，它有著典型的“紙”的隱喻。廣泛意義上的扁平化設(shè)計(jì)依然極其潮流，甚至能夠說(shuō)是極其受歡迎。

近幾年扁平化的風(fēng)潮之下，眾多品牌也都著手選取簡(jiǎn)約現(xiàn)代而扁平的風(fēng)格，視覺(jué)設(shè)計(jì)也大都秉承少即是多的理念。

扁平化設(shè)計(jì)的優(yōu)點(diǎn)很明顯，這些優(yōu)點(diǎn)緊要呈現(xiàn)在客戶體驗(yàn)上，他讓網(wǎng)頁(yè)更加輕量自由，降低負(fù)擔(dān)，提高加載時(shí)間。

扁平化設(shè)計(jì)和幽靈按鈕等時(shí)下潮流的設(shè)計(jì)元素能夠很好地配合起來(lái)，隨著時(shí)間的沉淀，類(lèi)似Material Design的輕量級(jí)陰影的加入到扁平化設(shè)計(jì)中，通常我們稱之為扁平化2.0。

9. 視覺(jué)化的故事體現(xiàn)

一圖勝千言，相比于長(zhǎng)篇大論的文字，視覺(jué)化的故事體現(xiàn)方式會(huì)更加直觀，也更適宜時(shí)下的文化特征于客戶的閱讀習(xí)慣。我想下面的數(shù)據(jù)會(huì)給你更多的信心：

·全球范圍內(nèi)有1億人每天至少觀看一個(gè)視頻

·網(wǎng)站訪客中64%的人會(huì)在觀看視頻后選取購(gòu)買(mǎi)

·80% 的觀眾會(huì)在持續(xù)觀看一個(gè)廣告30天后選取購(gòu)買(mǎi)

·92%的人有觀看視頻之后共享的行徑

·人類(lèi)處理視覺(jué)元素的速度比文字快6萬(wàn)倍

10. 信息圖

信息圖是近年來(lái)每年都在增長(zhǎng)的一種設(shè)計(jì)方法，信息圖以更加視覺(jué)化的方式體現(xiàn)出信息和數(shù)據(jù)，讓客戶更容易接受。信息圖的火熱除了本身的優(yōu)點(diǎn)之外，導(dǎo)致它潮流的的因素很大程度上源自于社交網(wǎng)絡(luò)、SEO和內(nèi)容營(yíng)銷(xiāo)的大量需求。

2017年，信息圖肯定進(jìn)一步成長(zhǎng)，信息圖的模板會(huì)更加多樣絢麗，或許你會(huì)看到更多有意思的扁平風(fēng)插畫(huà)和藝術(shù)化的表達(dá)，或許信息圖會(huì)和大數(shù)據(jù)實(shí)行更親密的結(jié)合。

11. 炫酷的字體排版

不論是帥氣的網(wǎng)站還是令人印象深刻的信息圖，炫酷的字體排版似乎已經(jīng)成為標(biāo)配了。漂亮的字體排版已經(jīng)成為品牌化表達(dá)的緊要手段，是體現(xiàn)性格的實(shí)用手段。

其實(shí)字體排版本身就是一門(mén)語(yǔ)言。在幾年前，通常只有專(zhuān)業(yè)的平面設(shè)計(jì)師能玩轉(zhuǎn)它，不過(guò)隨著各種字體的廣泛潮流，使得眾多并不精通字體設(shè)計(jì)的設(shè)計(jì)師也能夠搞定字體排版。

12. 現(xiàn)代復(fù)古

現(xiàn)代復(fù)古風(fēng)絕對(duì)夠酷。從20世紀(jì)初到90年代之間所潮流的種種元素在當(dāng)前看來(lái)是極其復(fù)古的，像素藝術(shù)、巨大的移動(dòng)電話，Tron等等這些元素時(shí)下的現(xiàn)代風(fēng)結(jié)合到一起，構(gòu)建出一種獨(dú)特的復(fù)古氛圍，有底蘊(yùn)，有層次，極其Geek。

13. 豐富色彩

豐富的用色并不是越多越好，這里說(shuō)的是接近80年代風(fēng)格的彩虹式用色，多個(gè)類(lèi)似蠟筆的低飽和度色彩協(xié)調(diào)地搭配到一起，營(yíng)造出一種愉悅而活潑的氛圍，這種配色方式你能夠在2017年春的潘通時(shí)尚潮流色報(bào)告中得到印證。

14. 柵格和幾何形狀

柵格化部署將會(huì)成為CSS語(yǔ)言規(guī)范中的一部分。柵格不僅主宰著網(wǎng)站設(shè)計(jì)，還影響著平面設(shè)計(jì)，這種最早源自于瑞士的現(xiàn)代主義運(yùn)動(dòng)的設(shè)計(jì)方式的確有其獨(dú)到之處。另外一個(gè)值得一提的是幾何形狀的使用。

幾何形狀在網(wǎng)站設(shè)計(jì)和平面設(shè)計(jì)中都是極其靈驗(yàn)的裝飾元素，它同時(shí)下潮流的種種設(shè)計(jì)元素和設(shè)計(jì)技法都能夠無(wú)縫地搭配在一起，著也是它成為設(shè)計(jì)趨向的緊要因素之一。

15. 干掉圖庫(kù)

在網(wǎng)站中引入圖庫(kù)其實(shí)是一件極其無(wú)聊而道理原創(chuàng)的一種方式。固然圖庫(kù)網(wǎng)站許多，但是你會(huì)發(fā)現(xiàn)大家挑的圖片一直那幾個(gè)。這也是為何眾多圖庫(kù)類(lèi)的網(wǎng)站都在力圖推薦真確潮流的、高素養(yǎng)的圖片。

固然有數(shù)以百萬(wàn)計(jì)的圖片可供選取，不過(guò)越來(lái)越多的設(shè)計(jì)師著手選取自己拍圖，甚至親自手繪來(lái)搞定問(wèn)題。

16. 視頻和GIF圖

視頻背景和動(dòng)態(tài)圖背景也是目前正在潮流的趨向之一，2017年將會(huì)有更多的網(wǎng)站選取這樣的設(shè)計(jì)。

當(dāng)然，GIF圖在社交網(wǎng)絡(luò)上通常作為動(dòng)態(tài)表情而存在，那些內(nèi)涵十足的內(nèi)容擁有著強(qiáng)大的宣傳力。