移動應用設計：談導航欄返回按鈕的替代方案

　　呼，又要夜間上新了。其實自己偶爾還會進去關於Be For Web裡面看看將近兩年前寫的博客開篇語。當時的動力現在仍在，當時愛的那個世界現在仍在愛，並且越來越讓我覺得自豪;這讓我開心了些。周六晚上有在喝冰啤酒的兄弟姐妹嗎，有的話我們虛擬碰個杯吧先，周末愉快=)

　　前面連續做了13篇iOS7預發布版界面設計規范，這周開始重新回到正常節奏，上一些小文。今次的小話題是關於返回按鈕的;其實還少談了一種越來越普及的替代方案，也就是將返回按鈕做到底部標簽欄或是工具欄最左側;當然，准確的說，這種情況下容器本身也不能再叫做標簽欄或工具欄了。那開始吧。

　　這裡進入譯文。我(英文原文作者)愛iPhone5，那多出來的640×176像素的空間非常有用。不過我時常會在點擊那個最重要的按鈕時遇到麻煩，是的，就是返回按鈕。UX設計當中有一條規則，如果某個功能是很常用的，那麼它應該被放在最容易點擊到的位置上。

　　49%的移動用戶在使用手機時是單手操作的，這就意味著每兩個用戶當中就有一個會每天多次通過單手來點擊返回按鈕;算起來的話這可是數以億計的點擊率。如果手機尺寸略大，那麼你將不得不使用另一只手來點擊返回按鈕。我猜這也是很多安卓手機會在左下角放置硬件返回按鈕的原因之一;不過這種解決方案也不是最優的，因為在安卓平台中，應用內的“返回上一級”按鈕與硬件返回按鈕的功能還是有所區別的。

　　通過手勢來解決問題

　　要解決返回按鈕的問題，最簡單的方案就是使用手勢。在用戶已經熟悉了應用操作方式的前提下，手勢還是很有效的。另外，將手勢操作作為可視化按鈕的一種補充形式也是不錯的做法。

　　讓我有些驚訝的是，在試用了無數個應用之後，我發現市面上已經有很多產品在通過這種方法解決返回按鈕的問題了。當然，沒有哪種解決方案能適用於所有的情況，但至少這是個開始。我個人真心希望設計師們能夠逐漸找到更多更有創意的方案。

　　拋甩(toss)

　　“拋甩”是對我們與真實物體之間互動方式的一種隱喻，使用這種模式，你可以很輕松地將當前的活動界面“甩開”。例如在Letterpress中，用戶可以通過向下快速滑動的手勢將彈出提示甩走，有點意思。

　　在Facebook裡，當你全屏查看一張圖片時，可以將圖片向上或向下甩開，回到之前的界面當中。

　　橫向滑動

　　新界面從屏幕右側向左滑入視圖，這是iOS當中的標准動效。相應的，我們也可以通過向相反的方向執行輕掃來導航回之前的界面，例如你可以在Pinterest當中通過向右輕掃的手勢將大圖界面向右移走，回到之前的界面。

　　類似的，在Flipboard裡，你也可以在某主題下的內容界面中通過向右輕掃回到主界面。

 

　　在iBooks中，並沒有明確的視覺指引告訴你可以通過左右輕掃的手勢來打開下一頁或回到上一頁。不過除了輕掃以外，點擊屏幕的左右兩部分也能 起到同樣的導航作用，這樣，由於缺乏視覺指引所導致的導航功能不可發現的概率就大大降低了。而且由於翻頁效果使用了強有力的隱喻，所以一旦用戶通過點擊屏 幕完成了一次翻頁操作之後，很容易根據漂亮的翻頁動效來發現左右輕掃的導航功能。

　　縱向拖動

　　與橫向滑動的初衷相似，如果某些界面是從屏幕底部或頂部向上滑入視圖的，那麼可以嘗試使用縱向拖動的方式來進行後退導航。Day One應用就打造了這樣一套屬於他們自己的“下拉刷新”，使用戶可以在縱向的操作中直接進入之前或之後的一篇內容。

　　在Clear裡，你可以通過向下長拖動來回退到上一級列表，而向下短拖動則用來創建新的事項。

　　而Haze允許用戶通過向下拖動界面來進入設置界面;當然嚴格的講這不屬於“回退”方面的導航操作。

　　長按或雙擊如何?

　　長按和雙擊都是可以由拇指獨立完成的操作，所以我個人覺得它們將來有可能在回退導航上體現出價值。

　　從視覺和布局的角度解決問題

　　誠然，按照iOS設計規范所要求的那樣將返回按鈕放在導航欄左側，看上去是最自然的。但這不能阻止我們在必要的時候完全改變返回按鈕的視覺樣式或位置;它甚至可以看上去不那麼像個按鈕。

　　Basecamp將待辦事項內容界面設計成半覆蓋的面板形式，用戶點擊左側未遮蓋的空間即可將面板向右收起，返回到之前的界面。

　　如果內容類型適合，我們確實可以像Basecamp那樣將子界面處理成某種覆蓋層或面板的形式，並使用“完成(Done)”按鈕進行關閉，返回上級界面。完成按鈕可以被放置在界面右上角，相比於左上角的位置，更容易被點擊到。

　　總結

　　除非蘋果推出一款更纖細、邊緣更薄的手機，否則我個人還是建議設計師們能夠抱著更開放的心態來看待使用手勢執行常規操作這件事。如果你能充分理 解交互對象的運動方式以及人們對這些運動規律的認知，並將這些理解體現到設計當中，那麼手勢會成為非常高效和符合直覺的操作方式。作為設計師，我們必須清 楚人們在實際當中是怎樣使用手機的，只有這樣，才能設計出讓人們愉悅而不是感到受挫的產品。

　　本站原創編譯文章。如需轉載，請注明：本文來自Be For Web

　　英文原文:

　　譯者信息: c7210 - UX玩家、交互設計師、曾經的視覺與前端、貓奴、guitar fucker...現就職於攜程無線事業部。