講座信息獲取小程序的MVP前臺(tái)+后臺(tái)設(shè)計(jì)
編輯導(dǎo)語(yǔ):對(duì)于很多高校學(xué)生來(lái)講,經(jīng)常困擾于這樣一種情況,那就是不知道學(xué)校最近有哪些講座,邀請(qǐng)哪些嘉賓前來(lái)講學(xué),因此時(shí)常會(huì)錯(cuò)失一些重要的講座。本篇文章作者將分享講座信息獲取小程序的MVP前臺(tái)+后臺(tái)設(shè)計(jì),有興趣的小伙伴快來(lái)看看吧!
對(duì)于很多高校學(xué)生來(lái)說(shuō),如何快速獲得身邊的講座信息一直一來(lái)都是一大需求痛點(diǎn)。本文以微信小程序?yàn)檩d體,設(shè)計(jì)講座信息獲取的最小可行性產(chǎn)品。
一、需求分析
對(duì)于很多高校學(xué)生來(lái)講,經(jīng)常困擾于這樣一種情況,那就是不知道學(xué)校最近有哪些講座,邀請(qǐng)哪些嘉賓前來(lái)講學(xué),因此時(shí)常會(huì)錯(cuò)失一些重要的講座。
這主要是因?yàn)閮蓚€(gè)方面的原因產(chǎn)生的,一是很多學(xué)校都有好幾個(gè)校區(qū),每個(gè)校區(qū)都有不同的學(xué)院,各個(gè)消息各個(gè)學(xué)院之間消息并不暢通。二是官網(wǎng)雖有更新講座信息,但是并沒(méi)有多少人經(jīng)常刷新官網(wǎng),因此錯(cuò)過(guò)也就在所難免。
以我自己舉例,如果沒(méi)有看到學(xué)校在微信群的通知的話(huà),一些重要嘉賓的講座基本都會(huì)錯(cuò)過(guò)。因?yàn)榫€(xiàn)下海報(bào),官網(wǎng)宣傳都很難注意到。
身邊的很多朋友同樣也是這樣,自己學(xué)院的講座都容易缺失,更不用說(shuō)其它學(xué)院的了。
作為一個(gè)在產(chǎn)品路上努力奔跑的新人,很快就捕捉到了這個(gè)需求——及時(shí)了解全校范圍內(nèi)的講座信息。下一步就是思考如何實(shí)現(xiàn)的問(wèn)題。
先講一下為什么要打造這個(gè)產(chǎn)品,如果單純從商業(yè)化的角度來(lái)看,其實(shí)校園產(chǎn)品很難實(shí)現(xiàn)盈利,因?yàn)橛脩?hù)的粘性建立和長(zhǎng)期留存實(shí)現(xiàn)起來(lái)困難,很多巨頭進(jìn)入這個(gè)領(lǐng)域最后都潦草收尾。
但還是想做這個(gè)產(chǎn)品,一是如果在最美好的學(xué)習(xí)時(shí)光,如果錯(cuò)過(guò)與很多大咖的交流,對(duì)很多人來(lái)說(shuō)也是一種人生遺憾。二是產(chǎn)品目前就這一個(gè)模塊,如果流量效應(yīng)還可以的話(huà),完全可以拓展其它模塊,后面在演進(jìn)藍(lán)圖里再提到。三是它的實(shí)現(xiàn)成本并不高,如果能夠?qū)崿F(xiàn)流量收益是完全可以cover住成本的,而且也是個(gè)不錯(cuò)的在校實(shí)踐機(jī)會(huì)。
需求已經(jīng)確認(rèn),價(jià)值也已經(jīng)明確?,F(xiàn)在我們只是做一個(gè)mvp功能,暫時(shí)不考慮其它模塊,但這個(gè)看上去很小的mvp,也有很多問(wèn)題需要梳理:
- 講座信息從哪里來(lái)
- 講座信息收集不全面怎么辦
- 如何對(duì)這些講座信息進(jìn)行分類(lèi)
- 有哪些信息需要展示
- 如何確認(rèn)信息真實(shí)性
- 多長(zhǎng)時(shí)間刷新一次最新信息
- 用戶(hù)可以訂閱校區(qū)/學(xué)院講座信息嗎
- 用戶(hù)知道了講座信息但到開(kāi)講前遺忘了怎么辦
- 支持用戶(hù)分享信息嗎
- 產(chǎn)品形態(tài)是什么,app,小程序,還是網(wǎng)站
經(jīng)過(guò)一番思考與分析,綜合考慮用戶(hù)需求和產(chǎn)品開(kāi)拓階段戰(zhàn)略,確定了如下問(wèn)題解決方案:
- 講座信息爬取自各個(gè)學(xué)院官網(wǎng)講座信息板塊
- 支持其它用戶(hù)上傳講座信息
- 按照校區(qū)、學(xué)院對(duì)信息進(jìn)行歸類(lèi)
- 支持其它實(shí)名認(rèn)證用戶(hù)反饋以確認(rèn)信息的真實(shí)性
- 1天刷新一次最新信息
- 支持用戶(hù)訂閱校區(qū)/學(xué)院講座信息
- 用戶(hù)預(yù)約講座,開(kāi)講前2小時(shí)推送提醒
- 支持用戶(hù)分享信息至朋友圈及其它社交媒體平臺(tái)
- 產(chǎn)品形態(tài)是小程序
二、用戶(hù)核心流程圖
三、主要功能
主要功能分為六個(gè)部分:
(1)用戶(hù)點(diǎn)擊查看講座信息。
(2)已經(jīng)實(shí)名認(rèn)證過(guò)的用戶(hù)可以點(diǎn)擊反饋,以保證講座信息的真實(shí)有效性。
(3)支持用戶(hù)分享講座信息到其它社交媒體平臺(tái)。
(4)用戶(hù)預(yù)約當(dāng)前查看的講座,并接收提醒。
(5)支持用戶(hù)上傳最新講座信息。
(6)訂閱校區(qū)/學(xué)院,近期有講座更新及時(shí)推送。
四、信息結(jié)構(gòu)
五、頁(yè)面與交互
由于是mvp設(shè)計(jì),所以功能結(jié)構(gòu)和信息內(nèi)容并不繁瑣,界面設(shè)計(jì)如下:
1. 首頁(yè)–全部講座
(1)?頁(yè)面邏輯內(nèi)容
- 頁(yè)面由頂部tab欄和對(duì)應(yīng)的具體的內(nèi)容構(gòu)成;
- 上方tab欄為“全部講座”和“我的訂閱”;
- “全部講座”顯示講座縮略信息,從左往右,從上往下為課程海報(bào)、講座主題、主講人、講座時(shí)間、講座地點(diǎn)和已預(yù)約提醒人數(shù),點(diǎn)擊進(jìn)入講座詳情頁(yè)。
(2)?頁(yè)面交互
- 點(diǎn)擊tab切換對(duì)應(yīng)內(nèi)容,同時(shí)顯示藍(lán)色下劃線(xiàn),tab字體設(shè)置成藍(lán)色;
- 向左滑動(dòng)講座信息模塊,顯示“提醒”和“反饋”兩個(gè)標(biāo)簽,點(diǎn)擊進(jìn)入對(duì)應(yīng)頁(yè)面;
- 下拉頁(yè)面刷新講座信息。
2.? 首頁(yè)–我的訂閱
(1)?頁(yè)面邏輯內(nèi)容
- 頁(yè)面由頂部tab欄和導(dǎo)航欄以及對(duì)應(yīng)的具體的內(nèi)容構(gòu)成;
- 上方tab欄為“全部講座”和“我的訂閱”;導(dǎo)航欄顯示用戶(hù)訂閱的校區(qū)/學(xué)院;導(dǎo)航欄右側(cè)顯示編輯按鈕,用戶(hù)點(diǎn)擊可進(jìn)入訂閱編輯頁(yè)面。
- “全部講座”顯示講座縮略信息,從左往右,從上往下為課程海報(bào)、講座主題、主講人、講座時(shí)間、講座地點(diǎn)和已預(yù)約提醒人數(shù),點(diǎn)擊進(jìn)入講座詳情頁(yè)。
(2)?頁(yè)面交互
- 點(diǎn)擊tab欄切換對(duì)應(yīng)內(nèi)容,同時(shí)顯示藍(lán)色下劃線(xiàn),tab字體設(shè)置成藍(lán)色;點(diǎn)擊導(dǎo)航欄,對(duì)應(yīng)字體放大一號(hào),設(shè)置成藍(lán)色。
- 向左滑動(dòng)講座信息模塊,顯示“提醒”和“反饋”兩個(gè)標(biāo)簽,點(diǎn)擊進(jìn)入對(duì)應(yīng)頁(yè)面;
- 下拉頁(yè)面刷新講座信息。
這里想提一下,有朋友可能想問(wèn),“我的訂閱”這里的內(nèi)容其實(shí)完全可以在“全部講座”這里用篩選的方式加以實(shí)現(xiàn),為什么還要單獨(dú)弄一個(gè)“我的訂閱”呢?其實(shí)這樣做的原因由三個(gè)方面:
第一是我的訂閱需要登錄權(quán)限,用戶(hù)只有在登錄狀態(tài)下才能操作,這樣就可以引導(dǎo)用戶(hù)注冊(cè)登錄,沉淀用戶(hù)。如果通過(guò)篩選,對(duì)于一個(gè)MVP產(chǎn)品來(lái)說(shuō),用戶(hù)可能就是即用即走。
第二是訂閱之后,一旦用戶(hù)所訂閱的類(lèi)別有更新,用戶(hù)可以接收推送,提高用戶(hù)的小程序打開(kāi)率,而讓用戶(hù)篩選則無(wú)法實(shí)現(xiàn)這一點(diǎn)。
最后,對(duì)于固定關(guān)注幾個(gè)學(xué)院的講座的用戶(hù)來(lái)說(shuō),每次都要篩選未免有些麻煩,直接通過(guò)訂閱,即可查看對(duì)應(yīng)類(lèi)別下的講座信息,顯然要方便的多。
所以綜上選擇了訂閱的這種方式。
3. 講座詳情頁(yè)
(1)?頁(yè)面邏輯內(nèi)容
- 頁(yè)面分為五個(gè)模塊,分別為講座基本信息模塊、內(nèi)容簡(jiǎn)介模塊、時(shí)間模塊、地點(diǎn)模塊和底部的分享和與提醒模塊;
- 基本信息模塊顯示講座海報(bào)、講座主題、主講人和主講人簡(jiǎn)介;
- 時(shí)間地點(diǎn)模塊分別顯示講座的具體時(shí)間和地點(diǎn);
- 底部為分享按鈕和講座提醒,用戶(hù)點(diǎn)擊可分享講座至其它社交媒體平臺(tái)和預(yù)約提醒。
(2)?頁(yè)面交互
點(diǎn)擊預(yù)約提醒,,彈出toast提示“預(yù)約成功”,同時(shí)設(shè)置按鈕狀態(tài)為灰色。
4. 反饋?lái)?yè)
(1)?頁(yè)面邏輯內(nèi)容
- 頁(yè)面由“講座錯(cuò)誤”和“講座取消”兩欄和底部提交審核按鈕構(gòu)成;
- “講座錯(cuò)誤”下拉框分為“主題修改”,“主講人修改”,“時(shí)間修改”,“地點(diǎn)修改”,點(diǎn)擊可進(jìn)入具體頁(yè)面填寫(xiě);
- “講座取消”下拉框點(diǎn)擊可勾選具體原因;
(2)?頁(yè)面交互
- 點(diǎn)擊“講座錯(cuò)誤”或“講座取消”,前面顯示藍(lán)色對(duì)勾符號(hào),同時(shí)展開(kāi)下拉框,再次點(diǎn)擊可收起。
- 點(diǎn)擊提交審核按鈕,彈出toast提示“提交成功”,同時(shí)設(shè)置按鈕狀態(tài)為灰色。
5. 上傳講座頁(yè)
(1)??頁(yè)面邏輯內(nèi)容
- 信息填寫(xiě)框由“講座主題”、“主講人”、“地點(diǎn)”、“時(shí)間”、“主講人簡(jiǎn)介”、“講座簡(jiǎn)介”和圖片上傳等幾個(gè)部分構(gòu)成;
- 底部為提交審核按鈕。
(2)頁(yè)面交互
- 點(diǎn)擊對(duì)應(yīng)的填寫(xiě)信息框,閃動(dòng)光標(biāo),同時(shí)填寫(xiě)欄字體邊框設(shè)置成藍(lán)色;
- 點(diǎn)擊提交審核按鈕,彈出toast提示“提交成功”,同時(shí)設(shè)置按鈕狀態(tài)為灰色。
6. 當(dāng)前提醒頁(yè)
(1)?頁(yè)面邏輯內(nèi)容
- 頁(yè)面由講座信息模塊和“取消提醒”按鈕組成;
- 講座信息模塊顯示從左往右,從上往下分別顯示講座海報(bào)、講座主題、主講人、講座具體時(shí)間、地點(diǎn)信息。
(2)?頁(yè)面交互
點(diǎn)擊刪除提醒按鈕,彈出toast提示“確定取消講座提醒”,用戶(hù)根據(jù)需要進(jìn)行操作。
7. 我的頁(yè)面
(1)?頁(yè)面邏輯內(nèi)容
- 我的頁(yè)面由個(gè)人信息、實(shí)名認(rèn)證、當(dāng)前提醒、歷史提醒、我的反饋、訂閱更新通知、我的設(shè)置幾個(gè)部分組成;
- 個(gè)人信息顯示用戶(hù)頭像、昵稱(chēng)和學(xué)號(hào)。未登錄狀態(tài)個(gè)人頭像和昵稱(chēng)顯示默認(rèn)值,用戶(hù)實(shí)名認(rèn)證以后顯示學(xué)號(hào)信息,未實(shí)名認(rèn)證也為默認(rèn)值;
- 當(dāng)前提醒和歷史提醒顯示用戶(hù)當(dāng)前與過(guò)往預(yù)約講座提醒的列表;
- 我的反饋顯示用戶(hù)提交審核的講座勘誤信息和上傳的講座信息,點(diǎn)擊可查看具體詳情;
- 點(diǎn)擊我的設(shè)置可設(shè)置相關(guān)功能。
(2)?頁(yè)面交互
點(diǎn)擊訂閱通知更新按鈕,設(shè)置按鈕狀態(tài)為打開(kāi)。
六、后臺(tái)設(shè)計(jì)
到這里我們基本完成了講座信息小程序的前臺(tái)設(shè)計(jì)和簡(jiǎn)化版的需求文檔寫(xiě)作。但很多時(shí)候,后臺(tái)產(chǎn)品的設(shè)計(jì)也是產(chǎn)品經(jīng)理工作的重要組成部分,為了更充分地展示mvp產(chǎn)品前后臺(tái)的銜接,我把后臺(tái)的產(chǎn)品設(shè)計(jì)也加入了進(jìn)來(lái)。
1. 后臺(tái)產(chǎn)品功能結(jié)構(gòu)圖
根據(jù)前臺(tái)對(duì)產(chǎn)品功能的定義,本款小程序功能實(shí)際包括兩大塊,一是內(nèi)容的呈現(xiàn),二是用戶(hù)對(duì)內(nèi)容進(jìn)行勘誤和自主上傳。
對(duì)于后臺(tái)來(lái)講,不僅要考慮信息的呈現(xiàn)的問(wèn)題,還要考慮信息的抓取來(lái)源,以及用戶(hù)如何進(jìn)行信息反饋,所以后臺(tái)目前需要包括內(nèi)容管理和用戶(hù)管理兩個(gè)方面,經(jīng)過(guò)整理的產(chǎn)品后臺(tái)初步功能結(jié)構(gòu)圖如下圖所示:
2. 后臺(tái)頁(yè)面及說(shuō)明
(1)?內(nèi)容–內(nèi)容抓取
在后臺(tái)的這一模塊可以設(shè)定前臺(tái)內(nèi)容的來(lái)源和呈現(xiàn)方式。
頁(yè)面定義如下:
1)選擇需要爬取講座信息的學(xué)院,此選項(xiàng)為必選;
2)根據(jù)選擇自動(dòng)帶出所對(duì)應(yīng)的校區(qū),此選項(xiàng)為非必選;
3)選擇該學(xué)院講座信息爬取的網(wǎng)站,不超過(guò)三個(gè)來(lái)源;
4)選擇信息抓取的頻率。
(2)?內(nèi)容—內(nèi)容管理
這一模塊支持對(duì)前臺(tái)內(nèi)容進(jìn)行編輯修改以及刪除。
頁(yè)面定義如下:
1)支持的前臺(tái)呈現(xiàn)的內(nèi)容進(jìn)行篩選,當(dāng)前可按照講座主題、所屬校區(qū)與學(xué)院進(jìn)行篩選;
2)列表字段與前臺(tái)呈現(xiàn)的字段保持一致;
3)點(diǎn)擊學(xué)院名稱(chēng)可呈現(xiàn)該學(xué)院信息,包括學(xué)院官網(wǎng)、信息爬取來(lái)源、教務(wù)老師聯(lián)系方式等;
4)操作“編輯”和“刪除”按鈕實(shí)現(xiàn)對(duì)信息的管理。
(3)?用戶(hù)—用戶(hù)反饋
這一模塊支持對(duì)用戶(hù)勘誤的信息進(jìn)行處理。
頁(yè)面定義如下:
1)支持對(duì)用戶(hù)反饋的內(nèi)容進(jìn)行篩選,當(dāng)前可按照講座主題、所屬校區(qū)與學(xué)院進(jìn)行篩選;
2)列表字段除了前臺(tái)呈現(xiàn)的部分字段以外,還包括反饋類(lèi)型、具體類(lèi)別、備注以及用戶(hù)ID;
3)點(diǎn)擊學(xué)院名稱(chēng)可呈現(xiàn)該學(xué)院信息,包括學(xué)院官網(wǎng)、信息爬取來(lái)源、教務(wù)老師聯(lián)系方式等;點(diǎn)擊用戶(hù)ID可以顯示該用戶(hù)相關(guān)信息,包括昵稱(chēng)學(xué)號(hào)聯(lián)系方式等,方便運(yùn)營(yíng)人員及時(shí)聯(lián)系用戶(hù)核實(shí)反饋信息的真實(shí)性。
4)操作“通過(guò)”和“忽略”兩個(gè)按鈕實(shí)現(xiàn)對(duì)信息的管理。點(diǎn)擊“通過(guò)”,信息即可在前臺(tái)完成更新。
(4) 用戶(hù)—用戶(hù)上傳
這一模塊支持處理用戶(hù)上傳的講座信息。
頁(yè)面定義如下:
1)支持的前臺(tái)呈現(xiàn)的內(nèi)容進(jìn)行篩選,當(dāng)前可按照講座主題、所屬校區(qū)與學(xué)院進(jìn)行篩選;
2)列表字段與前臺(tái)呈現(xiàn)的字段保持一致;
3)點(diǎn)擊學(xué)院名稱(chēng)可呈現(xiàn)該學(xué)院信息,包括學(xué)院官網(wǎng)、信息爬取來(lái)源、教務(wù)老師聯(lián)系方式等,點(diǎn)擊用戶(hù)可以顯示該用戶(hù)相關(guān)信息,包括昵稱(chēng)學(xué)號(hào)聯(lián)系方式等,方便運(yùn)營(yíng)及時(shí)聯(lián)系用戶(hù)核實(shí)反饋信息的真實(shí)性;
4)操作“通過(guò)”和“忽略”按鈕實(shí)現(xiàn)對(duì)信息的管理。點(diǎn)擊“通過(guò)”,信息即可在前臺(tái)顯示。
七、需求排期
mvp產(chǎn)品雖然比較小,但功能的實(shí)現(xiàn)同樣有個(gè)先后的問(wèn)題,經(jīng)過(guò)評(píng)審后的需求排期如下:
八、總結(jié)
我們通過(guò)需求分析、用戶(hù)路徑、產(chǎn)品功能規(guī)劃、頁(yè)面設(shè)計(jì)、需求文檔寫(xiě)作,快速設(shè)計(jì)出了產(chǎn)品前臺(tái)的雛形,并通過(guò)后臺(tái)產(chǎn)品方案的設(shè)計(jì),完成了整個(gè)產(chǎn)品框架的建構(gòu),在后面仍需要和研發(fā)測(cè)試保持溝通,才能讓產(chǎn)品最終上線(xiàn)。
前面提到了mvp產(chǎn)品功能演進(jìn)藍(lán)圖的問(wèn)題,以本款產(chǎn)品為例,如果市場(chǎng)反響還可以,形成一定流量,后面的功能演進(jìn)藍(lán)圖可以包括自習(xí)室,校園問(wèn)答,以及綜合查詢(xún)等等,都可以規(guī)模復(fù)制和推廣到其它院校。
其實(shí)這正體現(xiàn)了mvp 產(chǎn)品的最大價(jià)值:用較小的成本在最短的時(shí)間內(nèi)快速地驗(yàn)證市場(chǎng)和需求。
萬(wàn)物之始,大道至簡(jiǎn),中華道家哲學(xué)早已看透產(chǎn)品思維。
作者:我的鞋子大了,微信公眾號(hào):青芒產(chǎn)品筆記,定位于個(gè)人產(chǎn)品學(xué)習(xí)成長(zhǎng)平臺(tái)
本文由 @我的鞋子大了 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來(lái)自Unsplash,基于CC0協(xié)議
你這個(gè)MVP可不小
而且關(guān)于計(jì)劃的排期過(guò)于樂(lè)觀,肯定無(wú)法按照你的排期實(shí)現(xiàn)
你這個(gè)項(xiàng)目的難點(diǎn)在于信息的收集
所以我覺(jué)得你的最小MVP應(yīng)該是爬蟲(chóng)的覆蓋范圍和內(nèi)容清洗,如果能準(zhǔn)確地抓取清洗出有效數(shù)據(jù),你這個(gè)項(xiàng)目就成功一半
是的哈哈,這只是個(gè)初步的方案,真要上線(xiàn)估計(jì)要和研發(fā)battle好久