一、架構設計和流程設計
我一直追求簡單而高效的設計，尤其欣賞臭魚這一篇文章《為產品結構的設計，為使用者任務的設計》。他用圖1很好的詮釋了這個觀點：首先要保證產品邏輯結果清晰、準確，其次要為使用者任務架起一些快捷操作的橋梁。
圖1 「產品結構設計」和「為使用者任務設計」的關係
好的流程設計能使產品具有更清晰的架構，更良好的體驗。我的老大曾經舉過乙個串珠子的例子，說pm給我們的功能列表都像是一堆零零散散的珠子，而我們要做的，就是把這些珠子串起來，把功能串起來，最後呈現給使用者的才是乙個完整的東西，有著清晰的架構和流程。
這話說起來還是有一些抽象，我想嘗試著通過手機產品登入介面的設計，來跟大家分享我對架構設計和流程設計的思考過程。
二、乙個例子
首先我們來看乙個例子，見圖2：
圖2 乙個小朋友做的登入介面
這個頁面非常有代表性，它很像pm提出的需求列表，雜亂的堆在了介面上。先來挑挑問題所在:
文案不太準確，「帳號密碼」的文案用「密碼」就行了，「登入賬號」按鈕的文案用「登入」就可以了，「離線使用」按鈕，他想表達的是「匿名登入（不需要賬號、密碼）」。
介面上元素太多，需要分辨哪些是自己需要的
層級關係不明，沒有一條清晰的任務主線
沒有考慮到虛擬鍵盤遮擋的問題
相關操作可以離得再近一些，比如忘記密碼跟登入按鈕
三、研究一下架構
那麼我們架構上進行分析，架構上來講，這個介面，主要有三個模組：登入、匿名和註冊，其中匿名可能有兩種情況，這裡表現的是不需要使用者名稱和密碼的情況，如圖3.
圖3 登入頁面架構圖
我們先來分析一下登入和註冊這兩個功能模組。如果使用者要登入，那麼需要輸入使用者名稱和密碼，如果使用者希望以後不用再輸入密碼了，可以選擇記住密碼，如果使用者忘記了密碼，那麼可以給乙個入口讓他去執行找回密碼操作。當然，這些如果都是建立在使用者要執行登入操作之後。
所以可以把這些元素藏起來。所以，既然登入和註冊是平級的，那麼我們可不可以把這個頁面設計成圖4這樣子呢？
圖4 登入頁面採用2個入口的形式，可以選擇登入或註冊
參考案例是foursquare和16fun，見圖5。
圖5 foursquare的登入頁面，只有兩個選項，登入或者註冊
這個方案的優點非常明顯，就是架構清晰，不會有太多的干擾因素，但是缺點也是有的，登入和註冊兩個按鈕還是需要區分一下的，而且這兩個功能過於平級，在不同的產品階段應該有側重才對，比如新產品上線，要更合理的引導註冊，成熟產品，要突出登入。
再來看看匿名這個功能，前文提到，匿名有兩種情況：
1、不需要使用者名稱和密碼，就可以登入
2、需要提交使用者名稱和密碼，但是匿名登入，不讓別人看到
情況1，既然不需要使用者名稱和密碼就可以登入，那為什麼還要先進入登入頁面而不是內容頁面呢？如果你的產品是側重於社群類的，需要使用者登入的，那麼還是要引導使用者登入，如果你的產品是工具類的、內容類的，希望使用者能看到內容，那麼可以讓使用者直接進入到軟體裡，先看到內容，等需要執行一些登入之後才能進行的操作時，才提示使用者登入。
情況2，往往是用在論壇、貼吧等需要匿名發表帖子的情況下，那麼我們只需要在發帖頁面給出匿名發貼的核取方塊就行了，不需要讓使用者在登入介面就直接選擇了。如果是想登入某些論壇，卻又不想暴露**狀態，則可以在登入按鈕按鈕上面增加乙個狀態選擇，如圖6，ｑｑ客戶端。
圖6 iphone版ｑｑ客戶端，登入按鈕上方可以選擇狀態
因為我們這個登入頁面屬於情況1，所以就把匿名登入功能從登入頁面拿掉了。
四、研究一下流程
那麼這個時候，我們要對產品的流程來進行一次深入的思考了，我們的產品，是希望使用者從**來？到**去呢？希望使用者在我們的產品裡完成怎樣乙個任務流呢？
我簡單分析了一下，如果是以引導登入為目的的流程，使用者必須有賬號，只能登入訪問產品，那麼流程大概如圖7這般。
圖7 手機產品登入流程
那麼我們知道了，我們是希望使用者剛進入軟體就遇到這個介面，完成登入之後，到達內容的。如果是這樣，我們是否應該讓使用者可以更快速的執行登入過程，也就是說，把賬號和密碼提到一級，方便使用者快捷的操作。於是我把設計改成了圖8的樣子：
圖8 暴露出賬號、密碼輸入框的登入頁面
參考案例是街旁網的登入頁面，見圖9。
圖9 街旁網的登入頁面，突出登入功能
跟密碼相關的選項，比如記住密碼，忘記密碼，需要放在**合適呢？一般情況下，相關性較大的最好要離得較近。於是我把記住密碼和忘記密碼都放在密碼輸入框底下，但是這時候，又會顯得資訊較亂，解決的辦法是什麼呢？
就是給資訊分組，如圖10。
圖10 把資訊區隔成登入和註冊兩個模組，強化登入
而如果是以內容為主的，登入的目的是完成某些操作，那麼登入頁面往往出現在導航欄上、選單裡，或者是執行某個需要登入的操作之後，以論壇回帖為例，流程如圖11：
圖11 當執行發帖操作的時候，提示登入的流程圖
此時，明顯可以分析出，流程的終結應該不是登入成功，而是執行接下來的操作。與其上來就讓乙個註冊門檻，擊垮了一部分使用者的積極性，還不如，先把內容暴露出來，當你需要執行一些登入使用者才能執行的操作的時候，再引導你去登入頁面，就順理成章，沒有強迫登入的感覺了。這種情況下，可以採用浮層的形式，完成簡單快捷的登入操作，如圖12。
圖12 vimeo的登入頁面，採用浮層的設計方式
當然，也可以呼叫統一的登入頁面，即降低成本，又保持統一。
五、需求，還是需求
之所以碎碎念這麼多，是因為，這乙個看似簡單的頁面，包含了很多的架構、流程上的思考，包含了產品邏輯，最重要的，包含了設計師對需求的把握。
登入頁面，到底要設計成什麼樣子，肯定沒有乙個統一的標準，但是，根據你的產品需求，你可以推斷出，該是怎樣乙個流程，該突出哪些功能，讓我們來總結一下，我感悟頗深的一些點：
1. 告訴我為什麼（為什麼登入？為什麼註冊？）
2. 不要給使用者太多的選擇（太多的選擇意味著太多的思考時間）
3. 讓使用者一條路走到底（流程要有始有終，且不能有太多分支）
4. 跟某個選項相關的東西要跟隨這個選項（比如密碼輸入框和忘記密碼）
5. 內容為主的要弱化登入（在合適的時候提示使用者登入就行了）
6. 架構和流程是兩回事（清晰的架構是基礎，快捷的流程是保證）
關於推廣使用手機登入OA辦公系統的通知
所屬各單位 為了加強資訊溝通交流，拓展馳程新聞宣傳覆蓋面，方便集團公司員工在外出差時可以使用oa辦公系統辦公，提高辦事效率，公司決定向員工推廣使用操作便捷的手機oa辦公系統，該系統具有瀏覽新聞 公告通知 企務公開欄 收發郵件 工作流辦理等日常工作的功能，員工只要在使用手機時登入位址即可完成瀏覽工作。...
從需求到產品規劃
培訓方式 案例分享 實務分析 互動討論 專案模擬 培訓遊戲 參加物件 公司總體辦 市場部門 產品規劃部門 產品研發部門 市場研究部門等 公司產品經理 營銷 產品體系主要管理人員 課程收益 掌握企業實現市場導向的運作模式和要點 學習先進企業在需求管理和產品路標規劃方面的經驗 掌握制定 優化和監控產品線...
手機產品檢驗標準
1.0目的 用於外觀及一般效能檢驗，理論上涵所有檢驗專案。2.0適用範圍 2.1本檢驗標準適用於本公司的移動通訊產品的來料與成品檢驗。2.2若新產品不斷出現或本標準中有此專案未涉及到，應在本標準中加入涉及到的專案或修正標準。2.3下面 中，致命缺陷執行0缺陷。來料驗收的執行的標準是 嚴重缺陷aql ...