這篇文章我將從大家經(jīng)常用到的百度外賣（iOS v4.4.1）說開去，闡述我自己分析一款app時(shí)候的思維邏輯和過程，當(dāng)然我說的不一定對(duì)，希望能給新手朋友們一些思路。

信息架構(gòu)梳理

我之前一直有跟進(jìn)一些app迭代的習(xí)慣，比如百度外賣就是其中之一，當(dāng)它更新來到了v4.4.1之后，和之前可謂發(fā)生了天翻地覆的變化，當(dāng)我重新開始嘗試分析它的時(shí)候，我采取的辦法依舊還是和分析一款陌生app一樣，從已有產(chǎn)品的信息架構(gòu)入手。

一個(gè)產(chǎn)品沒有信息架構(gòu)梳理，就像在蓋一所遲早都會(huì)倒的樓。

信息架構(gòu)到底是個(gè)什么東西呢？其實(shí)我所理解的并沒有江湖傳說的那么懸，我一般會(huì)把a(bǔ)pp的每一個(gè)點(diǎn)擊事件都點(diǎn)擊一遍，然后做相應(yīng)的記錄，比如我做百度外賣如下這張信息架構(gòu)圖大概用了一個(gè)半小時(shí)，整個(gè)過程乏善可陳：『點(diǎn)擊一下，記錄頁面信息，再點(diǎn)擊一下』如此循環(huán)。

但是這就像是破案一樣，你會(huì)從中發(fā)現(xiàn)一些線索去了解百度外賣的產(chǎn)品經(jīng)理和交互設(shè)計(jì)師們當(dāng)時(shí)是如何思考的。

下面請(qǐng)看百度外賣v4.4.1信息架構(gòu)梳理圖：

大家可以先用這張圖對(duì)比大家現(xiàn)在iOS手機(jī)上的百度外賣(v4.4.1)看看，由于我是整張截圖可能會(huì)存在字太小頁面太長(zhǎng)的問題，沒關(guān)系一會(huì)分析的時(shí)候我會(huì)截大圖，而且在文章下方的“下載”按鈕可以下載信息架構(gòu)圖。至于圖上的星星點(diǎn)點(diǎn)和框框的標(biāo)記，一會(huì)也會(huì)詳細(xì)闡述。

Part 1 – 首頁

首頁整個(gè)單元中存在幾個(gè)奇妙的交互亮點(diǎn)：

1、用力上拉，百度外賣會(huì)根據(jù)最近的一些熱點(diǎn)更換不同的插畫：

這是情感化設(shè)計(jì)的一種體現(xiàn)方式，偶爾給用戶帶來發(fā)現(xiàn)的驚喜。

2、搜索框上滑消失過后會(huì)隱藏到右側(cè)，如下圖所示：

3、滑動(dòng)到信息架構(gòu)里的『點(diǎn)餐流程』開始時(shí)，『為你精選』和『此刻最熱』兩個(gè)tab會(huì)置頂。如下圖所示：

4、點(diǎn)擊大banner不僅支持滑動(dòng)，點(diǎn)擊右下角按鈕可供預(yù)覽。

雖然這個(gè)功能看似沒有什么特別重要的作用，但這是交互設(shè)計(jì)師為愉悅用戶設(shè)計(jì)的小把戲，明顯我感受到了他們的誠(chéng)意：

5、購(gòu)物車列表隱藏當(dāng)前定位不可送的物品

外賣類產(chǎn)品一定有一個(gè)用戶情景是這樣的，用戶今天在家里面放了一堆食物在購(gòu)物車但是未支付，過了幾天在公司不知道吃什么的時(shí)候發(fā)現(xiàn)我還有個(gè)購(gòu)物車于是打開匆忙下單，誰曾想你在家時(shí)候放置在購(gòu)物車內(nèi)的外賣不一定能送到單位地址，肯定是百度外賣遇到這樣的用戶反饋很多，所以產(chǎn)品做出了這樣的交互：隱藏當(dāng)前定位不可送達(dá)的物品。

（看到這個(gè)頁面的時(shí)候我不禁腦補(bǔ)除了一個(gè)被廣大用戶投訴疲于解釋的客服生無可戀的表情。）

說完了一些交互亮點(diǎn)之后，我們回過頭來看看首頁的信息架構(gòu)：

在我的信息架構(gòu)中，我把產(chǎn)品的核心邏輯流程加上了紅色五角星。也就是說一個(gè)外賣產(chǎn)品中，選擇地址，購(gòu)物車，搜索功能和點(diǎn)餐流程是一定必不可少的。其中我又把點(diǎn)餐流程拆解成了選擇店鋪、從店鋪選擇菜品和支付流程三個(gè)關(guān)鍵部分以便于大家理解。

那么既然只需要紅色五角星的功能就可以滿足用戶的點(diǎn)餐流程，那么近半年來百度外賣app中加入的那些奇奇怪怪的功能是為啥呢？為了理解這個(gè)問題，我們先來看一下百度外賣這款產(chǎn)品半年來都做了哪些更新？答案是新增了以下幾點(diǎn)：

1. 外賣榜單
2. 小banner
3. 遇見你的菜+能量午餐（匠心晚餐）
4. 精選專題
5. 頻道button數(shù)量（從8個(gè)變成了現(xiàn)在的19個(gè)）

而且新增的這些內(nèi)容層級(jí)奇高，占據(jù)了首頁的第一、二屏

關(guān)于這些新增內(nèi)容在這里我有一些自己的疑問和思考分享給大家：

1. 為什么之前已經(jīng)有了一個(gè)大的輪播banner之后仍然要增加一些小的滑動(dòng)banner？

我猜想可能是出于兩種考：

1、為了UI的美觀

在之前我的經(jīng)驗(yàn)是，一款app，允許用戶自定義的圖文越少，產(chǎn)品就越能做到美觀，外賣產(chǎn)品要面向很多獨(dú)立商家，每戶商家logo千奇百怪，比如大家看看下面這兩張圖的對(duì)比：

對(duì)比那種四爺牛拉logo被截?cái)嗟囊曈X體驗(yàn)來說，首屏加入了一套滑動(dòng)的小banner無疑是保證用戶進(jìn)入第一眼就能感到飽含食欲的關(guān)鍵。

但是我認(rèn)為作為一個(gè)體量這么大的產(chǎn)品，不會(huì)單純?yōu)榱艘曈X的美觀就加入這么大一組滑動(dòng)banner的，百度外賣加入這個(gè)一定有更加深層次的含義，于是我苦思冥想，想出了第二種可能性。

2、為了盈利創(chuàng)收

對(duì)的你沒有看錯(cuò)，百度外賣體量這么大，總會(huì)有商業(yè)變現(xiàn)產(chǎn)品經(jīng)理思考廣告入口往哪兒放，這么多的店鋪，除了默認(rèn)算法的排名以外還有沒有一些別的辦法可以取巧？提到變現(xiàn)這種羞羞噠事情總是讓我們杏眼含春，欲罷不能，嘴上說不要不要，但是產(chǎn)品形態(tài)體現(xiàn)上卻很誠(chéng)實(shí)：（好像有什么奇怪的app產(chǎn)品混了進(jìn)去）

3、為什么圓形的頻道button數(shù)量越來越多了？?

之前的外賣app，不論是百度還是美團(tuán)，如今種類都越來越多了，美團(tuán)從之前的8個(gè)變成了現(xiàn)在的16個(gè)，百度從之前的8個(gè)變成了現(xiàn)在的19個(gè)：（換上春節(jié)皮膚的icons）

有很多人可能和我有同樣的思考，比如我現(xiàn)在想喝粥吃粉吃面，那我直接去里面搜就好了啊，為什么現(xiàn)在多出了一個(gè)奇怪的『粥粉面』？比如我想吃點(diǎn)小龍蝦我直接去搜就好了啊為什么現(xiàn)在多出一個(gè)奇怪的『龍蝦盛宴』？偉大的設(shè)計(jì)準(zhǔn)則less is more為什么在這里一點(diǎn)都不less？

我猜想這些奇奇怪怪越來越多icons主要承擔(dān)著三個(gè)部分的產(chǎn)品作用：

第一個(gè)作用：更加便捷的簡(jiǎn)化流程。

當(dāng)我點(diǎn)擊第一個(gè)『餐飲』icon時(shí)，跳轉(zhuǎn)到了如下頁面：

大家可以看到上面的滑動(dòng)tab其實(shí)有『全部』、『品牌館』、『小吃快餐』、『粉面粥』、『川湘風(fēng)味』、『西式快餐』、『日韓料理』、『燒烤海鮮』和『香鍋烤魚』這么多種類的，那么為什么唯獨(dú)會(huì)把『粥粉面』這一項(xiàng)提前在前面獨(dú)立成一個(gè)icon？我猜想肯定是數(shù)據(jù)上點(diǎn)這一個(gè)分類產(chǎn)品的用戶遠(yuǎn)遠(yuǎn)高于別的分類，所以產(chǎn)品經(jīng)理根據(jù)數(shù)據(jù)做出的產(chǎn)品形態(tài)上的改變，把『粉面粥』這個(gè)tab單獨(dú)提前變成了『粥粉面』這一個(gè)icon，如下圖所示：（這里吐槽一下，這兩個(gè)名字不統(tǒng)一是什么鬼?。?/p>

（這個(gè)文案不統(tǒng)一的問題已經(jīng)得到修改）

第二個(gè)作用：突出一些用戶以為沒有的邊緣功能和為別的產(chǎn)品導(dǎo)流。

比如百度糯米，萬能跑腿，買藥和訂花、超市購(gòu)和定蛋糕水果奶茶之類的。

作為一線城市的年輕人，我們當(dāng)然在用了這么幾年的外賣產(chǎn)品之后知道他們什么都能定，但是對(duì)于三四線城市的萌新來說，他們可能一直以為外賣產(chǎn)品只能定食物，所以把他們放在這里會(huì)突出效果。

（今年過年我回家還鬧了一個(gè)笑話，我們四線城市父母看到百度糯米以為是過年了專門賣糯米的我也是驚了個(gè)呆 = =所以千萬不要試圖以為你是了解用戶的，用戶這種生物什么事情都干得出來……）

第三個(gè)作用：為以后的運(yùn)營(yíng)活動(dòng)和一些奇奇怪怪的市場(chǎng)行為埋下入口。

不得不承認(rèn)，這種圖標(biāo)頻道的設(shè)計(jì)方式一向就不是一種優(yōu)雅的辦法，只是在平臺(tái)類產(chǎn)品由于信息太多必須要有所分類之后在UI中形成的產(chǎn)物。

這種形態(tài)的ui設(shè)計(jì)模式最大的作用是有利于擴(kuò)展產(chǎn)品入口，所以萬一哪天你在百度外賣的這些頻道icon里面看到一些奇怪的廣告之類的東西也不用驚訝，畢竟是產(chǎn)品經(jīng)理和交互設(shè)計(jì)師們也不想的。

但是我認(rèn)為產(chǎn)品設(shè)計(jì)師不會(huì)這么無腦的為不可知的未來做擴(kuò)展，事實(shí)上工作中的產(chǎn)品設(shè)計(jì)主要都是為了解決當(dāng)前問題，所以這一點(diǎn)你們不要偏聽偏信，也歡迎交流別的意見。

好了 聊完小banner和這些頻道icons之后，我們來看百度外賣近半年來在app中新加入的『我最常吃』、『外賣榜單』、『遇見你的菜』、『能量午餐（匠心晚餐）』和『精選專題』五項(xiàng)：

這五項(xiàng)的層級(jí)都很高，大概在整個(gè)app首頁的第二屏，這樣設(shè)計(jì)到底為什么呢？

答：加入這五項(xiàng)的目的是為了減少用戶選擇！（劃重點(diǎn)）

去年跨年的時(shí)候羅胖『時(shí)間的朋友2017』演講里面曾經(jīng)講了一個(gè)故事，說的是他想請(qǐng)客吃飯但是不知道吃什么，于是咨詢了一位吃貨朋友，那個(gè)吃貨朋友告訴他：你如果要我告訴你那你就必須聽我的，聽我的就去xxx餐館，只點(diǎn)A、B、C、D、E、F這6樣菜，蘸料只放甲、乙兩種，不好吃你回來找我。羅胖表示那一刻特別幸福，心想這個(gè)朋友太靠譜了你還能對(duì)我再粗暴點(diǎn)么。。。

這個(gè)故事其實(shí)暗合百度外賣的產(chǎn)品邏輯：

• 『我最常吃』：喏，每次點(diǎn)的都是這幾樣，要不來份兒一樣的？
• 『外賣榜單』：喏，我們這里賣得最好和最受好評(píng)的是這幾樣。
• 『遇見你的菜』：喏，你也是老主顧了，我們推測(cè)啊你應(yīng)該最喜歡吃這幾樣。
• 『能量午餐（匠心晚餐）』：喏，這幾樣?xùn)|西是別人午餐（晚餐）常吃的，不然您試試？
• 『精選專題』：喏，這是俺們運(yùn)營(yíng)讓我們告訴你的，常吃這些啊對(duì)身體好！

你們說，有了這五項(xiàng)，誰還要一家店一家店的篩選？

如果用戶說我非要享受那種篩選的快感，那沒問題，您稍微下滑一點(diǎn)點(diǎn)兒就到篩選部分了，那部分您說了算~

可能剛開始更新的時(shí)候用戶是不太習(xí)慣前面多了這么多東西的。

（用戶內(nèi)心OS：什么亂七八糟的推薦，老子想吃什么自己不清楚？）

但是當(dāng)你接受了這個(gè)設(shè)定之后（不接受也沒辦法每天都要點(diǎn)餐啊——換隔壁美團(tuán)），發(fā)現(xiàn)其實(shí)會(huì)方便不少。

總結(jié)：Don’t TMD make users choose.

Part 2 – 訂單

首先感謝大家看到這里還沒有關(guān)掉，你已經(jīng)閱讀了三分之二了。

那我們就再來說一說第二個(gè)部分訂單。

你們肯定會(huì)有疑問，第二個(gè)部分難道不是『指南』么？對(duì)的，講道理的話，百度外賣整個(gè)app第二個(gè)單元確實(shí)是『指南』，但是大家有沒有一個(gè)疑問，為什么一個(gè)外賣app會(huì)有這樣一個(gè)奇怪和外賣半毛錢關(guān)系都沒有的單元，并且Buttonbar優(yōu)先級(jí)還排在第二個(gè)？所以百度外賣的『指南』這個(gè)單元我會(huì)在未來對(duì)比愛奇藝『泡泡』和拉勾『言職』一起詳細(xì)另起一文詳細(xì)說說為什么現(xiàn)在的大型app里面總有奇怪的東西混進(jìn)來。在這里就不做過多贅述。

關(guān)于訂單這個(gè)功能其實(shí)相對(duì)簡(jiǎn)單：

『萬能跑腿』這個(gè)功能大家用一下就知道了我就不說展開了（也沒有內(nèi)容展開）

我下面著重說一下訂單這個(gè)單元中中間涉及到一個(gè)產(chǎn)品設(shè)計(jì)中的小把戲叫埋深層級(jí)。

產(chǎn)品經(jīng)理肯定是不鼓勵(lì)用戶進(jìn)行投訴餐館操作的，但是投訴這個(gè)功能又必須存在，那如何解決這個(gè)矛盾呢？辦法是讓投訴這個(gè)操作的成本變高：

我清楚的記得，之前用戶在訂單列表頁就可以投訴，但是后來把投訴功能入口埋深到了下一層級(jí)——即必須點(diǎn)開訂單詳情才能投訴，如圖所示：

別看投訴功能就被埋深了一個(gè)層級(jí)，但是這個(gè)小小的改動(dòng)沒準(zhǔn)每個(gè)月能減少好幾萬單投訴呢。

既然說到這個(gè)了，那就不妨展開一些說點(diǎn)關(guān)于產(chǎn)品設(shè)計(jì)過程中某些功能信息層級(jí)的調(diào)整（下沉/上浮）規(guī)律，這些規(guī)律其實(shí)在不論是產(chǎn)品原型迭代或者UI設(shè)計(jì)在設(shè)計(jì)高保真迭代的時(shí)候都是可以作為理論支撐的點(diǎn)：

1. 某些功能是不推薦用戶使用但是又不能沒有的：方案是功能入口適當(dāng)下沉

比如修改密碼；登出賬號(hào)；平臺(tái)類產(chǎn)品的投訴，退款，退單；活動(dòng)報(bào)名類產(chǎn)品的請(qǐng)假等等

2. 某些平行功能當(dāng)中的某一個(gè)比另外幾個(gè)點(diǎn)擊使用率大很多：該功能入口單獨(dú)適當(dāng)上浮。（反之同理）

比如上文說到的『粥粉面』；比如微信更新之后把『收付款』當(dāng)中的『付款』功能提前。

但是這里的下沉和上浮的度一定要把握好，不能影響并行的層級(jí)上其他功能使用。比如大家試想一下如果微信的buttonbar依次變成『朋友圈』、『信息』、『通訊錄』、『發(fā)現(xiàn)』、『我』會(huì)發(fā)生什么事？我覺得大概率會(huì)把微信變成一個(gè)強(qiáng)調(diào)朋友圈的微博而削弱IM功能。

3. 某些產(chǎn)品策略上的功能入口：功能入口適當(dāng)（有時(shí)候不是適當(dāng) = =）上浮

比如喜馬拉雅的付費(fèi)精品；脈脈的定制頭條；拉勾的言職；今日頭條之前主推的『視頻』；支付寶的一堆社交。

總結(jié)：根據(jù)埋點(diǎn)數(shù)據(jù)或者用研靈活調(diào)整功能入口是產(chǎn)品設(shè)計(jì)中的常用手法，但是把握這個(gè)度的過程中，需要懷著一顆敬畏之心。

Part 3 – 我的

關(guān)于『我的』頁面很常規(guī)其實(shí)沒啥好講的，但是這里面兩有個(gè)小的有意思的點(diǎn)：

第一是陳列館式的設(shè)計(jì)讓每一個(gè)相互不搭的獨(dú)立功能都能放在第一層級(jí)。

第二是從產(chǎn)品形態(tài)上為百度錢包導(dǎo)了一波流：之前的運(yùn)營(yíng)活動(dòng)是使用百度錢包支付每單會(huì)便宜幾毛錢，所以我綁定了我的信用卡。

關(guān)于什么飯卡聯(lián)名卡之類的我就不細(xì)說了沒什么意思，這里想起了一個(gè)百度外賣有意思的功能，大概在兩年前，百度外賣還在推廣的時(shí)候出了一個(gè)叫mvp的東西，一年大概是一百多塊錢，買了以后全年不收配送費(fèi)，后來可能由于辦的人太多導(dǎo)致賠的太厲害所以關(guān)掉了mvp這個(gè)功能入口，那已經(jīng)購(gòu)買mvp的人怎么辦呢？就多出了一個(gè)我的mvp的入口，到了一年之后所有人mvp消失了百度外賣就關(guān)掉了這個(gè)功能，假裝這一年什么事情都沒發(fā)生（2333……）。

總結(jié)

分析一款移動(dòng)端產(chǎn)品的時(shí)候，一定要細(xì)心、耐心和敏銳。

好的設(shè)計(jì)師永遠(yuǎn)是解決問題的。

我們只需要看這些信息架構(gòu)如何被這款app呈現(xiàn)，呈現(xiàn)方式是否優(yōu)雅，是否有一些看似奇怪而矛盾的點(diǎn)，并嘗試自我分析是什么導(dǎo)致了這些矛盾點(diǎn)的發(fā)生，保證自己在產(chǎn)品設(shè)計(jì)過程中由得借鑒就行了。

希望這次的文章能夠?yàn)閺V大UI設(shè)計(jì)師們提供一種分析app的思路。

本文由 @Seany?原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。