手機WordPress網站登入介面如何設計-站群WordPress網站建設手機登入介面設計

一個合格的註冊登入頁面，應該是具有清晰的操作流程，良好的互動細節和不錯的視覺設計。

WordPress APP 的註冊登入有四種情況。

► 一是不需要註冊登入（不需要註冊登入也提出來？是不是作死~）

系統自帶的工具類 WordPress APP，像經常使用的鬧鐘、日曆、計算器等等；一些簡單的第三方 WordPress APP：開眼，樂流，榫卯等。

這些 WordPress APP 的特點都是功能相對單一，比較『輕』，不需要多使用者資訊就能使用所有功能，所以就不需要註冊登入這個環節。

► 二是第三方賬號登入

多使用者不需要輸入註冊登入資訊，直接選擇一種第三方賬號就能完成登入。國內常見的第三方賬號有微博、 WordPress 微信、 QQ 、豆瓣、人人等，國外常見的第三方賬號有 Facebook，Twitter，Google 等。

現在國內除了超級 WordPress APP 之外的 WordPress APP 基本都支援第三方賬號登入，這樣能簡化多使用者註冊登入的流程，提高 WordPress APP 的留存率。

► 三是郵箱註冊

開始的時候註冊登入是基於 PC 的，也就是基於網頁。所以郵箱註冊自然而然成為主流，而且註冊過程中需要驗證郵箱也很方便，多使用者直接在 PC 就可以完成所有操作。

現在很多 WordPress APP 依然保持著郵箱註冊的方式。

► 四是手機註冊

隨著移動網際網路的到來，人們觸網的主要裝置已經從 PC 逐漸轉移到手機。

加上手機號碼的實名制、全球通業務的普及，使得手機號碼也具有了標示性。

並且 WordPress APP 是基於手機的。

所以用手機號碼註冊 WordPress APP，等透過簡訊的方式驗證，也逐漸成為了主流。

WordPress APP 的優秀與否，由很多因素決定，而良好的互動細節是每一個優秀 WordPress APP 的共同品質。只有從使用場景出發，並從多使用者的視角來思考產品，才能設計出打動人心的 WordPress APP 。

► 用顯示/隱藏小 icon 代替輸入兩遍密碼

為了確保密碼輸入正確，很多 WordPress APP 需要多使用者輸入兩遍密碼來確定密碼輸入無誤，但這無疑增加了多使用者的工作量。解決方式便是在密碼輸入框右邊增加一個顯示/隱藏小 icon，讓多使用者在輸入完一遍密碼後可以選擇點開顯示/隱藏小 icon 來確保密碼輸入無誤，減少多使用者的工作量。

► 彈出相對應的輸入鍵盤

點開郵箱輸入框，彈出帶有 @的英文輸入鍵盤。

點開手機號輸入框，彈出九宮格數字輸入鍵盤。

點開密碼輸入框，彈出英文輸入鍵盤。

這是很小的細節，雖然多使用者可能不知道哪裡不對，但是他能體會到好不好用。一個 WordPress APP 注意了這點，那多使用者就會覺得這個 WordPress APP 好用。而兩一個 WordPress APP 沒有做到這點，無論點選哪個輸入框彈出的都是九宮格中文輸入鍵盤，多使用者就會覺得這個 WordPress APP 不太好用。

作為設計師，要知道多使用者覺得不好用的原因是什麼，這樣才能對症下藥，改善多使用者體驗。

► 對手機號碼進行 3 4 4 的分佈。

這個規則不僅適用於手機號碼，包括銀行賬號、轉賬金額等等。

這是因為人的短期記憶是有限的，即一次只能記住有限的東西，如果強制記住很長的東西，短期記憶就很容易出錯。

所以將數字以 4 或者 3 為單位分組，有利於多使用者閱讀和編輯數字。

► 登入時增加一鍵清空 icon 。

在登入的時候偶爾會出現輸入錯誤，如果沒有這個清除的 icon，我們只能按鍵盤中的清楚按鈕，需要一直按住知道輸入框為空。

一個只需要點一次就能清空，一個需要長按一段時間才能清空，孰優孰劣可想而知。

► 清晰的錯誤反饋。

當多使用者輸入錯誤資訊時，知名彈出臨時框提示多使用者。而不是不做反應讓多使用者自己去猜到底是怎麼回事。

臨時框也有兩種形式，一種是左邊，需要多使用者點選確認才能進行下一步操作。一種是右邊，彈出一兩秒後自動隱藏。個人更傾向於第二種形式，因為種形式相當於強制中斷了多使用者的操作，多使用者需要點選確認才能回到原來的操作流程。

我相信還有很多好的互動細節，大家可以自己平時積累。讓您的設計逼格越來越高，多使用者體驗越來越牛逼。