用Axure寫PRD:倒推網(wǎng)易云音樂APP產(chǎn)品需求文檔
![](http://image.woshipm.com/wp-files/img/32.jpg)
為了更加完整的描述產(chǎn)品的需求,規(guī)范需求表達(dá)方式,產(chǎn)品需求文檔(Product Requirement Document)應(yīng)運(yùn)而生,而作為產(chǎn)品經(jīng)理的基本功,也是小白入門的必須掌握的部分。筆者作為一個(gè)小白沒有項(xiàng)目實(shí)戰(zhàn),于是通過倒推已經(jīng)成熟的產(chǎn)品來鍛煉寫需求文檔的技能。第一次使用Axure寫PRD,主要目的是希望通過大家給出的意見改進(jìn),很多表達(dá)不當(dāng)?shù)牡胤?,還望各位大神多多指教,感激不盡。
本文倒推的是網(wǎng)易云音樂APP,由于功能入口繁多,本文在功能需求與交互的部分,只以主要流量入口“發(fā)現(xiàn)音樂-推薦”示例。以下是我的原型截圖:
文檔目錄
一、產(chǎn)品概述
1. 產(chǎn)品介紹
網(wǎng)易云音樂于2013年1月正式上線,其移動(dòng)端APP能夠?yàn)橛脩籼峁┰诰€收聽原創(chuàng)音樂、私人FM、電臺(tái)、短視頻等服務(wù),同時(shí)還可以進(jìn)行在線互評(píng),社區(qū)互動(dòng)的一款音樂平臺(tái)APP。
1.1產(chǎn)品定位:
移動(dòng)音樂社區(qū),旨在成為中國最大的移動(dòng)音樂社區(qū)和開放平臺(tái),形成獨(dú)一無二的以用戶為中心的音樂生態(tài)圈。
1.2用戶人群:
熱愛音樂,對(duì)音樂有較高需求的高素質(zhì)年輕人群:大學(xué)生、白領(lǐng)等。
2.文檔屬性
3.需求整理
二、產(chǎn)品結(jié)構(gòu)圖
1.產(chǎn)品功能結(jié)構(gòu)圖
2. 產(chǎn)品信息結(jié)構(gòu)圖
(第一次做結(jié)構(gòu)圖,對(duì)功能信息具體怎么去劃分開始還是有些模糊的,但通過一邊做一邊思考發(fā)現(xiàn),功能結(jié)構(gòu)則是整個(gè)產(chǎn)品的骨架,信息結(jié)構(gòu)則是由骨架傳遞出來的信息組合而成的,例如評(píng)論,可以作為一種功能,但評(píng)論顯示的數(shù)量,評(píng)論用戶的信息,評(píng)論的內(nèi)容則是信息。個(gè)人理解,有偏差請(qǐng)指正~~)
三、 全局說明
1.功能權(quán)限
分為登錄和未登錄狀態(tài):
- 登錄狀態(tài):可進(jìn)行App內(nèi)所有操作;
- 未登錄狀態(tài):即游客試用狀態(tài);常規(guī)的音樂播放與下載、視頻播放、專欄瀏覽電臺(tái)收聽等均可以進(jìn)行,但無法進(jìn)行簽到,訂閱電臺(tái),收藏專欄,發(fā)布動(dòng)態(tài);點(diǎn)贊評(píng)論功能也無法使用;在商城里無法進(jìn)行商品的加購和購買;
2. 頁面內(nèi)交互
2.1頂部、底部彈窗
2.2toast、dialog 彈窗
3.鍵盤說明
- 點(diǎn)擊手機(jī)號(hào)輸入框時(shí)頁面底部彈出數(shù)字鍵盤;
- 點(diǎn)擊其他輸入框頁面底部彈出字母全鍵盤。
(此處特別說明,注冊(cè)賬號(hào)時(shí),填寫電話號(hào)碼后需要接收數(shù)字驗(yàn)證碼,但網(wǎng)易云音樂現(xiàn)有版本點(diǎn)擊驗(yàn)證碼輸入框時(shí)顯示的并非數(shù)字鍵盤,而是字母全鍵盤)
4.頁面異常
5.頁面間交互方式
6.更多操作
四、部分業(yè)務(wù)邏輯
1. 登錄注冊(cè)業(yè)務(wù)邏輯
(這是用axure做的流程圖,沒有箭頭看起來有點(diǎn)奇怪)
2. 音樂下載邏輯
(會(huì)員部分省略了歌單判斷邏輯)
五、功能需求與交互(部分展示)
1. 主頁進(jìn)入
1.1?使用場景:
已登錄用戶剛打開網(wǎng)易云音樂APP。
1.2 交互需求
- 打開應(yīng)用時(shí),若無其他操作,起始頁停留約2秒后 進(jìn)入廣告頁面;廣告頁面停留約5秒進(jìn)入音樂主頁。
- 打開應(yīng)用時(shí),起始頁停留約2秒后 進(jìn)入廣告頁面,點(diǎn)擊右下角“跳過”,直接進(jìn)入音樂主頁。
- 點(diǎn)擊廣告頁面,進(jìn)入相應(yīng)廣告鏈接。
2.登錄/試用/注冊(cè)
2.1 用戶使用場景
- 當(dāng)用戶第一次使用該應(yīng)用時(shí)
- 當(dāng)游客用戶需要執(zhí)行評(píng)論、購買、收藏、訂閱等操作時(shí)(參見前文3.1關(guān)于”功能權(quán)限說明“)
2.2 交互需求
(1)輸入/前置條件:點(diǎn)擊登錄按鈕
交互:
- 點(diǎn)擊手機(jī)號(hào)登錄按鈕時(shí),跳轉(zhuǎn)到手機(jī)登錄頁面;獲取焦點(diǎn)在電話號(hào)碼輸入框,默認(rèn)為+86形式,數(shù)字鍵盤從頁面底部彈出;
- 當(dāng)輸入非數(shù)字內(nèi)容時(shí),輸入界面不顯示任何內(nèi)容;輸入數(shù)字小于11位時(shí),點(diǎn)擊登錄提示“請(qǐng)輸入11位數(shù)字手機(jī)號(hào)”當(dāng)輸入大于11位數(shù)字時(shí),超過部分不顯示;
- 輸入密碼時(shí),密碼顯為不可見狀態(tài);
- 忘記密碼時(shí),點(diǎn)擊密碼欄右側(cè)“忘記密碼?”可進(jìn)行重置密碼操作(前文有具體的登錄邏輯,此處不細(xì)述,見4.1)
- 點(diǎn)擊登錄頁面下方第三方登錄按鈕時(shí),跳轉(zhuǎn)到第三方授權(quán)頁面。
(2)輸入/前置條件:點(diǎn)擊“注冊(cè)”按鈕
交互:
- 點(diǎn)擊“注冊(cè)”按鈕時(shí),跳轉(zhuǎn)到手機(jī)號(hào)注冊(cè)頁面;
- 點(diǎn)擊手機(jī)號(hào)輸入框,數(shù)字鍵盤從底部彈出;
- 手機(jī)號(hào)默認(rèn)+86,輸入限制11位;
- 密碼輸入不可見,限制不低于6位;當(dāng)設(shè)置低于6位密碼時(shí),點(diǎn)擊注冊(cè)按鈕提示toast“請(qǐng)輸入6位或以上的密碼”(前文有具體的注冊(cè)邏輯,此處不細(xì)述,見4.1)。
(3)輸入/前置條件:點(diǎn)擊“游客試用”時(shí),直接進(jìn)入音樂主頁面
3.搜索功能
3.1 用戶畫像
3.2 交互需求(下載頁面邏輯見前文)
(1)進(jìn)入搜索界面
- 輸入/前置條件:點(diǎn)擊搜索圖標(biāo)按鈕
- 功能描述:搜索輸入歌名、專輯、人名,關(guān)鍵詞;
交互:
- 點(diǎn)擊搜索按鈕時(shí),跳轉(zhuǎn)到搜索頁面;
- 光標(biāo)在輸入框中獲取焦點(diǎn);
- 搜索框提示”提示內(nèi)容或推薦內(nèi)容“
- 文字輸入鍵盤從底部彈出遮擋頁面。
(2)執(zhí)行搜索
輸入/前置條件:
- 點(diǎn)擊輸入法鍵盤搜索按鈕
- 直接點(diǎn)擊下拉列表中搜索內(nèi)容 ?*
- 點(diǎn)擊熱門關(guān)鍵詞
- 點(diǎn)擊搜索歷史記錄
交互:
- 輸入搜索內(nèi)容時(shí),提示文字消失;輸入框下方向顯示搜索關(guān)鍵詞相關(guān)內(nèi)容;
- 點(diǎn)擊”搜索”關(guān)鍵詞“或點(diǎn)擊推薦相關(guān)搜索內(nèi)容時(shí),跳轉(zhuǎn)到搜索結(jié)果頁面,鍵盤消失;結(jié)果頁面搜索框中顯示關(guān)鍵詞;
- 點(diǎn)擊熱門搜索關(guān)鍵詞執(zhí)行搜索功能;點(diǎn)擊搜索歷史記錄,執(zhí)行搜索功能;
- 點(diǎn)擊返回按鈕回到執(zhí)行搜索前頁面。
4. 音樂播放頁面
4.1 用戶場景
- 播放歌曲
- 切換上一曲/下一曲
- 查看歌詞
- 想查看歌曲信息
- 想查看歌曲作者信息
- 喜歡這首歌,想添加到喜愛歌單
- 很喜歡這首歌,想分享給朋友聽
4.2 交互需求
(1)音樂播放
輸入/前置條件:點(diǎn)擊音樂播放按鈕;
交互:
- 音樂暫停狀態(tài),點(diǎn)擊播放按鈕時(shí),按鈕變?yōu)椤睍和0粹o“;
- 音樂開始播放,”留聲機(jī)唱盤“順時(shí)針旋轉(zhuǎn),留聲機(jī)唱臂與唱盤接接觸;(此處動(dòng)圖未展示)
- 音樂進(jìn)度隨音樂播放進(jìn)度增長,音樂播放時(shí)間隨播放增長。
(2)音樂暫停
輸入/前置條件:點(diǎn)擊暫停按鈕;
交互:
- 音樂播放狀態(tài),點(diǎn)擊暫停按鈕時(shí),按鈕變?yōu)椤安シ虐粹o”;
- 音樂暫停播放,“留聲機(jī)唱盤”停止旋轉(zhuǎn); ?唱臂與唱盤脫離接觸;(此處動(dòng)圖未展示)
- 音樂進(jìn)度條停止增長;音樂播放時(shí)間停止增長。
(3)切歌
- 點(diǎn)擊下一曲按鈕,上一首音樂暫停播放;
- 留聲機(jī)唱臂與唱盤約脫離“1s”后,下一首音樂唱盤從頁面右邊緣滑入;
- 留聲機(jī)唱臂與下一首唱盤接觸后開始播放下一首音樂,進(jìn)度條和播放時(shí)間回到初始狀態(tài)。
(4)添加喜愛
點(diǎn)擊愛心按鈕,愛心變?yōu)榧t色;再次點(diǎn)擊恢復(fù)原貌。
(5)查看歌詞
輸入/前置條件:點(diǎn)擊唱盤;
交互:
- 點(diǎn)擊唱盤時(shí),音樂播放界面消失,顯示歌詞界面;
- 原音樂播放界面進(jìn)度條及以下按鈕保持不變;歌詞頁面頂部顯示聲音狀態(tài)條;
- 歌詞根據(jù)音樂進(jìn)度向上滾動(dòng);正在播放詞句高亮突出顯示。
(6)滑動(dòng)歌詞
- 歌詞部分可以進(jìn)行上下滑動(dòng);滑動(dòng)第一行文字和最后一行文字到達(dá)頁面中部時(shí)邊界,到達(dá)邊界后無法拖動(dòng);(本文圖片未展示)
- 滑動(dòng)歌詞到某一句后,歌詞左側(cè)顯示播放按鈕,點(diǎn)擊可從該句開始播放;
- 滑動(dòng)歌詞到某一句后,無操作時(shí)歌詞滾動(dòng)暫停5秒,5秒后恢復(fù)正常滾動(dòng)。
(7)分享(同前文3.1 底部彈窗)
輸入/前置條件:點(diǎn)擊分享按鈕
交互:
- 點(diǎn)擊分享按鈕時(shí),分享選項(xiàng)界面從頁面底部向上滑入;
- 遮蓋背景內(nèi)容;背景內(nèi)容變暗;背景內(nèi)容變?yōu)殪o態(tài);
- 若不執(zhí)行分享操作,點(diǎn)擊背景,分享選項(xiàng)向下滑出頁面;背景內(nèi)容恢復(fù)正常;
- 執(zhí)行分享選項(xiàng)后,跳轉(zhuǎn)到該選項(xiàng)相關(guān)頁面。
(8)查看歌曲相關(guān)信息(同前文3.1 底部彈窗)
輸入/前置條件:點(diǎn)擊相應(yīng)執(zhí)行按鈕;(圖中的“三點(diǎn)”)
交互:
- 點(diǎn)擊按鈕時(shí),歌曲信息頁面由頁面底部向上滑入;
- 遮蓋背景內(nèi)容;背景內(nèi)容變暗;背景內(nèi)容變?yōu)殪o態(tài);
- 若不執(zhí)行分享操作,點(diǎn)擊背景,分享選項(xiàng)向下滑出頁面;背景內(nèi)容恢復(fù)正常。
5.下載(免費(fèi)下載/會(huì)員下載)
5.1 用戶場景
- 公司舉行頒獎(jiǎng)會(huì)議,小愛要下載一些音樂作為領(lǐng)獎(jiǎng)北京音樂
- 小剛想給自己做的搞笑視頻配上背景音樂
- 小葉想給自己換個(gè)炫一點(diǎn)的手機(jī)鈴聲
5.2 交互需求(下載邏輯見前文4.2)
(1)免費(fèi)歌曲
1)當(dāng)該歌曲未被收藏到歌單前:
交互:
- 點(diǎn)擊下載按鈕時(shí),中部彈出歌單頁面,遮蓋背景部分;背景內(nèi)容變暗;
- 點(diǎn)擊新建單,中部彈出建立歌單頁面,不透明遮蓋歌單頁面,歌單變暗;焦點(diǎn)獲取在輸入框可輸入 ? 歌單名稱;輸入框右下方提示輸入字符數(shù),限制40字符;輸入框下方復(fù)選框可勾選是否設(shè)置為“隱私歌單”點(diǎn)擊取消回到歌單頁面,歌單頁面回復(fù)正常亮度;輸入歌單名稱后點(diǎn)擊確定,開始下載;
- 點(diǎn)擊已有歌單直接開始后臺(tái)下載,歌單頁面消失,背景界面恢復(fù)正常亮度;下載完成后,下載按鈕右下角顯示“√”。
2)當(dāng)該歌曲已被收藏到歌單時(shí),點(diǎn)擊下載按鈕直接默認(rèn)下載到收藏歌單:(邏輯參見本文4.2)
交互:點(diǎn)擊下載按鈕時(shí),后臺(tái)直接開始下載,不顯示界面,下載成功后,下載按鈕右下角顯示“√”。
(2)付費(fèi)歌曲:
點(diǎn)擊下載按鈕時(shí):
- 會(huì)員直接開始下載(具體同上)
- 非會(huì)員跳轉(zhuǎn)到會(huì)員界面,顯示加載進(jìn)度條;購買會(huì)員后繼續(xù)下載(下載邏輯參見4.2)
6.評(píng)論功能
6.1 用戶使用場景
- 小A看了劉若英的后來,再次聽《后來》這首歌,更是百感交集,很想跟別人分享一下感受,也想知道是不是有同樣很多人跟我有一樣的感受呢?
- 小B聽到自己家idol出的新歌,必須挺!
6.2 頁面邏輯
- 點(diǎn)擊評(píng)論按鈕,進(jìn)入評(píng)論頁面;頁面主要分為:被評(píng)論歌曲+歌曲相關(guān)內(nèi)容推薦+歷史評(píng)論內(nèi)容+評(píng)論輸入框;
- 點(diǎn)擊被評(píng)歌曲版塊,回到歌曲播放頁面;點(diǎn)擊相關(guān)推薦鏈接到相關(guān)內(nèi)容;點(diǎn)擊歷史評(píng)論內(nèi)容可進(jìn)回復(fù),分享等操作;點(diǎn)擊評(píng)論者頭像可查看該評(píng)論者主頁;
- 評(píng)論內(nèi)容分為“精彩評(píng)論”與“最新評(píng)論” 精彩評(píng)論按點(diǎn)贊數(shù)量降序排列,展示15條后其余部分折疊,點(diǎn)擊展開;最新評(píng)論按發(fā)布時(shí)間,優(yōu)先展示最近評(píng)論;評(píng)論右上角可進(jìn)行點(diǎn)贊操作,點(diǎn)擊按鈕執(zhí)行點(diǎn)贊,點(diǎn)贊數(shù)量增加,再次點(diǎn)擊按鈕,執(zhí)行取消點(diǎn)贊,點(diǎn)贊數(shù)減少;
- 評(píng)論輸入框內(nèi)可輸入內(nèi)容,內(nèi)容限制140字;未輸入內(nèi)容時(shí),“發(fā)送“按鈕禁止操作
6.3 交互需求
- 點(diǎn)擊點(diǎn)贊按鈕時(shí),點(diǎn)贊按鈕和點(diǎn)贊數(shù)量同時(shí)變?yōu)榧t色,同時(shí)點(diǎn)贊數(shù)量+1;再次點(diǎn)擊按鈕時(shí),紅色消失恢復(fù)正常顏色,點(diǎn)贊數(shù)量-1;
- 點(diǎn)擊評(píng)論按鈕時(shí),評(píng)論頁從底部快速滑入;
- 評(píng)論框中無內(nèi)容時(shí),發(fā)送按鈕字體顯示為灰色;輸入內(nèi)容后顯示黑色;
- 評(píng)論內(nèi)容超過140字時(shí),顯示toast彈窗“評(píng)論字?jǐn)?shù)超過限制”
- 評(píng)論頁面可進(jìn)行上下滑動(dòng),上下有邊界,上邊界無法拖動(dòng),到達(dá)下邊界執(zhí)行更多內(nèi)容加載
- 評(píng)論框在頁面底部顯示;評(píng)論框顯示提示文字;
- 點(diǎn)擊輸入框時(shí),輸入法鍵盤從頁面底部滑入;遮蓋評(píng)論頁面;輸入框同步上移,保持與鍵盤相連;光標(biāo)獲取焦點(diǎn)在輸入框;(彈出輸入框后仍然可以操作背景內(nèi)容)
- 點(diǎn)擊“被評(píng)歌曲版塊”時(shí),原歌曲頁面從底部快速滑入;點(diǎn)擊相關(guān)推薦內(nèi)容時(shí),相關(guān)內(nèi)容頁面從底部快速滑入;點(diǎn)擊評(píng)論者頭像時(shí),評(píng)論者主頁頁面從底部快速滑入;
- 點(diǎn)擊已有評(píng)論內(nèi)容時(shí),頁面中部彈出“評(píng)論操作框”遮蓋背景頁面,背景內(nèi)容變暗;點(diǎn)擊背景頁面后彈窗淡出;背景內(nèi)容恢復(fù)正常亮度;
評(píng)論操作框執(zhí)行:
(1)前置條件:點(diǎn)擊回復(fù)評(píng)論
交互:
- 輸入法鍵盤從頁面底部滑入;
- 遮蓋評(píng)論頁面;
- 輸入框同步上移,保持與鍵盤相連;
- 光標(biāo)獲取焦點(diǎn)在輸入框;
- 點(diǎn)擊收起鍵盤按鈕后,鍵盤向下滑出消失,輸入框回到原先位置。
(2)前置條件:點(diǎn)擊分享評(píng)論
交互:同前文分享界面,此處不贅述
(3)前置條件:點(diǎn)擊復(fù)制評(píng)論
交互:頁面底部顯示toast彈窗”復(fù)制成功”(toast彈窗見前文)
(4)前置條件:點(diǎn)擊舉報(bào)評(píng)論
交互:
- 頁面中部彈出舉報(bào)原因彈窗,遮蓋背景內(nèi)容,背景內(nèi)容變暗無法操作;
- 點(diǎn)擊背景彈窗淡出。
7.主頁面切換
7.1 用戶使用場景
當(dāng)用戶想看點(diǎn)其他內(nèi)容時(shí);
7.2?交互需求
- 主頁面功能頁面切換:點(diǎn)擊版塊按鈕水平切換頁面,(當(dāng)上一個(gè)頁面按鈕在新頁面按鈕左邊時(shí),新頁面從右邊緣水平滑入;當(dāng)上一個(gè)頁面按鈕在新頁面按鈕右邊時(shí),新頁面從左邊緣水平滑入;)
- 推薦版塊Tab切換時(shí),點(diǎn)擊Tab按鈕(或左右滑動(dòng)時(shí)),頁面水平切換;按鈕字體高亮顯示;小滑塊隨之移動(dòng);切換方向規(guī)則同上。
【以下為網(wǎng)易云音樂APP主要流量入口“發(fā)現(xiàn)”版塊的“推薦”Tab示例】
8.推薦頁面
8.1主頁面邏輯與交互需求
- 推薦頁面主要由4個(gè)部分構(gòu)成:banner+快捷入口+推薦相關(guān)板塊+欄目調(diào)整按鈕,分別點(diǎn)擊可以進(jìn)入相關(guān)鏈接頁面;
- 主頁面交互:頁面可進(jìn)行上下滑動(dòng),上下有邊界;到達(dá)上下邊界時(shí)頁面無法滑動(dòng);邊界顯示透明遮蓋陰影;
8.2 詳細(xì)功能
(1)FM
頁面邏輯:
- FM主要分為“私人FM”和“跑步FM”兩個(gè)部分;
- 私人FM將進(jìn)行音樂隨機(jī)播放,每天限量20首,可對(duì)其進(jìn)行下一曲切換,添加喜愛、刪除、評(píng)論操作;
- 跑步FM則是根據(jù)跑步頻率自動(dòng)播放何時(shí)的歌曲;同時(shí)可以開啟離線操作,在wifi情況下提前緩存音樂,離線收聽。
交互需求:
- 點(diǎn)擊私人FM按鈕時(shí),F(xiàn)M頁面從底部快速滑入,默認(rèn)選中“私人FM”頁面;對(duì)應(yīng)的按鈕和文字高亮顯示;進(jìn)入頁面音樂自動(dòng)播放;(評(píng)論 喜愛等操作不贅述)
- 點(diǎn)擊跑步FM時(shí),按鈕和文字相應(yīng)高亮顯示,私人FM按鈕和文字變暗;
- 進(jìn)入跑步FM頁面后,主頁面圓形向四周動(dòng)態(tài)輻射狀獲取步頻;獲取步頻后,圓形變?yōu)殪o態(tài),圓形中間顯示步頻;音樂播放功能區(qū)在頁面底部逐漸顯現(xiàn);
- 點(diǎn)擊離線音樂包按鈕時(shí),中部顯示彈窗;遮蓋背景,背景變暗;點(diǎn)擊背景后彈窗消失,背景恢復(fù);
(2)每日推薦
該功能是基于海量的數(shù)據(jù)以及用戶的下載、收藏、喜歡、分享等行為進(jìn)行的口味話推薦,每天6:00點(diǎn)更新,限量30首。
交互需求:
- 點(diǎn)擊每日推薦按鈕時(shí),推薦頁面從底部快速滑入;
- 頁面可進(jìn)行上下滑動(dòng),上下有邊界,邊界拖動(dòng)時(shí)顯示透明遮蓋形狀,該形狀在結(jié)束滑動(dòng)行為或約2秒后消失(本文圖中未展示)。
(篇幅有有限,每日推薦的歌曲的各種交互暫不在此處羅列,部分交互可參看動(dòng)圖)
(3)歌單
頁面邏輯:
- 點(diǎn)擊歌單按鈕,進(jìn)入精品歌單頁面,點(diǎn)擊封面進(jìn)入精品歌單所有歌單列表;
- 點(diǎn)擊全部歌單按鈕,進(jìn)入選擇分類頁面,可點(diǎn)擊選擇分類,進(jìn)入對(duì)應(yīng)類型歌單;
- 點(diǎn)擊具體歌單封面,進(jìn)入歌單詳細(xì)頁。
(4)排行榜
頁面邏輯:
- 點(diǎn)擊排行榜按鈕,進(jìn)入榜單頁面,頁面展示不用類型的排行榜分為:官方榜、全球榜、用戶榜;
- 官方排行榜展示前三名歌曲名稱與作者;
- 點(diǎn)擊榜單封面可進(jìn)入具體榜單頁面。
(5)專欄
頁面邏輯:
- 拖動(dòng)推薦頁面到“精選專欄”位置,該位置展示三個(gè)專欄摘要,主要包括標(biāo)題、閱讀量和封面;
- 點(diǎn)擊“精選專欄”字樣,打開專欄頁面;
- 點(diǎn)擊推薦展示專欄的標(biāo)題或封面,直接進(jìn)入該專欄的具體內(nèi)容頁。
(6)推薦歌單
頁面邏輯:
- 該板塊展示6個(gè)推薦歌單,主要展示封面、收聽數(shù)、歌單名;
- 點(diǎn)擊推薦歌單擴(kuò)展按鈕,進(jìn)入效果同上述的“歌單”快捷入口頁面;
- 點(diǎn)擊標(biāo)題或封面,直接進(jìn)入歌單內(nèi)容頁面。
(7)獨(dú)家放送
頁面邏輯:
- 該板塊主要是將精選的各個(gè)類型的獨(dú)家內(nèi)容推薦展示,可以包括視頻、話題、專輯等;
- 展示三個(gè)推薦內(nèi)容,包括封面、標(biāo)題、和類型標(biāo)簽;
- 點(diǎn)擊標(biāo)題或內(nèi)容直接進(jìn)入相關(guān)頁面。
(8)會(huì)員專區(qū)
頁面邏輯:
- 該板塊是針對(duì)會(huì)員的一個(gè)集中展示的入口;
- 展示三個(gè)推薦內(nèi)容,橫排展示,包括專輯、單曲、電臺(tái)等在內(nèi);
- 主要展示封面和標(biāo)題;
- 點(diǎn)擊封面或標(biāo)題直接進(jìn)入相關(guān)內(nèi)容頁面;
- 點(diǎn)擊會(huì)員專區(qū)擴(kuò)展按鈕,非會(huì)員進(jìn)入VIP開通頁面。
(9)主播電臺(tái)
頁面邏輯:
- 該標(biāo)簽頁展示6個(gè)推薦內(nèi)容,包括付費(fèi)標(biāo)識(shí)、封面、標(biāo)題、描述;
- 點(diǎn)擊封面或描述直接進(jìn)入電臺(tái)內(nèi)容頁;
- 點(diǎn)擊主播電臺(tái)擴(kuò)展按鈕,直接切換發(fā)現(xiàn)音樂的Tab,即直接進(jìn)入了電臺(tái)功能區(qū)。
(10)調(diào)整順序
頁面邏輯:點(diǎn)擊該按鈕進(jìn)入主頁標(biāo)簽欄目的順序調(diào)節(jié)頁面,右方按鈕拖動(dòng)即可調(diào)節(jié);
交互: 調(diào)節(jié)進(jìn)入按鈕在頁面底部顯示
- 進(jìn)入調(diào)節(jié)順序頁面后,按住調(diào)節(jié)目標(biāo)對(duì)應(yīng)的按鈕后,該行欄目標(biāo)題變暗,上下拖動(dòng)垂直交換順序;
- 欄目名稱重疊時(shí),該行呈透明;
- 結(jié)束拖動(dòng)時(shí),字體恢復(fù)深色;
- 上下拖動(dòng)有邊界,到達(dá)邊界后無法拖動(dòng);
- 在點(diǎn)擊非拖動(dòng)按鈕的欄目標(biāo)題區(qū)域時(shí),改行顯示深色,約1秒后深色消失。
9.聽歌識(shí)曲/定時(shí)停止播放
(1)聽歌識(shí)曲
用戶使用場景:
- 小胡今天在奶茶店聽到了一首很對(duì)胃口的歌,但直接去問小姐姐又略顯羞澀,但又很想知道歌名好去下載聽歌;
- 小江在觀看視頻時(shí),被背景音樂吸引到,想知道歌名。
前置條件:點(diǎn)擊識(shí)別按鈕,以及開啟語音權(quán)限;
交互需求:
- 點(diǎn)擊主頁面左上角折疊按鈕,個(gè)人設(shè)置功能區(qū)由左邊緣滑出,遮蓋原頁面,原頁面變暗;
- 點(diǎn)擊聽歌識(shí)曲,直接進(jìn)入聽歌識(shí)別功能;顯示正在識(shí)別音樂字樣;識(shí)別界面程動(dòng)態(tài)輻射狀;
- 點(diǎn)擊識(shí)別頁面,停止識(shí)別,停止動(dòng)態(tài)輻射。
(2)定時(shí)停止播放
用戶使用場景:
小明每天睡覺都有聽歌的習(xí)慣,晚上睡覺想聽點(diǎn)助眠歌曲,但又怕放著睡著了忘記關(guān)掉音樂浪費(fèi)電量。
交互需求:
- 點(diǎn)擊定時(shí)停止播放按鈕時(shí),個(gè)人設(shè)置功能區(qū)像左滑出頁面邊緣,中部顯示定時(shí)選擇頁面,頁面背景變暗;
- 選擇停止時(shí)間后,中部彈窗消失,背景頁面顯示正常亮度;頁面底部顯示toast彈窗“設(shè)置成功,將于**分鐘后關(guān)閉”。
六、總結(jié)
整個(gè)網(wǎng)易云音樂APP功能龐大繁雜,本文只對(duì)該應(yīng)用的主要流量入口進(jìn)行說明,多有不足還請(qǐng)見諒。
另外本文運(yùn)用Axure進(jìn)行PRD寫作的思路參考了@神戶短郎《用Axure寫PRD:虎撲app產(chǎn)品需求文檔》
歡迎各位指教~~~~小白菜致上~~
本文由 @小白菜 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自網(wǎng)絡(luò)
你好可以交流下么
樓主您好,想借鑒下你的原型文檔學(xué)習(xí)一下,郵箱:871763138@qq.com
想問一下 跳轉(zhuǎn)頁面的時(shí)候如何做到手機(jī)固定不動(dòng) 就是不會(huì)閃一下..
動(dòng)態(tài)面板?
畫的真好!可以借鑒一下原型圖嘛?756077390@qq.com,謝謝??!
現(xiàn)在求原型文檔還來得及嗎?麻煩大佬了
2698248626@qq.com
2465229032@qq.com 同球啊 謝謝樓主大大
求文擋:it.aly@qq.com
挖墳~感覺作者做事愿意思考,又很用心,可以加微信交個(gè)朋友嗎~VX871231414
煩請(qǐng)大神發(fā)一份原型文檔到郵箱,郵箱741724451@qq.com 萬分感謝!!
這已經(jīng)是以前寫的東西了 評(píng)論里我發(fā)了原型的百度云鏈接 可以自取 永久有效的
煩請(qǐng)大神發(fā)一份原型文檔到郵箱,郵箱704984831@qq.com 萬分感謝??!
可否勞煩大神分享一份到郵箱,761367479@qq.com,謝謝謝謝。
跪求分享!330729815@qq.com
產(chǎn)品小白,求大神分享!npf20082012@163.com
產(chǎn)品小白,求分享原型文檔,感激不盡??!505447175@qq.com
正在求職的產(chǎn)品小白一枚,懇求分享一下原型文檔,感激不盡?。?521916742@qq.com
原型文檔可以借鑒一下嗎?郵箱2330222197@qq.com 感謝~
同產(chǎn)品小白,求分享bb520mb@163.com,感謝!
請(qǐng)問一下頁面的演示交互用什么做的呀
Axure
不錯(cuò)不錯(cuò)啊,學(xué)習(xí)了
帥哥 求一份原型學(xué)習(xí)一下272643147@qq.com謝謝啦