產(chǎn)品需求文檔（PRD），是一個(gè)產(chǎn)品項(xiàng)目由“概念化”階段進(jìn)入到“圖紙化”階段的最主要的一個(gè)文檔，其作用是“對市場需求文檔（MRD）中的內(nèi)容進(jìn)行指標(biāo)化和技術(shù)化”，文檔的質(zhì)量好壞直接影響到研發(fā)部門是否能夠明確產(chǎn)品的功能與性能。

下面筆者將以C端用戶的身份通過使用、體驗(yàn)和分析等方式倒推“餓了么”App，生成它的產(chǎn)品需求文檔。然而，由于“餓了么”產(chǎn)品功能框架實(shí)在龐大，信息流分支眾多且界面繁雜，筆者將這份文檔的撰寫重心放在“餓了么”最主要的流量入口處——首頁（外賣頁），其余界面會在以后逐一補(bǔ)充。

文檔目錄：

一、文檔綜述

1.1版本修訂記錄

1.2PRD輸出環(huán)境

1.3產(chǎn)品介紹

二、產(chǎn)品結(jié)構(gòu)

2.1產(chǎn)品功能結(jié)構(gòu)圖

2.2產(chǎn)品信息結(jié)構(gòu)圖

三、全局說明

3.1功能權(quán)限

3.2鍵盤說明

3.3頁面內(nèi)交互

3.4頁面異常

3.5頁面間切換交互方式

3.6更多操作

四、用戶操作主流程(外賣頁)

五、頁面邏輯(用戶訂購商品主邏輯)

六、頁面詳細(xì)功能說明

6.1啟動頁

6.2登陸/注冊頁

6.3首頁（外賣頁）

6.4商家頁面

6.5訂單的支付與評價(jià)頁面

七、測試異常頁面及突發(fā)狀況

7.1網(wǎng)絡(luò)異常

7.2登錄異常

7.3數(shù)據(jù)丟失

八、總結(jié)

一、文檔綜述

1.1 版本修訂記錄

1.2 PRD輸出環(huán)境

1.3 產(chǎn)品介紹

“餓了么”于2009年4月上線，是一款在線外賣訂餐服務(wù)平臺。為中國廣泛地區(qū)的用戶提供豐富多樣、簡單快捷的在線訂餐服務(wù)；為不同類型的餐飲商戶提供基于互聯(lián)網(wǎng)技術(shù)的一體化運(yùn)營解決方案。

“餓了么”移動端App，滿足用戶在手機(jī)端使用產(chǎn)品時(shí)的基本功能主要包括用戶在線訂購?fù)赓u、商家入駐、配送服務(wù)、城市服務(wù)代理等。

二、產(chǎn)品結(jié)構(gòu)

2.1 產(chǎn)品功能結(jié)構(gòu)圖

（右擊，在新標(biāo)簽頁中打開即可查看大圖）

2.2 產(chǎn)品信息結(jié)構(gòu)圖

“餓了么”App的信息架構(gòu)異常復(fù)雜，這對于平時(shí)基本只會用到點(diǎn)餐訂外賣的我來說是沒有想到的。一個(gè)主要針對在線訂餐服務(wù)的產(chǎn)品承載了如此多的內(nèi)容，并產(chǎn)生了如此多的流量入口，可留存率容易降低且流量加工能力需要很強(qiáng)。

三、全局說明

3.1 功能權(quán)限

（1）分為登陸狀態(tài)和未登陸狀態(tài)

（2）登錄狀態(tài)可進(jìn)行App內(nèi)所有操作

（3）未登錄狀態(tài)下

• 僅可以瀏覽頁面，如商家信息、商品信息等；
• 無法進(jìn)行商品預(yù)訂、訂單結(jié)算和商家收藏；
• 無法進(jìn)入金幣商城、推薦有獎、周邊優(yōu)惠、免費(fèi)流量以及官方活動等界面；
• 無法查詢訂單和早餐預(yù)訂等。

3.2 鍵盤說明

（1）點(diǎn)擊（手機(jī)號與驗(yàn)證碼）輸入框時(shí)頁面底部彈出數(shù)字鍵盤；

（2）點(diǎn)擊其他輸入框頁面底部彈出字母全鍵盤。

3.3頁面內(nèi)交互

（1）頂部和底部彈窗
（2）Toast、Dialog、Alert彈窗

3.4 頁面異常

3.5 頁面間切換交互方式

在當(dāng)前頁面左邊緣處用右劃手勢快速返回之前頁面。

3.6更多操作

四、用戶操作主流程（外賣頁）

從用戶操作的主流程可以看出，“餓了么”App并不像其他一些App特別注重用戶的注冊引導(dǎo)性，只有在用戶需要修改/添加“收貨地址”和“提交訂單”時(shí)才會判斷用戶是否已登錄，這和“餓了么”的主要業(yè)務(wù)和功能需求有關(guān)，用戶在未登錄的狀態(tài)下依然可以先查看商品的內(nèi)容信息，并在對個(gè)人喜好或者偏愛的商品下訂單作出決定時(shí)，再適時(shí)提醒用戶是否登錄，這看似遲緩的引導(dǎo)反而在一定的程度上增強(qiáng)了用戶的粘性。

五、頁面邏輯（用戶訂購商品主邏輯）

六、頁面詳細(xì)功能說明

6.1 啟動頁

啟動頁前置條件為是否已連接網(wǎng)絡(luò)，分為以下兩種情況：

1、已連接網(wǎng)絡(luò)

頁面邏輯：

• 在已連接網(wǎng)絡(luò)情況下，啟動餓了么App后，進(jìn)入引導(dǎo)頁；
• 引導(dǎo)頁等待1秒后進(jìn)入廣告頁；
• 對廣告頁不進(jìn)行任何操作等待3秒，或點(diǎn)擊頁面右上方“跳過”按鈕，進(jìn)入App首頁（外賣頁）；
• 點(diǎn)擊廣告頁面圖片，彈出廣告內(nèi)容。

2、未連接網(wǎng)絡(luò)

在未連接網(wǎng)絡(luò)情況下，啟動App后直接進(jìn)入網(wǎng)絡(luò)異常提示頁面，并提示用戶重新加載。

思考：此處餓了么App并沒有使用其他彈窗來引導(dǎo)用戶如何檢查或設(shè)置網(wǎng)絡(luò)及網(wǎng)絡(luò)路徑，僅有的網(wǎng)絡(luò)異常提示和重新加載按鈕個(gè)人感覺從體驗(yàn)上不能有效的幫助用戶解決網(wǎng)絡(luò)問題。

6.2 登陸/注冊頁

“餓了么”App的登陸方式采用手機(jī)號碼與驗(yàn)證碼、密碼登錄及第三方登錄（調(diào)用第三方授權(quán)接口登陸）相結(jié)合的方式，最大的便捷之處是省去了注冊的流程，用戶個(gè)人手機(jī)號碼即賬戶名，而通過手機(jī)號碼和驗(yàn)證碼驗(yàn)證登錄及第三方登陸的過程就替代了相對繁瑣的注冊流程。用戶在登陸以后可以再設(shè)置個(gè)人登錄密碼，同時(shí)熟悉用戶的個(gè)人頁面。

1、登陸/注冊頁面

頁面邏輯內(nèi)容：

• 用戶輸入手機(jī)號碼，點(diǎn)擊“獲取驗(yàn)證碼”按鈕，“獲取驗(yàn)證碼”按鈕內(nèi)容變?yōu)椤耙寻l(fā)送”，并倒計(jì)時(shí)30秒，30秒后“已發(fā)送”按鈕內(nèi)容變?yōu)椤爸匦芦@取”；
• 用戶收到驗(yàn)證碼并在5分鐘內(nèi)輸入即可登陸，超過5分鐘驗(yàn)證碼失效需要重新獲??；
• 若用戶在30秒內(nèi)未收到手機(jī)驗(yàn)證碼，點(diǎn)擊“重新獲取”按鈕嘗試重新獲取驗(yàn)證碼；
• 老用戶可使用手機(jī)號碼和登錄密碼進(jìn)行登陸；
• 用戶亦可點(diǎn)擊第三方登錄下的四個(gè)按鈕，調(diào)出其授權(quán)接口進(jìn)行登陸操作。

頁面交互說明：

• 用戶點(diǎn)擊手機(jī)號及驗(yàn)證文本框，數(shù)字鍵盤從底部彈出；
• 用戶點(diǎn)擊獲取驗(yàn)證碼按鈕，按鈕顏色變?yōu)榛疑?，文本變?yōu)椤耙寻l(fā)送”并伴有30秒倒計(jì)時(shí)，30秒過后按鈕文本變?yōu)椤爸匦芦@取”；
• 用戶點(diǎn)擊右上角“密碼登錄”，密碼登錄頁面從頁面右側(cè)彈出，同時(shí)字母全鍵盤從底部彈出，在輸入密碼時(shí)，可以點(diǎn)擊右側(cè)圖標(biāo)設(shè)置是否顯示密碼；
• 用戶點(diǎn)擊第三方登陸下的四個(gè)按鈕，相應(yīng)的第三方授權(quán)頁面從頁面右側(cè)彈出。

2、登陸/注冊功能邏輯流程

6.3 首頁（外賣頁）

由于筆者繪制的App原型圖完全參照個(gè)人手機(jī)屏幕的實(shí)際尺寸即（375px*677px），所以這里將首頁（外賣頁）分為上、中、下三個(gè)部分，并對相應(yīng)的功能和操作進(jìn)行逐一說明。

6.3.1 外賣頁-上

（1）頁面名稱：外賣頁-上

（2）頁面入口：“餓了么”App首頁

（3）頁面結(jié)構(gòu)

1. 用戶位置定位
2. 用戶位置天氣
3. 商家、商品搜索框
4. 食品標(biāo)簽欄
5. 商品分類標(biāo)簽區(qū)，共十五類
6. 活動/廣告Banner，七例活動/廣告頁輪播
7. 商品分類專題區(qū)，共五類
8. 購物車，對添加進(jìn)購物車的商品集中結(jié)算、刪除等。

（4）邏輯內(nèi)容詳細(xì)說明

①?用戶位置定位：系統(tǒng)默認(rèn)情況GPS自動定位并顯示用戶所在位置，點(diǎn)擊后頁面轉(zhuǎn)至選擇收貨地址頁面。

頁面邏輯內(nèi)容：

在選擇收貨地址頁面，用戶點(diǎn)擊“請輸入地址”文本框輸入新地址、或點(diǎn)擊頁面中已保存的其他收貨地址、抑或點(diǎn)擊頁面右上方的新增地址并且編輯確定后，選擇收貨地址頁面轉(zhuǎn)回至外賣頁，用戶位置定位變更為當(dāng)前已修改的新地址。

頁面交互說明：

• “外賣”頁面下點(diǎn)擊用戶位置定位，選擇收貨地址頁面從底部彈出；
• “選擇收貨地址”頁面下點(diǎn)擊“請輸入地址”文本框，字母全鍵盤從底部彈出，當(dāng)前地址、收貨地址和附近地址等頁面內(nèi)容隱藏；
• “選擇收貨地址”頁面下點(diǎn)擊新增地址，新增地址頁面從右側(cè)彈出，點(diǎn)擊相應(yīng)文本框輸入內(nèi)容時(shí)字母全鍵盤會從底部彈出，點(diǎn)擊地址文本框，右側(cè)彈出確認(rèn)收貨地址頁面；
• 文本框在輸入文本后，原文本框提示內(nèi)容消失。

②用戶位置天氣，系統(tǒng)根據(jù)用戶所在位置實(shí)時(shí)的展示當(dāng)前位置的天氣情況。

③商家、商品搜索框：點(diǎn)擊搜索框后頁面跳轉(zhuǎn)至商家、商品搜索頁面。

頁面邏輯內(nèi)容：

• 搜索頁面結(jié)構(gòu)分為文本搜索框、歷史搜索及熱門搜索三部分內(nèi)容；
• 用戶輸入商家、商品名稱等內(nèi)容進(jìn)行搜索（支持內(nèi)容模糊搜索），搜索完成后頁面轉(zhuǎn)至搜索的商家、商品推薦頁；
• 系統(tǒng)對已搜索過的內(nèi)容自動標(biāo)簽化添加到歷史搜索內(nèi)容（歷史搜索規(guī)則描述：按搜索的時(shí)間倒序排列，排列方式從左至右、從上至下排列，可展示四排內(nèi)容，可點(diǎn)擊垃圾桶圖標(biāo)清除所有歷史搜索內(nèi)容，也可長按相應(yīng)的搜索標(biāo)簽進(jìn)行刪除，標(biāo)簽字?jǐn)?shù)長度限制為十字符，超出部分用“…”代替。）；
• 熱門搜索內(nèi)容是系統(tǒng)為用戶推薦的商家、商品及活動標(biāo)簽，點(diǎn)擊相應(yīng)標(biāo)簽，進(jìn)入相應(yīng)商家、商品及活動推薦頁。

• 商家、商品推薦頁面結(jié)構(gòu)為搜索框、篩選排序欄、與搜索內(nèi)容相關(guān)的標(biāo)簽欄和推薦商家列表；
• 在商家、商品推薦頁面上，與搜索內(nèi)容相關(guān)的文本都被加粗加亮顯示，如“漢堡”；
• 篩選排序欄分為綜合排序下拉列表、按銷量最高排序、按距離最近排序及篩選；綜合排序下拉列表包括好評優(yōu)先、起送價(jià)最低、配送最快等選項(xiàng)；篩選則按照配送方式（蜂鳥專送）、優(yōu)惠活動（新用戶、特價(jià)商品、下單立減、贈品優(yōu)惠、下單返券、進(jìn)店領(lǐng)券）、人均消費(fèi)（20以下、20-40、40以上）等三方面進(jìn)行篩選排序；
• 標(biāo)簽欄是可與搜索內(nèi)容相關(guān)的可組合內(nèi)容，如“漢堡”+“蜂鳥專送”、“漢堡”+“炸雞”，通過點(diǎn)擊各個(gè)標(biāo)簽，商家列表將把包含搜索內(nèi)容+標(biāo)簽內(nèi)容的商家羅列出來；
• 在商家列表內(nèi)點(diǎn)擊相應(yīng)商家區(qū)域進(jìn)入相應(yīng)商家頁面。

頁面交互說明：

• “外賣”頁面下點(diǎn)擊商家、商品搜索框，商家、商品搜索頁面淡入，外賣頁淡出，字母全鍵盤從底部彈出；
• 在輸入文本后，文本框提示內(nèi)容 消失；
• 通過搜索商家和商品內(nèi)容、點(diǎn)擊歷史搜索標(biāo)簽及熱門搜索標(biāo)簽，商家、商品及活動推薦頁面從右側(cè)彈出；
• 點(diǎn)擊綜合排序或篩選，從“篩選排序欄”處彈出下拉列表，原商家、商品推薦頁面變暗；再次點(diǎn)擊綜合排序和篩選，下拉列表收回，商家、商品推薦頁面恢復(fù)；
• 標(biāo)簽欄可點(diǎn)擊選擇，也可以通過左右滑動的手勢查看后面的標(biāo)簽，并點(diǎn)擊不同的標(biāo)簽內(nèi)容；
• 單次點(diǎn)擊不同的標(biāo)簽，商家列表刷新且加入不同的標(biāo)簽內(nèi)容，重復(fù)點(diǎn)擊同一標(biāo)簽，刪除之前添加的標(biāo)簽內(nèi)容；
• 商家列表可上下滑動，顯示更多信息，滑動時(shí)上、下部均有邊界，上部為阻尼拖拽，下部會在邊界處更新內(nèi)容。

④食品標(biāo)簽欄：點(diǎn)擊相應(yīng)的食品標(biāo)簽進(jìn)入相應(yīng)的食品內(nèi)容搜索頁面（與“商家、商品搜索框搜索到的商家、商品推薦頁一致”），同時(shí)向下拉動“外賣”頁面可以更新食品標(biāo)簽欄的內(nèi)容，食品標(biāo)簽欄最多展示七個(gè)食品標(biāo)簽。

⑤商品分類標(biāo)簽區(qū)：共十五類，點(diǎn)擊相應(yīng)的商品分類標(biāo)簽，進(jìn)入相應(yīng)的商品推薦頁面。由于標(biāo)簽區(qū)十五類商品分類的頁面結(jié)構(gòu)和內(nèi)容極其相似，筆者暫時(shí)優(yōu)先選擇對“美食”類標(biāo)簽做分析和說明，其余十四類會在以后逐一補(bǔ)充。

頁面邏輯內(nèi)容：

• “美食”頁面結(jié)構(gòu)分為標(biāo)題欄（包括美食標(biāo)題、商家和商品搜索按鈕和返回按鈕），美食標(biāo)簽欄，美食標(biāo)簽區(qū)和與美食標(biāo)簽相對應(yīng)的商家推薦列表四部分。
• 點(diǎn)擊標(biāo)題欄中的搜索按鈕轉(zhuǎn)至商家、商品搜索頁；
• 點(diǎn)擊美食標(biāo)簽或在頁面內(nèi)左右滑動“美食”頁面，美食標(biāo)簽區(qū)和商家推薦列表的內(nèi)容相應(yīng)刷新并改變；
• 點(diǎn)擊美食標(biāo)簽欄的下拉按鈕，展開商品分類標(biāo)簽區(qū)列表；
• 點(diǎn)擊美食標(biāo)簽區(qū)進(jìn)入美食標(biāo)簽區(qū)頁面，如“熱賣套餐”頁面；
• 商家推薦列表包括篩選排序欄和商家列表，點(diǎn)擊商家區(qū)域會進(jìn)入相應(yīng)的商家頁面。

頁面交互說明：

• “外賣”頁面下點(diǎn)擊商品分類標(biāo)簽區(qū)標(biāo)簽，如“美食”，“美食”頁面從右側(cè)彈出；
• “美食”頁面下點(diǎn)擊搜索按鈕，商家、商品搜索頁面淡入，“美食”頁面淡出，字母全鍵盤從底部彈出；
• “美食”頁面下點(diǎn)擊美食標(biāo)簽欄下拉按鈕，“美食”頁面變暗，從“美食”標(biāo)題欄處向下彈出商品分類標(biāo)簽區(qū)列表，下拉按鈕方向向上，再次點(diǎn)擊下拉按鈕或者點(diǎn)擊空白區(qū)域，商品分類標(biāo)簽區(qū)列表收回，“美食”頁面恢復(fù)，下拉按鈕方向恢復(fù)默認(rèn)；
• 在“美食”頁面非邊緣區(qū)域左右滑動，美食標(biāo)簽跟隨頁面滑動，效果與點(diǎn)擊標(biāo)簽相同，美食標(biāo)簽區(qū)和商家推薦列表內(nèi)容相應(yīng)更新并改變；
• 商家列表可上下滑動，顯示更多信息，滑動時(shí)上部有邊界，下部會不斷更新。

⑥活動/廣告Banner：七例活動/廣告頁輪播，點(diǎn)擊后頁面轉(zhuǎn)到相應(yīng)活動/廣告頁面；

頁面交互說明：點(diǎn)擊活動/廣告Banner區(qū)域，活動/廣告頁面從右側(cè)彈出。

⑦商品分類專題區(qū)：共五類，包括“限量搶購”、“熱賣套餐”、“吃貨狂歡節(jié)”以及兩個(gè)根據(jù)每天和時(shí)段細(xì)分的不同分類專題，點(diǎn)擊后進(jìn)入相應(yīng)分類專題頁面，同樣由于商品分類專題區(qū)的五類專題從頁面結(jié)構(gòu)和內(nèi)容上極其相似，筆者優(yōu)先選擇其中的“限量搶購”專題進(jìn)行分析和說明，剩余的四類在以后逐一補(bǔ)充。

頁面邏輯內(nèi)容：

• 限時(shí)搶購頁面的頁面結(jié)構(gòu)分為標(biāo)題欄、標(biāo)簽欄和商品推薦列表，其中標(biāo)簽欄包含早餐、下午茶、正餐、夜宵和水果零食五個(gè)細(xì)分，不同的標(biāo)簽對應(yīng)著相應(yīng)的商品推薦列表；
• 用戶可以根據(jù)餐時(shí)及自身的需要選擇相應(yīng)的細(xì)分標(biāo)簽，并在細(xì)分標(biāo)簽下的商品推薦列表中挑選商品；
• 在商品推薦列表中點(diǎn)擊商品所在區(qū)域，頁面轉(zhuǎn)至該商品所在的商家頁面，同時(shí)點(diǎn)擊的商品會自動加入已選商品列表等待用戶結(jié)算。

頁面交互說明：

• 在“限時(shí)搶購”頁面下，點(diǎn)擊不同的標(biāo)簽，標(biāo)簽的底紋顏色會發(fā)生相應(yīng)的變化，如早餐（綠色漸變）、下午茶（橙色漸變）、正餐（藍(lán)色漸變）、夜宵（深藍(lán)色漸變）、水果零食（紫色漸變）；
• 商品列表可上下滑動，顯示更多信息，滑動時(shí)上、下部均有邊界，上部為阻尼拖拽，下部會在邊界處更新內(nèi)容；
• 在商品推薦列表中點(diǎn)擊商品所在區(qū)域，商品所屬的商家界面會從“限時(shí)搶購”頁面右側(cè)彈出。

⑧ 購物車：用戶可以對添加進(jìn)購物車的商品進(jìn)行結(jié)算、刪除等。

頁面邏輯內(nèi)容：

• “購物車”頁面主要分為兩部分，等待結(jié)算的商品訂單、起送價(jià)不足的商品訂單（商品價(jià)格低于商家配送的金額標(biāo)準(zhǔn)）和失效商家（商品所屬商家休息）；
• 用戶在對商品未進(jìn)行結(jié)算之前，所有曾點(diǎn)擊添加過的商品都會進(jìn)入“購物車”等待結(jié)算；
• 在“購物車”中可能會有多種商品等待結(jié)算，用戶可以刪除不需要的商品亦可以對相應(yīng)的商品進(jìn)行結(jié)算支付；
• 在結(jié)算支付過程中可以選擇更改收貨地址，使用紅包或代金券等；

頁面交互說明：

• 用戶在“外賣頁”未有任何操作2秒時(shí)，購物車按鈕從頁面底部右側(cè)彈出，當(dāng)進(jìn)行滑動頁面或者任何操作時(shí)，購物車按鈕彈回右側(cè)；
• 用戶點(diǎn)擊購物車按鈕，“購物車”頁面從頁面右側(cè)彈出；
• 用戶在“購物車”頁面點(diǎn)擊垃圾桶圖標(biāo)，彈出Toast提示是否確認(rèn)刪除該商家的所有商品；
• 用戶在“購物車”頁面點(diǎn)擊“去結(jié)算”按鈕，支付頁面從右側(cè)彈出，且在“支付”頁面下點(diǎn)擊當(dāng)前收貨地址，可修改并重新選擇收貨地址，選擇收貨地址頁面從右側(cè)彈出；
• 在“支付”頁面點(diǎn)擊“免密支付”，“下單成功”頁面從右側(cè)彈出。

6.3.2 外賣頁-中

（1）頁面名稱：外賣頁-中

（2）頁面入口：“餓了么”App首頁

（3）頁面結(jié)構(gòu)

1. 商家、商品搜索框
2. 商品分類專題區(qū)，共五類
3. 官方推薦精品商家
4. 品質(zhì)優(yōu)選區(qū),大牌精選商家
5. 購物車
6. 推薦商家列表

（4）邏輯內(nèi)容詳細(xì)說明

由于上述頁面結(jié)構(gòu)中①、②、⑤部分在“外賣頁-上”中已作出過說明，不再贅述，接下來對③、④、⑥部分進(jìn)行說明。

③官方推薦精品商家：每天系統(tǒng)都會對該區(qū)內(nèi)容作出更新調(diào)整，用戶點(diǎn)擊官方推薦精品商家區(qū)域后頁面轉(zhuǎn)至精品商家頁面。

頁面邏輯內(nèi)容：

• 官方推薦精品商家區(qū)域類似一個(gè)廣告鏈接，用戶點(diǎn)擊過后轉(zhuǎn)至商家頁面；
• 結(jié)構(gòu)布局主要由商家主打商品圖片、特價(jià)商品信息和促銷活動信息構(gòu)成。

頁面交互說明：

• 在“外賣”頁下點(diǎn)擊官方推薦精品商家區(qū)域，商家頁面從“外賣頁”右側(cè)彈出。

④品質(zhì)優(yōu)選區(qū)，大牌商家：用戶點(diǎn)擊該區(qū)域頁面轉(zhuǎn)至品質(zhì)優(yōu)選頁面。

頁面邏輯內(nèi)容：

• “外賣”頁下的品質(zhì)優(yōu)選區(qū)域由標(biāo)題（品質(zhì)優(yōu)選）和商家推薦表組成，商家推薦表由單行四列的商家（商家圖片+商家名稱+“大牌精選”標(biāo)注）構(gòu)成，商家名稱最多顯示五個(gè)字符，如名稱超過五個(gè)字符，第五個(gè)字符由“…”代替，如“深圳麥當(dāng)…（深圳麥當(dāng)勞）”；
• 品質(zhì)優(yōu)選頁面結(jié)構(gòu)由標(biāo)題欄（即品質(zhì)優(yōu)選）和推薦商家列表組成；
• 推薦商家列表內(nèi)羅列的商家都是規(guī)模較大的品牌商家，每個(gè)商家下方都放置“大牌精選”的標(biāo)注；
• 在商家列表中點(diǎn)擊商家區(qū)域進(jìn)入相應(yīng)的商家頁面；
• 由于沒有篩選排序欄，在品質(zhì)優(yōu)選頁面無法對商家列表進(jìn)行排序，因而其排列規(guī)則筆者暫時(shí)還無從知曉。

頁面交互說明：

• 在“外賣”頁下點(diǎn)擊品質(zhì)優(yōu)選區(qū)域，品質(zhì)優(yōu)選頁面從“外賣”頁右側(cè)彈出；
• 在“品質(zhì)優(yōu)選”頁下點(diǎn)擊推薦商家列表內(nèi)的相應(yīng)商家區(qū)域，商家頁面從“品質(zhì)優(yōu)選”頁右側(cè)彈出；
• 商家列表可上下滑動，顯示更多信息，滑動時(shí)上、下部均有邊界，上部為阻尼拖拽，下部會在邊界處更新內(nèi)容。

⑥推薦商家列表：由于推薦商家列表的主要內(nèi)容在“外賣頁-下”中，所以其說明也放在“外賣頁-下”中進(jìn)行。

6.3.3 外賣頁-下

（1）頁面名稱：外賣頁-下

（2）頁面入口：“餓了么”App首頁

（3）頁面結(jié)構(gòu)

1. 商家、商品搜索框
2. 商家推薦列表
3. 購物車

（4）邏輯內(nèi)容詳細(xì)說明

由于上述頁面結(jié)構(gòu)中①、③部分在“外賣頁-上”中已作出過說明，不再贅述，接下來對②部分進(jìn)行主要說明。

②商家推薦列表，羅列了餓了么App內(nèi)所有的商家，包括普通商家、品牌商家和新入駐商家，用戶點(diǎn)擊相應(yīng)的商家區(qū)域便進(jìn)入到相應(yīng)的商家頁面，并在商家頁面下挑選商品進(jìn)行預(yù)訂和結(jié)算。

頁面邏輯內(nèi)容：

• 商家推薦列表中的商家信息由商家圖片、名稱、星級評分、月售訂單數(shù)、起送價(jià)格、配送方式、配送費(fèi)、配送時(shí)間、商家距離、商家促銷活動以及商家保障等構(gòu)成；·
• 每一個(gè)商家的促銷活動信息最多顯示兩條，可通過點(diǎn)擊促銷活動下拉菜單查看所有的促銷活動；
• 點(diǎn)擊相應(yīng)的商家區(qū)域轉(zhuǎn)至相應(yīng)的商家頁面；
• 商家推薦列表中沒有篩選排序欄，因而商家列表的牌序規(guī)則筆者暫時(shí)無從知曉。

頁面交互說明：

• 在“外賣”頁的商家推薦列表下點(diǎn)擊商家區(qū)域，商家頁面從“外賣”頁右側(cè)彈出；
• 推薦商家列表可上下滑動，顯示更多信息，滑動時(shí)上、下部均有邊界，上部為阻尼拖拽，下部會在邊界處更新商家列表內(nèi)容。

6.3.4 外賣頁小結(jié)

縱觀整個(gè)外賣頁的功能與結(jié)構(gòu)，大體可以分為三大類功能模塊即“搜索模塊（搜索框）”、“分類模塊（分類標(biāo)簽/分類專題）”與“推薦模塊（推薦列表）”等?！梆I了么”App用這三大模塊功能對不同用戶的不同需求提供相應(yīng)的解決方案，然而看似三種甚至更多的用戶需求入口，最終都會集中到同一出口即“具體的商家頁面”，進(jìn)而結(jié)算商品訂單直至最終的交易完成，功能邏輯如下。

由此可見，“商家頁面”是“外賣”頁中最為主要且唯一的流量出口頁面，也正因如此，“餓了么”App才會選擇在這里來引導(dǎo)用戶登陸/注冊，而不是在App初次打開的首頁面便引導(dǎo)用戶。那么接下來筆者就對從商家頁面直至最后的交易完成整個(gè)流程進(jìn)行逐一說明。

6.4 商家頁面

筆者通過自身的體驗(yàn)，隨機(jī)選擇一個(gè)商家為例（漢克斯炸雞漢堡）。

（1）頁面名稱：商家頁面

（2）頁面結(jié)構(gòu)：

1. 商家頁面更多操作
2. 商家標(biāo)題欄
3. 商家促銷活動欄
4. 商品/評價(jià)欄
5. 商品結(jié)算欄

（3）邏輯內(nèi)容詳細(xì)說明

①?商家頁面更多操作

包含多人訂餐、進(jìn)入購物車以及更多操作按鈕（“…”）。其中更多操作按鈕在點(diǎn)擊后彈出下拉列表菜單，菜單內(nèi)容包括店內(nèi)搜索、多人訂餐、分享商家、商家詳情頁和收藏商家等功能，點(diǎn)擊相應(yīng)子菜單進(jìn)入相應(yīng)的功能頁面。

②?商家標(biāo)題欄

顯示商家名稱、商家公告等信息，點(diǎn)擊此區(qū)域頁面轉(zhuǎn)至商家詳情頁。商家詳情頁展示商家名稱、評分、月售訂單量、商家公告、商家圖片、商家配送信息、商家促銷活動與服務(wù)、商家評價(jià)、商家信息（商家品類、商家電話、地址、營業(yè)時(shí)間）及商家營業(yè)資質(zhì)等內(nèi)容。用戶可以在商家詳情頁內(nèi)查看該商家評價(jià)內(nèi)容，聯(lián)系商家（商家電話），查看商家的營業(yè)資質(zhì)或舉報(bào)商家等。

③?商家促銷欄

展示商家的促銷信息，單次點(diǎn)擊右側(cè)的“7個(gè)活動”區(qū)域（下拉列表）展開，再次點(diǎn)擊下拉列表收回，默認(rèn)情況只展示一條促銷活動，在促銷欄展開時(shí)，商品/評論欄及下方的商品內(nèi)容自動下移，同時(shí)促銷活動的角標(biāo)垂直翻轉(zhuǎn)。

④?商品/評價(jià)欄

展示商品類型（如熱銷、優(yōu)惠、新品上市等）及相應(yīng)類型商品列表和用戶對商家商品的評價(jià)內(nèi)容。默認(rèn)情況下為“商品”頁面，展示的是商品類型內(nèi)容，且“商品”字段下方注有下劃線，“商品字段”和“下劃線”顏色一致，當(dāng)用戶點(diǎn)擊評價(jià)或者在頁面中左劃手勢操作時(shí)，“商品頁面”轉(zhuǎn)至評價(jià)頁面（從右側(cè)彈出）且“商品”字段下方下劃線動態(tài)滑落至“評價(jià)”字段下方，再次點(diǎn)擊“商品”或在頁面中右劃手勢操作返回商品頁面。

商品頁面包含內(nèi)容：商品類型標(biāo)簽、代金券領(lǐng)取和商品列表。點(diǎn)擊代金券處“去領(lǐng)取”按鈕即領(lǐng)取了商家的代金券，在商品列表中對相應(yīng)商品點(diǎn)擊“+”按鈕，即將商品添加到結(jié)算欄中，同時(shí)該商品所屬的商品類型標(biāo)簽及結(jié)算欄圖標(biāo)的右上角相應(yīng)增加角標(biāo)如“1”、“2”等，具體角標(biāo)數(shù)字視添加的商品數(shù)量而定。

評價(jià)頁面包含商家的綜合評分信息與用戶評價(jià)內(nèi)容兩部分。在綜合評分信息欄中用戶可以看到商家的服務(wù)態(tài)度、商品評分及商品的送達(dá)時(shí)間，數(shù)據(jù)都來自于用戶的匯總評價(jià)。用戶評價(jià)內(nèi)容分三欄，上方為查看評價(jià)內(nèi)容的標(biāo)簽欄（全部、滿意、不滿意、有圖、味道好、送貨慢等），標(biāo)簽中的數(shù)字代表該標(biāo)簽下的評價(jià)總數(shù)量，中間為提醒用戶是否選擇查看有內(nèi)容的評論，下方則是具體用戶的評價(jià)內(nèi)容及評價(jià)時(shí)間?！梆I了么”的評價(jià)系統(tǒng)均采用匿名評價(jià)的方式，評價(jià)內(nèi)容包括用戶對商家服務(wù)、商品、送達(dá)時(shí)間以及具體的評價(jià)內(nèi)容等四方面。

⑤?商品結(jié)算欄

用于用戶對已挑選的商品進(jìn)行結(jié)算并且與購物車相關(guān)聯(lián)。用戶在商品列表中對滿意的商品點(diǎn)擊“+”按鈕時(shí)，會有模擬商品從“+”按鈕處以拋物線形式動態(tài)掉落至結(jié)算欄圖標(biāo)處，同時(shí)“+”按鈕向左彈出“-”按鈕，此時(shí)用戶點(diǎn)擊“+”、“-”按鈕，即相應(yīng)增減結(jié)算欄中的商品數(shù)量。用戶點(diǎn)擊商品結(jié)算欄區(qū)域會從結(jié)算欄處向上彈出結(jié)算列表，用戶可以對已選的商品進(jìn)行增減數(shù)量及清空等操作，在結(jié)算列表彈出的時(shí)候，商家頁面同時(shí)變暗。點(diǎn)擊“去結(jié)算”按鈕后，頁面轉(zhuǎn)至訂單預(yù)支付頁面。

6.5 訂單的支付與評價(jià)頁面

在訂單預(yù)支付頁面，用戶可以查看并修改個(gè)人的收貨地址，同時(shí)查看訂單預(yù)計(jì)送達(dá)時(shí)間和訂單詳情（包括商家、商品內(nèi)容）。根據(jù)用戶的口味偏好及用餐人數(shù)，用戶可以設(shè)置備注填寫個(gè)人口味及餐具數(shù)量。在用戶支付訂單之前，還可以查看是否有紅包和代金券可用，并選擇相應(yīng)的在線支付方式及是否需要商家開具發(fā)票。目前餓了么支持四種在線支付方式，包括支付寶免密支付、花唄、銀行卡網(wǎng)銀支付、QQ錢包支付等。筆者常用的支付方式是支付寶免密支付，這種支付方式快捷便利，在確定了收貨地址、訂單內(nèi)容與商品金額后，點(diǎn)擊“免密支付”按鈕頁面隨即轉(zhuǎn)至下單成功頁面，然后點(diǎn)擊“完成”按鈕就可以靜靜地等待商品送貨上門了，同時(shí)在下單成功頁面用戶還可以在頁面下方查看和自己口味、興趣相當(dāng)?shù)钠渌脩舳伎戳四男┥唐?，逛了哪些商家?/p>

在用戶下單支付后，系統(tǒng)會給用戶派發(fā)分享紅包及優(yōu)惠代金券禮包，紅包可以轉(zhuǎn)發(fā)分享給好友，類似微信紅包，隨機(jī)領(lǐng)取相應(yīng)的紅包金額，而代金券禮包則是用戶自己領(lǐng)取，也是隨機(jī)金額。同時(shí)在等待訂單的過程中，用戶會接到“商家接單”及“配送員出發(fā)配送”的實(shí)時(shí)提醒，彈窗從頁面頂部彈出。此外用戶在訂單完成頁面點(diǎn)擊右上角的完成按鈕之后，頁面轉(zhuǎn)至等待送達(dá)的頁面。

在等待送達(dá)頁面用戶可通過上下劃手勢操作查看訂單預(yù)送達(dá)時(shí)間（由動態(tài)環(huán)形進(jìn)度條顯示，隨著時(shí)間的推移，環(huán)形進(jìn)度條逐漸減短），訂單信息（包括配送信息和訂單信息）等內(nèi)容；用戶可根據(jù)自身需要進(jìn)行“取消訂單、聯(lián)系賣家、催促賣家盡快發(fā)貨（催單）”等操作，在頁面的最下方也可以瀏覽其他商品信息。而當(dāng)用戶存在任何與訂單相關(guān)的問題時(shí)都可以點(diǎn)擊頁面右上方的耳麥圖標(biāo)，與“餓了么”App客服聯(lián)系。

當(dāng)用戶收到商品后可點(diǎn)擊確認(rèn)送達(dá)按鈕，或不進(jìn)行操作，由賣家提交商品已送至用戶收貨地址處。此時(shí)頁面轉(zhuǎn)至訂單完成頁面，用戶可申請售后或者評價(jià)訂單。

評價(jià)頁面分為三部分：商品評價(jià)、商家服務(wù)評價(jià)及配送服務(wù)評價(jià)。三部分評價(jià)內(nèi)容除了商品評價(jià)內(nèi)可添加商品圖片外基本相同，都包括表情、標(biāo)簽和文字內(nèi)容。其中表情分為三類即代表“不滿意、基本滿意和很滿意”，默認(rèn)表情為第二種基本滿意；標(biāo)簽基本涵蓋了用戶對評價(jià)對象表示基本滿意的各項(xiàng)內(nèi)容；如果用戶有對商家和商品有任何的看法和建議可以在文本框內(nèi)輸入文字內(nèi)容進(jìn)行評價(jià)，文字內(nèi)容不能涉及敏感詞庫并要超過五個(gè)字符，否則提交評價(jià)失敗且會有彈窗提示用戶。

當(dāng)用戶在商品評價(jià)時(shí)輸入了文字內(nèi)容或選擇了商品評價(jià)標(biāo)簽，在提交評價(jià)后會得到10金幣，金幣用于“餓了么”App內(nèi)另一個(gè)頁面功能（金幣商城），在這里筆者暫不作說明。

當(dāng)用戶對訂單提交評價(jià)后，頁面轉(zhuǎn)至評價(jià)成功界面。至此，表示用戶在“餓了么”App內(nèi)的預(yù)訂商品交易流程完成。

七、測試異常頁面及突發(fā)狀況

筆者根據(jù)自身對“餓了么”App的使用體驗(yàn)，測試了一些異常頁面和突發(fā)狀況下App的應(yīng)對處理方式，大體分為網(wǎng)絡(luò)異常、登陸異常及數(shù)據(jù)丟失等。

7.1 網(wǎng)絡(luò)異常

測試內(nèi)容：斷開網(wǎng)絡(luò)時(shí)各頁面的顯示內(nèi)容及聯(lián)網(wǎng)使用過程中突然的斷網(wǎng)狀態(tài)。

通過測試，筆者發(fā)現(xiàn)“餓了么”App在用戶網(wǎng)絡(luò)斷開連接時(shí)對首頁（外賣頁）及“我的”頁面做了數(shù)據(jù)的緩存，而沒有數(shù)據(jù)緩存的頁面如訂單頁則是做了網(wǎng)絡(luò)異常的UI界面設(shè)計(jì)，并且界面中包含動態(tài)的圖標(biāo)，并提示用戶“網(wǎng)絡(luò)異常，重新加載”；在用戶使用App過程中，突發(fā)網(wǎng)絡(luò)中斷時(shí)會相應(yīng)的彈出Toast提醒用戶“似乎已斷開與互聯(lián)網(wǎng)的連接”。

網(wǎng)絡(luò)異常小結(jié)

網(wǎng)絡(luò)異常突發(fā)狀況下，“餓了么”App會以三種方式應(yīng)對處理即：頁面數(shù)據(jù)緩存、設(shè)計(jì)網(wǎng)絡(luò)異常UI界面和彈窗提示。

其中頁面數(shù)據(jù)緩存方式的頁面效果比較友好，而由于網(wǎng)絡(luò)異常導(dǎo)致的部分過期數(shù)據(jù)內(nèi)容會困擾用戶（如“我的”頁面中的金幣和紅包），且隨著使用時(shí)長的增加，App緩存占用的內(nèi)存會不斷增加；同時(shí)設(shè)計(jì)網(wǎng)絡(luò)異常UI頁面和彈窗提示能在一定程度上提高用戶體驗(yàn)，但過度頻繁的提醒可能會增加用戶的厭煩感。

7.2 登陸異常

測試內(nèi)容：未登錄狀態(tài)下查看各頁面內(nèi)容及嘗試結(jié)算訂單。

通過測試，筆者發(fā)現(xiàn)在未登錄狀態(tài)下用戶除了訂單頁、用戶“我的”頁及在商家頁面結(jié)算時(shí)會提示用戶登陸或直接轉(zhuǎn)至登陸界面，其他頁面用戶都可以隨意查看瀏覽。由此可見，“餓了么”App對用戶的“登陸/注冊”引導(dǎo)性很低，然而考慮之前對“餓了么”多入口對應(yīng)單出口的功能邏輯分析，這可能也是“餓了么”App采取的特有引導(dǎo)方式，即將“登陸/注冊”功能設(shè)置在商家頁面的結(jié)算出口處，針對不同使用場景及不同需求的用戶，以此來適當(dāng)增加用戶對App的粘性。

登陸異常小結(jié)

登陸異常突發(fā)狀況下，“餓了么”App采取頁面跳轉(zhuǎn)登陸界面及設(shè)計(jì)登陸異常的UI界面兩種方式。其中需要用戶信息的頁面會有相應(yīng)登陸異常的UI提示(如查看訂單頁)，需要用戶信息的子頁面會直接轉(zhuǎn)至登陸頁面（如商家頁面與購物車的訂單結(jié)算）。

7.3 數(shù)據(jù)丟失

除了網(wǎng)絡(luò)異常及登陸異常以外，用戶還可能遇到在使用“餓了么”App過程中接打電話、手機(jī)突然關(guān)機(jī)、App程序突然崩潰等異常狀況，這些狀況都會造成一定程度上的數(shù)據(jù)丟失。在使用App時(shí)接打電話，“餓了么”程序會自動設(shè)置為后臺運(yùn)行，但若在后臺運(yùn)行的時(shí)間過長，再次打開程序頁面會默認(rèn)轉(zhuǎn)至“歡迎引導(dǎo)頁”，而在手機(jī)關(guān)機(jī)和App崩潰的情況下，App只能重新打開，而不能回到之前操作的頁面。此外“餓了么”App對支付訂單功能設(shè)置了十五分鐘支付時(shí)效，即需要用戶在十五分鐘內(nèi)對已選定的訂單進(jìn)行結(jié)算付款，這也在一定程度上能夠解決可能的數(shù)據(jù)丟失造成的支付問題。

八、總結(jié)

由于“餓了么”App框架龐大，流量入口繁雜，筆者在此主要對首頁（外賣頁）部分及相應(yīng)的邏輯功能流程進(jìn)行撰寫說明，其他部分會在以后逐一補(bǔ)充。本篇PRD是個(gè)人根據(jù)現(xiàn)有的“餓了么”App產(chǎn)品倒推的，一定會有很多疏漏之處，作為一個(gè)決心入行的產(chǎn)品準(zhǔn)新人小白，懇請您的諒解，此外有些功能邏輯或頁面邏輯闡述不合理的，也請您能幫我指出，在以后的學(xué)習(xí)中一定會逐漸修正，本人不勝感激！

注：文檔中所引用的彩色App截圖來源于“餓了么”App。

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