從登錄註冊，看產品經理如何寫產品需求文檔和交互設計

上文《從用戶需求到產品需求，產品經理的苦逼開始》提到了登錄註冊的例子，從用戶角度看，這種需求的背後是身份認同。但登錄註冊的需要，還有更多的內在原因，暫不展開討論。

這次我們來看看，產品經理如何寫登錄註冊的需求，讓程序員哥哥們愉快地實現（呃，好吧，這個……一言難盡）

產品需要提供登錄註冊的功能，可以這麼考慮：

1、產品是用戶移動端還是Web端？

2、登錄註冊需要用戶填寫哪些信息？

3、正常流程有哪些步驟？

4、異常情況有哪些？網路的、用戶操作的、伺服器的

5、如果情況複雜，是否需要畫流程圖？

6、線框圖需要涉及到哪些元素？元素如何布局？

7、交互設計，元素在正常和異常情況下如何交互？狀態如何轉變？轉變的條件是什麼？

這裡我們簡化一下，假定這樣的場景，產品用在Web端，用戶註冊需要提供郵箱和密碼，因為需要對用戶郵箱的有效性進行驗證，還增加了驗證碼的輸入。

頁面元素

很自然的，頁面元素包括郵箱輸入框、密碼輸入框、驗證碼發送按鈕、驗證碼輸入框、信息提示文本、註冊按鈕。

元素布局

元素布局，除了要考慮美觀，更要考慮合理性。

下面兩個布局，B會顯得好些，一是錯誤信息提示的位置更容易讓用戶定位，二是發送驗證碼緊接在郵箱輸入後，更能體現信息的親密性，並且眼球從上往下瀏覽信息，發送驗證碼無須對密碼的正確性進行校驗。

註冊流程

用戶輸入郵箱——>發送驗證碼——>郵箱收到驗證碼——>輸入驗證碼——>輸入密碼——>註冊

我們看到，用戶發送驗證碼後，需要登錄之前輸入的郵箱去獲取驗證碼，然後回來輸入驗證碼繼續後面的流程。這意味著用戶不得不離開當前頁面，操作的連貫性被割裂，因此是有損用戶體驗的。

為了驗證用戶郵箱的有效性而犧牲用戶體驗，需要進行權衡。

比如這個有效性驗證是否必要？如果是，還有別方式可行？又或者是不採用郵箱，而使用手機驗證？畢竟手機接收驗證碼，起碼不需要登錄郵箱，接收也及時。但另一方面，手機接收驗證碼，意味著要藉助運營商簡訊服務，是否必要？

在網路信號不好的情況下，騰訊郵箱會告知用戶，以簡化版的方式顯示內容，這是典型的功能優先的思路。很簡單，產品都沒法用了，你給用戶多漂亮的界面有啥用？這就是騰訊產品經理權衡的結果。

交互設計

確定好了註冊流程，現在需要考慮信息、操作的交互了。

用戶一進入註冊頁面，我們會想著如何盡量減少用戶的操作，去除干擾因素，讓用戶以最短的路徑達到註冊的目的。

就像網路購物，一旦到了支付階段，步驟都是非常簡潔的，目的很明確，就是讓用戶支付下單，即使用戶此時返回，還一再挽留提示。

在這個頁面，要考慮：

1、首先游標會自動Focus在郵箱輸入框，這樣用戶就不需要移動滑鼠，然後在這裡點擊了；

2、用戶輸入時，郵箱的格式需要進行合法性判斷，郵箱是否已被註冊，是否為空；

3、對於郵箱的判斷，是由發送驗證碼按鈕觸發判斷？還是由註冊按鈕判斷？還是兩者兼之？

4、驗證碼輸入框初始狀態置灰，在發送按鈕點擊前不可用，可以有效規範用戶操作的先後順序；

5、點擊發送按鈕，先對郵箱進行判斷，可減少無效的郵件發送，也能告知用戶郵箱輸入出了問題；

6、發送按鈕點擊後，郵件是不是一定能夠到達用戶郵箱，有可能因為網路狀態或者郵件伺服器的問題，導致沒法送到，這時候需要重新發送；

7、重新發送，是不是馬上就能再次點擊，如果是這樣，用戶就有可能不停地點擊按鈕，導致多餘郵件；那麼中間需要時間間隔，多久才合理？

8、驗證碼是由什麼組成？字母？數字？多少位的？以什麼規則生成？

9、每一次的發送，驗證碼是不同的還是相同的？如果是相同的，那驗證碼的有效時長是多久？

10、密碼是由什麼組成？字母？數字？能包含哪些特殊字元？長度範圍如何？

以上種種，還沒考慮網路狀態、伺服器狀態、用戶信息填寫到一半，從瀏覽器返回，或者刷新頁面的情況。所以你看，對於像註冊登錄這麼習以為常的功能，產品經理需要這麼細緻地去考慮。

有人說，產品經理大概是需要人格分裂的，為啥？因為一方面要像小白用戶一樣，想著產品如何簡潔好用，讓用戶無須思考，還要用得爽，另一方面又得思考產品的內在邏輯，為什麼這麼做？這樣做是正確的嗎？有更好的嗎？怎麼取捨？整個產品設計，是邏輯完備的嗎？凡此種種。

這其實需要費很大的功夫，追求產品的簡潔，追求對用戶的友好，是需要深入複雜之後，真正了解隱藏的挑戰，去除多餘，保留精華後給出的解決方案。

簡潔是終極的複雜。

——喬布斯

總結

最近嘮嘮叨叨，寫用戶需求、寫產品需求，再到舉例如何寫用戶需求文檔和交互設計，都圍繞以用戶為中心的基本思路。

根據《用戶體驗要素——以用戶為中心的設計》的觀點，產品要圍繞用戶體驗而設計，好的用戶體驗要從五個層次去考慮——戰略層、範圍層、結構層、框架層、表現層。以這五個層次對應產品經理的工作，大概是這樣的：

戰略層，進行用戶研究和用戶需求分析；

範圍層，進行產品需求提煉；

結構層，對產品進行概念設計和信息架構；

框架層，對產品進行界面設計、導航設計、信息設計，輸出產品線框圖；

表現層，產出產品交互原型，通常是一些高保真原型。

從用戶需求到產品需求，最後輸出產品需求文檔，勢必要經過以上從抽象到具體的過程。這樣，產品經理對於產品的理解，才有可能一以貫之地體現以用戶為中心。即，

以用戶的角度看待產品，關注產品如何被用戶使用，綜合考慮用戶的使用環境和場景，從用戶的心理感受和行為出發，考慮用戶有可能採取的每一個行動的每一個可能性，並試著去理解這個過程中用戶的期望值。

正如加瑞特說的，

成功的用戶體驗，就是能預知用戶期望並將其納入設計之中。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！