今天25學(xué)堂跟大家聊聊移動(dòng)APP的設(shè)計(jì)風(fēng)格。主要的APP設(shè)計(jì)風(fēng)格大致分為以下三種：

扁平化（Flat Design?）、極簡、Material Design（谷歌APP設(shè)計(jì)風(fēng)格）

APP設(shè)計(jì)風(fēng)格是指APP通過主要的幾種顏色搭配、頁面布局和界面交互體驗(yàn)等給用戶呈現(xiàn)出的整體視覺感受。

下面我們就來重點(diǎn)分析下這三種目前主流的APP設(shè)計(jì)風(fēng)格的區(qū)別。

APP設(shè)計(jì)風(fēng)格一、扁平化設(shè)計(jì) ??Flat Design

首先，扁平化設(shè)計(jì)是一個(gè)大的范疇。它既包含了極簡設(shè)計(jì)風(fēng)格和Material Design、微軟的metro風(fēng)格。是相對(duì)之前的蘋果擬物化設(shè)計(jì)風(fēng)格發(fā)展至今的。

1、什么是扁平化設(shè)計(jì)

去除冗余、厚重和繁雜的裝飾效果。而具體表現(xiàn)在去掉了多余的透視、紋理、漸變以及能做出3D效果的元素，這樣可以讓“信息”本身重新作為核心被凸顯出來。同時(shí)在設(shè)計(jì)元素上，則強(qiáng)調(diào)了抽象、極簡和符號(hào)化。

更少的按鈕和選項(xiàng)，這樣使得UI界面變得更加干凈整齊，使用起來格外簡潔，從而帶給用戶更加良好的操作體驗(yàn)。

優(yōu)點(diǎn)

1、界面美觀、簡約大方、條理清晰

2、設(shè)計(jì)元素上強(qiáng)調(diào)抽象、極簡、符號(hào)化，去除冗余的裝飾效果突顯App的文字圖片等信息內(nèi)容。

3、完美兼容pc網(wǎng)站、安卓、ios等不同系統(tǒng)的平臺(tái)和不同屏幕分辨率的設(shè)備，適應(yīng)性強(qiáng)。

缺點(diǎn)

》 ??降低用戶體驗(yàn)，在非移動(dòng)設(shè)備上令人反感；意思就是比較抽象

》 ??缺乏直觀，需要一定的學(xué)習(xí)成本和意思的表達(dá)不清晰。

》 ??傳達(dá)的感情不豐富，不直觀。

設(shè)計(jì)技巧分享

》 ?簡單的設(shè)計(jì)元素

》?強(qiáng)調(diào)字體的使用

》?關(guān)注色彩

》?簡化的交互設(shè)計(jì)

》?偽扁平化設(shè)計(jì)

扁平化設(shè)計(jì)推薦閱讀：

1、APP配色學(xué)習(xí)：3個(gè)扁平化配色方案酷站推薦

2、如何設(shè)計(jì)移動(dòng)APP的扁平化及扁平化設(shè)計(jì)技巧

3、APP圖標(biāo)設(shè)計(jì)教程：扁平化設(shè)計(jì)風(fēng)格分析

APP設(shè)計(jì)風(fēng)格二、極簡設(shè)計(jì)風(fēng)格

極簡在攝影中是一種突出主體取簡去繁的攝影手法，在生活中是一種放松的生活態(tài)度，在設(shè)計(jì)中是一種簡潔的設(shè)計(jì)手法。

簡約正是極簡設(shè)計(jì)風(fēng)格的代表產(chǎn)物。極簡設(shè)計(jì)以簡單，易用為原則，滿足人們生活需要原則簡單，易于掌握。

簡約正在成為當(dāng)代人的審美標(biāo)準(zhǔn)，無論是排版還是交互，越簡單的設(shè)計(jì)反而更加吸引人。不僅用戶的審美在發(fā)生改變，移動(dòng)APP設(shè)計(jì)師們也在為此而努力著。

APP的極簡設(shè)計(jì)風(fēng)格如下：

界面：簡潔整齊大方，回歸自然，尊重自然規(guī)律，依據(jù)形態(tài)自然體現(xiàn)。明快而富視覺沖擊力的個(gè)性圖形，用色單純洗練，刪繁就簡，以少勝多，視覺中心點(diǎn)明確。大面積的留白，使圖、文、底主次分明，更具有強(qiáng)烈的視覺沖擊力。交互：核心在于以人為本，更加重視用戶自然的感受。通過交互來設(shè)計(jì)出用戶希望出現(xiàn)的界面效果。

之前介紹的《愛玩動(dòng)圖和喜歡極簡主義風(fēng)格的APP推薦：挖豆》和《APP產(chǎn)品秀：一款手機(jī)上制作簡歷的神器【極簡APP】》

APP設(shè)計(jì)風(fēng)格三、Material Design設(shè)計(jì)

Material?Design設(shè)計(jì)風(fēng)格是興起于谷歌安卓系統(tǒng)的5.1以后的。也是谷歌安卓手機(jī)操作系統(tǒng)的風(fēng)格。也是谷歌推出了全新的設(shè)計(jì)語言Material Design。

Material Design設(shè)計(jì)代表是卡片化設(shè)計(jì)風(fēng)格。

如今Material?Design將會(huì)慢慢成為全平臺(tái)設(shè)計(jì)規(guī)范和APP設(shè)計(jì)風(fēng)格的趨勢。

下面我們看下微博APP的Material?Design設(shè)計(jì)風(fēng)格。

當(dāng)然還有國外的一些設(shè)計(jì)網(wǎng)站的Material?Design的設(shè)計(jì)風(fēng)格的APP案例。例如：追波網(wǎng)的APP界面設(shè)計(jì)風(fēng)格。

現(xiàn)在讓我們回顧下Material Design的九大設(shè)計(jì)原則：

擴(kuò)展閱讀：最全安卓Material Design的設(shè)計(jì)原則和設(shè)計(jì)規(guī)范

1、材料是個(gè)隱喻?

（所謂的“材料”是基于觸覺現(xiàn)實(shí)，靈感來自于對(duì)于紙張和墨水的研究，也加入了想象和魔法的因素。）

2、表面是直觀和自然的

（表面和邊緣為現(xiàn)實(shí)經(jīng)驗(yàn)提供了視覺線索。使用熟悉的觸覺屬性，可以直觀地感受到使用情景。）

3、維度提供交互

光、表面和運(yùn)動(dòng)是展現(xiàn)交換的關(guān)鍵因素。逼真的光影效果顯出了各部分分離，劃分了空間，指示了哪些部分可以進(jìn)行操作。

4、適應(yīng)性設(shè)計(jì)

底層設(shè)計(jì)系統(tǒng)包括了交互和空間兩部分。每一個(gè)設(shè)備都能反映出同一底層系統(tǒng)的不同側(cè)面。每一設(shè)備的界面都會(huì)按照大小和交互進(jìn)行調(diào)整。

5、目錄用黑體和圖形設(shè)計(jì)，并帶有意圖

黑體能突出層次、意義，顯現(xiàn)焦點(diǎn)。深思熟慮的色彩選擇，層次分明的圖像，大范圍的鋪陳和有意的留白可以創(chuàng)造出浸入感和也能讓表達(dá)更清晰。

6、顏色、表面和圖標(biāo)都強(qiáng)調(diào)動(dòng)作效果

用戶行為就是體驗(yàn)設(shè)計(jì)的本質(zhì)。基本動(dòng)作效果是轉(zhuǎn)折點(diǎn)，他們可以改變整個(gè)設(shè)計(jì)，可以讓核心功能變得更加明顯，更為用戶指明了“路標(biāo)”。

7、? 用戶發(fā)起變化

操作界面中的變化來自于用戶行為。用戶觸摸操作產(chǎn)生的效果要反應(yīng)和強(qiáng)化用戶的作用。

8、? 動(dòng)畫效果要統(tǒng)一

所有動(dòng)畫效果都在統(tǒng)一的環(huán)境下顯示。即使發(fā)生了變形或是重組，對(duì)對(duì)象的呈現(xiàn)也不能破壞用戶體驗(yàn)的連續(xù)性。

9、動(dòng)作富有情感和一致性

動(dòng)作是有意義的，而且是恰當(dāng)?shù)?，?dòng)作有助于集中注意力和保持連續(xù)性。

總之，手機(jī)APP界面設(shè)計(jì)的重點(diǎn)無非就是兩個(gè)：一個(gè)是界面視覺設(shè)計(jì)，一個(gè)是考慮界面設(shè)計(jì)的用戶體驗(yàn)。以上就是25學(xué)堂跟各位對(duì)如今最流行的三種APP設(shè)計(jì)風(fēng)格的對(duì)比分析。

扁平化、極簡、Material Design也是APP設(shè)計(jì)師目前常用的設(shè)計(jì)風(fēng)格。