每一個表單設計的頁面都有一個特定的目的，或是吸引註冊，或是達成交易。
當我們在享受手機App為生活帶來的巨大便利時，無形中已經經歷了多種多樣的移動表單設計形式。而表單設計又是移動應用設計中與用戶產生最多交互的步驟，包括用戶註冊、訂閱服務、用戶反饋、問卷表單、買賣交易等等。一個優秀的表單設計更有助於提升用戶體驗，提高轉化率，達到更好的營銷效果。
每一個表單設計的頁面都有一個特定的目的，或是吸引註冊，或是達成交易。考慮不周甚至是錯誤的設計有可能會導致用戶的流失或交易失敗。因此，我們需要了解一下表單設計的基本原則，避免自己在做設計的時候踩地雷。
1. 邏輯清晰
表單是同用戶進行溝通的語言。和任何對話一樣，它應當以符合邏輯的方式幫助雙方完成交流。
2. 儘量使用單列設計
多列的表單容易容易讓用戶漏填，無法集中精力完成填寫。而單列的表單填寫路徑單一、直接、相比而言更為高效。
3. 減少輸入
表單越長越複雜用戶完成整體表單的意願就越低 – 尤其是在小屏幕上。最大限度地減少輸入字段數，使你的表單載入更快速，尤其是當您向用戶索取大量信息的時候保持表單越簡短越好。
4. 提供合適的輸入方式
在輸入賬號、密碼，填寫郵箱，輸入暱稱等，均需提供不同的鍵盤，儘量減少輸入錯誤，幫助用戶快速完成填寫。
5. 避免將標籤作為佔位符使用
有一種設計模式是讓標籤作為佔位符置於輸入框中，當用戶點擊輸入時候就自動消失。這種設計固然簡約，但是用戶在輸入的時候很容易忘記他們需要輸入的字段是什麼，也會產生問題。
移動端表單設計案例欣賞
1. Dropbox by Sam Atmore
設計原則：登陸、註冊頁面輪播展示
明確的CTA提示
在Sam的這個登陸/註冊的表單設計中，登陸和註冊的邏輯非常清晰。
一是單列的二選一表單設計。用戶在開始使用App之前，只需要在兩個可選項中選擇其中一個，隨標籤提示進行下一步操作。即便是誤觸，也可以通過簡單的輪播圖滑動效果選擇另一個選項。
其次，登陸和註冊頁面的CTA按鈕表述非常明確，讓用戶明確行為的意圖和功能，具有強烈的引導作用。
2. Location Switching - by Nimasha Perera
設計原則：智能自動填充選項
表單設計中越來越融入科技化的元素。例如利用自動定位功能，可以根據當前位置進行信息智能填充。這項操作為用戶省去了地理位置選擇，以及貨幣轉化的過程，節省了不少的時間和精力。而在傳統的定位表單設計中，面對位置切換，往往是一長串的城市名，經常令人眼花繚亂。
2. Form Validation - by Emmanuel Torres
設計原則：明顯可見的提示信息
用戶在登陸或註冊的過程中，理想狀態是完成信息填寫並提交。但實際操作中錯誤無可避免。所以我們的表單設計需要考慮到可見的、有辨識度的信息提示，及時提醒用戶信息填寫錯誤。而不是在他們完成全部信息填寫之後再告訴他們出錯了。
4. Show/Hide Password - by Claudio Scotto
設計原則：密碼提示及忘記密碼提示可視化
用戶經常遇到的另一個問題是忘記密碼，因為大多數密碼輸入字段由於安全原因會被屏蔽。
建議採取的措施是在密碼字段旁邊添加一個“顯示密碼”複選框或圖標。 一旦用戶點擊它，他們將會取消屏蔽密碼並查看他們錯誤的位置。此類設計對於移動端的小鍵盤簡直是完美設置。
5. Explain Everything by Anny
設計原則：標籤設計圖標化
移動端表單設計樣式中，有一種設計方案是是將標籤設計成圖標，這樣一來畫面就顯得靈活而且更加簡潔。因為圖標的提示作用，輸入框已有輸入內容時用戶也能很清楚已經輸入的是什麼字段的內容。而底部的多平臺關聯註冊方式也為用戶提供了更加簡便的註冊方式。使得用戶能更便捷的完成應用註冊。Mockplus設計的這款應用原型將兩者融合在一起，也是一個非常明智的表單設計選擇。
作為一款既適用於移動App設計也適用於網頁項目設計的原型工具，Mockplus在表單設計的環節有其獨特的優勢。表單設計所需要的元素都能在軟件中輕鬆找到。例如，佔位符，圖標，輸入框，數字鍵盤等等。
結語：
無論是填寫移動端表單還是網頁表單的時候，用戶的猶豫是不可避免的。作為設計師或開發人員，學會將這個過程變的便捷而輕鬆，達成設定目標才是最終的目的。我們應當讓表單設計成為優勢，而非弱點。一個高度有針對性的表單設計，貼心細緻的細節和體驗，堅持不懈的改良和調整，高效快速的提交，順暢的流程，這些才是優秀表單應有的樣子。
閱讀更多 UI設計創意分享 的文章
