PRD:註冊登入功能文件
編輯導讀:登入註冊對於大部分app來說,都是最基礎的模組,但設計一個好的登入註冊系統並不輕鬆。本文作者透過對比幾款APP的登入註冊功能撰寫了一份註冊功能PRD,包括版本管理、流程圖、互動設計、互動原型、文件說明,與大家分享。
登入註冊幾乎是所有APP都會有的功能,隨著APP的發展和設計,介面形式也從擬物到扁平再到精細化發展。登入註冊也有了越來越多的設計表現,同時許多APP也擴充套件了更多的第三方登入。
透過對比以下幾款APP的登入註冊功能,按常用格式撰寫了一份註冊功能PRD,包括版本管理、流程圖、互動設計、互動原型、文件說明。
登入註冊功能需求文件【PRD】:
使用者在使用APP的過程中,如果建立賬號,可以方便對自己建立的資料和資訊進行管理,如果使用者不喜歡建立賬號,喜歡單機使用,也可以為使用者建立遊客模式,在建立賬號的情況下,也可以使用產品的部分功能。
另一方面,公司獲取使用者使用產品過程中的行為資料後,可以為使用者提供更好的服務,甚至是結合使用者特點的個性化的服務。因此建立賬號是必不可少的。
吸引一個新的使用者來註冊使用的過程中,如果使用者遇到了阻礙,容易使新使用者流失,怎樣讓使用者方便快捷地註冊賬號,從而開始嘗試使用產品呢。總結了其他產品的登入註冊的設計方式,嘗試了以下設計——將首頁簡化為兩個重點,產品提供什麼服務,透過哪些方式可以獲取產品的服務。
首先在未登入的頁面透過產品或品牌Logo展示這是一個什麼產品,可以為使用者提供什麼服務。其次在頁面中心提供最主要的獲取途徑,密碼登入或簡訊登入。最後,輔以其他更多登入方式或功能。為使用者簡化資訊複雜度,降低使用者註冊負擔。並且,使用過程中的每個頁面,都保持頁面簡潔,內容第一。
不同的使用流程決定了產品不同的流程設計,不同的流程設計決定了不同的程式設計。在登入註冊中,使用者可以選擇透過三種方式登入,使用者密碼登入,簡訊登入,第三方登入。
不同的登入方式相應地有三種不同的登入流程圖。在前期預先了解產品的使用流程可以使設計和開發可以提前瞭解到相關資訊,並考慮設計與實現,有助於團隊高效協作。此外,如果遇到不能實現的功能,還可以提前商量解決,如第三方介面的協調。
登入流程圖:
找回密碼流程圖:
頁面流程圖:
頁面流程圖可以幫助明確使用者在完成任務的過程中,有哪些可能的使用方式,從而使使用流程被具體化,並展示了頁面之間的聯絡和銜接。
文件說明:
前置條件:使用者點選“簡訊登入”按鈕,進入手機驗證頁面
後置條件:完成“登入”操作,若是首次登入,進入資訊資料頁;若不是首次登入,進入首頁
手機驗證頁面描述:
注:所有表單不允許錄入空格等特殊符號
對手機號碼輸入的不同情況,產生不同的Toast提示,可以選用以下文字提示。
手機號正確填寫的情況下,對驗證碼輸入的不同情況,產生不同的Toast提示。可以選用以下文字提示。
文件說明:
前置條件:使用者點選“使用者登入”按鈕,進入使用者密碼登入頁面
後置條件:完成“登入”操作,進入首頁
使用者密碼登入頁面描述:
注:所有表單不允許錄入空格等特殊符號
對手機號碼輸入的不同情況,產生不同的Toast提示,可以選用以下文字提示。
手機號正確填寫的情況下,對密碼輸入的不同情況,產生不同的Toast提示。可以選用以下文字提示。
手機號正確填寫,忘記密碼或想要重置密碼,也可以透過頁面中的
來找回按鈕。在設定密碼頁面,手機號和驗證碼都正確填寫時,可以根據不同的密碼輸入提示使用者。
文件說明:
前置條件:使用者點選選擇第三方登入,分別進入不同的授權頁面
後置條件:完成“登入”操作,若是首次登入,進入手機號繫結頁;若不是首次登入,進入首頁
第三方登入頁面詳細描述:
在點選第三方登陸頁面後,點選確認,授權第三方登入。
在驗證原型的過程中,可以發現一些使用過程中的問題,並進行記錄。最後附上兩個互動原型及其使用說明。
簡訊登入互動原型:
使用說明
- 點選簡訊登入
- 手機號為空,點選“獲取驗證碼”
- 輸入手機號“139”,點選“獲取驗證碼”
- 輸入手機號“139”和驗證碼“456789”,點選登入
- 點選“跳過”跳過,返回初始頁面
可以按提示操作使用以下原型http://dwz.date/bNzQ。
密碼登入互動原型:
使用說明
- 點選使用者登入
- 輸入手機號“139”,點選登入
- 輸入手機號“139”,輸入密碼12313,點選登入
- 輸入手機號“139”和密碼“426152”,點選登入
- 點選“我的”,點選“退出”返回初始頁面
可以按提示操作使用原型http://dwz.date/bNzr。
本文由 @candy 原創釋出於人人都是產品經理。未經許可,禁止轉載。
題圖來自Unsplash,基於CC0協議。