登入註冊功能PRD的正確書寫方式
阿新 • • 發佈:2019-01-05
登入註冊功能需求文件【PRD】:
一、功能優化/開發原因
APP登入頁面更改:由於APP登入介面,登入按鈕不突出,並且我們的標準使用者為年齡較大的網際網路低頻人群,學習、記憶能力較差,因此對登入介面UI進行更改並加入簡訊快捷登入。
二、更改模組涉及到的資源
登入頁面問題:IOS、安卓、PHP
三、參考競品:
登入頁面:喜馬拉雅、騰訊課堂、得到、混沌大學、淘寶、京東、百度外面、美團等。
四、使用者端產品需求說明
登入頁面更改:
1. 使用者使用流程圖
2. 頁面說明
2.1 登入首頁
設計更改說明:原登入頁面中手機登入、註冊不易被人發現和使用,微信登入按鈕完全融入背景圖片很多使用者不知道它是按鈕,因此產生了一些使用問題,故先對登入註冊頁面進行更改。更改原型參照騰訊課堂、混沌大學、喜馬拉雅,將微信登入按鈕和手機登入按鈕設為同等重量按鈕,並給與微信登入加以顏色,推薦微信使用者使用微信登入。更換背景並加上創業logo樹立品牌形象等。
(1)提示文字
功能說明:對使用者起到提示及引導作用。
互動說明:對登入這次數不同的使用者進行區別提示,首次推薦使用微信,再次登入需要告訴使用者他上次使用的是那種登入方式。
例子:
- 使用者首次登入:微信網頁購買使用者,請使用微信登入。
- 使用者再次登入:您上次使用的是“微信登入”。
(2)微信登入按鈕
- 功能說明:點選吊起微信登入驗證。
- 互動說明:按鈕需要有點選前、點選時,兩個狀態方便使用者知道自己已經點選按鈕。
點選前,點選時
手機登入按鈕:同微信登入按鈕。
(3)註冊、隨便看看:
功能說明:
- 點選註冊跳轉註冊頁面。
- 隨便看看為返回按鈕。
互動說明:點選前字型為橙色,點選時字型為灰色。
2.2 手機登入詳情
設計說明:在使用賬號登入過程中我們發現有很多使用者記不住自己的密碼,因此我們再次更改中加入簡訊驗證登入。
1)賬號登入、簡訊登入tab:
- 功能說明:用於使用者快速切換簡訊登入/賬號密碼登入。
- 互動說明:使用者點選另一個登入種登入時,文字下面的橫線和文字背景顏色塊進行左滑或右滑,同時登入驗證內容進行更改。
2)登入按鈕:(同微信登入按鈕略)
3)驗證碼:
功能說明:獲取/填寫簡訊驗證。
互動需求:
- 點選獲取驗證碼時:文字變為灰色。
- 點選後:文字變為“重新發送 60秒”,並且文字顏色為灰色切不可點選。
- 使用者手機收到驗證碼後,自動填入驗證碼框中。
2.3 註冊頁面
設計說明:對比原註冊頁面,將完成按鈕下移至主按鈕位置。更改原因,由於我們的使用者年齡較大,主按鈕更容易讓使用者看到並點選。
完成按鈕:
功能說明:略
互動說明:
- 使用者填完資訊前,按鈕為灰色背景切不可點選。
- 使用者完成資訊填寫,按鈕為上圖狀態,可以點選。
- 使用者點選時,按鈕再次變為灰色,卻不能點選。