最近，25學(xué)堂的小編看到很多小伙伴開始對自己公司產(chǎn)品的移動APP產(chǎn)品進行了一些重構(gòu)或者是APP產(chǎn)品的重設(shè)計。

當(dāng)然也有一些，新進入一家公司，對公司之前設(shè)計的移動APP產(chǎn)品重新設(shè)計和迭代升級。

這節(jié)課主要跟大家分享2塊內(nèi)容：

上圖來自美女設(shè)計師的追波網(wǎng)主頁項目：https://dribbble.com/JunYao

第一塊：APP重設(shè)計的工作流程是什么？

讓大家了解正常的APP重設(shè)計的工作流程，到底是一個重設(shè)計流程。無論是APP產(chǎn)品經(jīng)理還是APP設(shè)計師，都有義務(wù)和責(zé)任深入了解整個項目的重設(shè)計過程。

下面還是以怡呼吸APP重設(shè)計項目當(dāng)中分享的流程給大家看看。

看完這個流程圖，可以得出APP重設(shè)計是一個非常復(fù)雜的過程，需要考慮的東西和知識面是比較多的。25學(xué)堂建議各位多多融入項目團隊當(dāng)中，把自己負責(zé)的那塊好好深思。前提是圍繞重設(shè)計的目標。

比如下面的APP設(shè)計師的重設(shè)計思路：

在著手設(shè)計前的數(shù)次討論中我們逐步清晰了本次優(yōu)化的基本原則：用戶的時間是寶貴的，我們應(yīng)該通過更好的設(shè)計幫助他們節(jié)約時間提高效率。

基于這樣的原則，我們將這次重新設(shè)計的核心策略定義為：快。

通過設(shè)計讓用戶每次想做的事情變得簡單高效、重要且使用高頻的功能和內(nèi)容更容易找到。不僅如此，訪問知乎的速度也需要變得更快，不要把時間浪費在等待上?；诖?，我們梳理出了如下幾個待修改的點：

1、梳理個人頁面的信息結(jié)構(gòu)，讓想找的內(nèi)容更好找

2、梳理內(nèi)容操作欄的優(yōu)先級，突出更重要的操作

3、內(nèi)容操作欄應(yīng)該隨時可訪問

4、詳細資料應(yīng)該可以就地查看而不用跳轉(zhuǎn)頁面

5、查看新私信應(yīng)該更加快速和流暢

6、優(yōu)化排版，采用了更易讀的字體和字號，提升閱讀效率

第二部分：具體如何去做好APP重設(shè)計呢？作為APP設(shè)計師，可以從哪幾個方面入手呢？

下面25學(xué)堂繼續(xù)以眾安保險APP的重設(shè)計為例，跟大家解讀。

最重要的就是要確定APP重設(shè)計改版的視覺設(shè)計關(guān)鍵詞確定為：年輕、簡潔、輕快

根據(jù)設(shè)計關(guān)鍵詞，我們重新定義了色彩、圖標及界面元素和整體視覺風(fēng)格。

1、 強調(diào)品牌色，減少輔助色，明晰色彩層級

眾安品牌的綠色是生命、健康與活力的隱喻，同時也是年輕向上的體現(xiàn)，視覺方面決定沿用綠色的主色調(diào)。參考流行色趨勢，明亮的色彩更吸引用戶注意力，營造輕快的感覺，因此我們進行了適當(dāng)微調(diào)，提高色彩明度，讓產(chǎn)品看起來更加輕盈。

減少主要色彩數(shù)量，增加主色調(diào)的顯示比例，強化品牌感受;多層級的文字色階用于適配多樣的內(nèi)容與信息。

2、 圖標輕量化、統(tǒng)一化

改版過程中，我們對App內(nèi)圖標進行了梳理和再設(shè)計。設(shè)計過程中，為了達到簡潔易識別的目標，對圖標的造型、風(fēng)格、質(zhì)感進行了很多探索。

為了打造產(chǎn)品的統(tǒng)一感，所有圖標都沿用了相同的視覺元素，統(tǒng)一的圓角使圖標有一定活潑感，不生硬，又保持了中性的感覺。

另外，根據(jù)應(yīng)用場景定制不同的設(shè)計策略，如一級導(dǎo)航、分類導(dǎo)航、輔助圖標。

3、 化繁為簡，減少頁面元素種類

迎合現(xiàn)在的設(shè)計趨勢，去除所有裝飾元素，減少不必要元素，適當(dāng)增加留白，保持頁面干凈、清晰。作為保險產(chǎn)品，為了達到清晰易懂的目的，增加大量圖片和圖形化內(nèi)容，提高用戶的理解效率。

4、 統(tǒng)一視覺規(guī)范，提升工作效率

在完成主要頁面設(shè)計的同時，統(tǒng)一的視覺規(guī)范不僅能提高相關(guān)設(shè)計師的工作效率，也能更清晰的傳達給開發(fā)，提高整個團隊的效率，同時，也為App中其他業(yè)務(wù)線的設(shè)計師提供規(guī)范，保持App內(nèi)不同產(chǎn)品風(fēng)格一致。

特別閱讀：

1、3位UI設(shè)計師對網(wǎng)易云音樂APP進行改版重設(shè)計

2、淺談APP設(shè)計師如何去做好APP產(chǎn)品重設(shè)計

3、APP設(shè)計師原創(chuàng)之作：手機QQ視覺UI的重設(shè)計欣賞