偷師顧名思義就是：偷學(xué)別人的功夫本事，上圖是一本書的封面，感興趣的小伙伴們可以去閱讀一下。

而今天25學(xué)堂在雙十一這樣的特殊節(jié)日里面，跟APP設(shè)計(jì)新手們來聊聊關(guān)于APP設(shè)計(jì)的那些事。

如何來向一款成熟的優(yōu)秀的APP進(jìn)行偷師，針對(duì)的是APP設(shè)計(jì)和APP交互體驗(yàn)等方面。

比如今天最火的APP肯定是淘寶APP、支付寶APP、京東APP、一號(hào)店APP等等。

但是細(xì)細(xì)的去品味這些電商APP，我們都會(huì)發(fā)現(xiàn)他們都有一些共性。而且布局的模式基本是一樣的。

那么到底，如何向這些優(yōu)秀APP的設(shè)計(jì)和APP交互體驗(yàn)來偷師呢?

偷師的前提是務(wù)必熟讀各個(gè)平臺(tái)的設(shè)計(jì)規(guī)范。iOS、Android、WindowsPhone官方設(shè)計(jì)規(guī)范匯總

最美應(yīng)用的創(chuàng)始人馬力說：APP設(shè)計(jì)新手應(yīng)該對(duì)一款成熟而優(yōu)秀的APP進(jìn)行打散重構(gòu)。

分為2個(gè)方面來著手：

表層 ：

其實(shí)我們平常在欣賞一些好的APP應(yīng)用的時(shí)候，移動(dòng)APP產(chǎn)品經(jīng)理和APP設(shè)計(jì)師都會(huì)看到這些產(chǎn)品里好的地方，立刻會(huì)想如何用到自己的產(chǎn)品里來。

深層 : ? ?就需要我們進(jìn)行思考，要拆開來看。

1、試試從用戶、需求、任務(wù)、信息、視覺幾個(gè)方面來看，交互是如何同不同的方面產(chǎn)生聯(lián)系的。

2、一個(gè)應(yīng)用，里面最重要的任務(wù)是什么，界面中最突出的部分是不是反應(yīng)了這個(gè)任務(wù)的優(yōu)先級(jí)？

3、是不是在引導(dǎo)用戶的注意力和操作？希望用戶去做的操作，是如何巧妙的一點(diǎn)點(diǎn)推動(dòng)用戶往前走的？（我將這稱為跨越臨界點(diǎn)）

4、信息是如何呈現(xiàn)給用戶的？有無層次？都用了什么樣的形式？能否反應(yīng)出他們的重要性和關(guān)系來？

5、有無考慮到用戶的感覺？視覺是否營造了氛圍，并和交互的框架緊密結(jié)合起來？

簡單的來說就是三個(gè)方面：

1、它的層次結(jié)構(gòu)是怎么樣的？

2、它是如何保證體驗(yàn)的一致性的？

3、它是如何幫用戶最快的達(dá)到使用目的的？

同時(shí)我們也需要認(rèn)證去分析優(yōu)秀APP的框架，了解APP的功能目標(biāo)，用戶操作流向，最終的轉(zhuǎn)化目標(biāo)。在每一個(gè)轉(zhuǎn)化節(jié)點(diǎn)上，關(guān)注交互行為的設(shè)計(jì)。

交互設(shè)計(jì)的關(guān)注點(diǎn)：組件一致性（降低用戶學(xué)習(xí)成本，降低開發(fā)迭代成本），組件耦合度（窮舉用戶行為路徑，逆向思考之所以那樣設(shè)計(jì)的原因），組件高效性（迅速完成轉(zhuǎn)化，提高用戶轉(zhuǎn)化率。需要跟耦合度做一定的權(quán)衡）等等。

APP視覺設(shè)計(jì)和APP交互體驗(yàn)都是為APP產(chǎn)品服務(wù)的，是對(duì)產(chǎn)品功能的表達(dá)，好的視覺交互未必炫酷，但用在產(chǎn)品上是“合適”的，這就夠了。

知乎上面的 有一位超級(jí)APP粉絲是這樣做的。大家可以借鑒一下。大致分為了下面6個(gè)步驟：

1. 界面截圖 or 錄屏。

把App整體的玩一遍，過程中截圖留檔。如果是對(duì)手勢支持較多或者動(dòng)效較多的會(huì)錄屏留檔。

2. 頁面Sitemap

App里不宜層級(jí)過深，把截圖整理后「同頁面不同狀態(tài)可以合并」還原一下Sitemap?？纯磩e人如何組織自己的結(jié)構(gòu)。

3. 流程重現(xiàn)

還是利用前面的截圖，在畫圖工具里自己串一下。這里就可以發(fā)現(xiàn)這些優(yōu)秀apps對(duì)于自己設(shè)計(jì)規(guī)范的定義。比如對(duì)于某操作，什么時(shí)候使用浮層，什么時(shí)候使用頁面。

4. 競品分析

有對(duì)比才能看出設(shè)計(jì)差異和設(shè)計(jì)理念。找到同類型的優(yōu)秀應(yīng)用?？纯疵恳粋€(gè)產(chǎn)品、設(shè)計(jì)上的不同處理。比如理財(cái)類和單位換算類，我就分別買了僅5款來做對(duì)比。你就會(huì)發(fā)現(xiàn)其中真正的差異。

5. 保持使用

如果你覺得他真的不錯(cuò)，記得要時(shí)常用一下。因?yàn)槲覀儾豢赡茉谝淮问褂弥芯湍馨l(fā)現(xiàn)其中的每一個(gè)設(shè)計(jì)環(huán)節(jié)。如果是社交類的應(yīng)用，最好找?guī)讉€(gè)有同樣興趣的同學(xué)平常一起來做測試。

6、在APP設(shè)計(jì)群多問問其他設(shè)計(jì)師，或者直接找到這款A(yù)PP的設(shè)計(jì)師親自來問問。

最后，想加入APP設(shè)計(jì)群的小伙伴們可以點(diǎn)擊25學(xué)堂網(wǎng)站底部的加群按鈕。