iOS的UI元素導航欄里的完成按鈕的優化

發表日期：2015/8/12 11:49:18 文章編輯：瀏覽次數：2674

iOS中很多代表“完成”操作的按鈕時常被置于導航欄當中右側的位置，包括表單界面的提交按鈕也是如此。如今這種模式也開始潛移默化的影響到一些Android平臺里的app。

根據我們的可用性測試所得出的結論，不說跨平臺的影響力，單就iOS本身，我們也不建議將“完成”性質的按鈕放在這里，原因很簡單，將最終操作放置在界面頂部，有悖于自上而下的信息流向。用戶在填寫表單或編輯內容時，交互行為通常是由上至下的，當他們即將完成的時候，也會預期在結尾處看到結束處理的操作。多數情況下，當人們無法在結尾處找到這樣的功能時，便會產生迷惑并開始四處尋找。

在下面的案例當中(左側是Pinkberry，右側是Nordstorm)，用戶填寫完表單之后需要點擊登錄或下單按鈕。這樣的布局就是我們所說的有悖于自上而下信息流向的形式，用戶的全部注意力都隨著表單而逐漸下移，最終發現在結尾的地方沒有任何完成操作，剩下的就是茫然無措。要知道，即使是在手機這樣的小屏設備上，四處尋找某種UI元素也是需要耗費很多額外的注意力成本的；將完成按鈕直接放置在內容底部是最符合直覺的做法。

當然，從另外一個方面講，將完成按鈕置于導航欄當中的模式也有其自身的優勢：因為網頁設計導航欄是固定在頂部的，所以用戶在編輯內容時可以隨時點擊到，而且當內容區域較長時，放置在頂部的按鈕也不會被鍵盤所遮擋。如果用戶確實無需完成全部內容的填寫便可以進行完成操作，那么你可以考慮將完成按鈕固定在底部，并會隨著鍵盤的起落而相應的移動。這種方式的缺點是會占用一定的縱向空間，但優點也是很明顯的：即符合直覺，又隨時保持可見，同時相比于頂部右端的位置來說，更易單手點擊操作。