起點課堂會員權益
職業(yè)體系課特權
線下行業(yè)大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業(yè)技能直播
會員專屬社群
榮耀標識“返回”功能應該怎么設計
本文作者對返回功能進行了一些思考和分析，與你分享，enjoy~
前幾天在 b 站上看郭德綱的相聲，在下面看到一個推薦視頻就點了進去，看完之后點「返回」想繼續(xù)看之前的相聲，結果發(fā)現直接回到了搜索結果頁面，把剛才那層給跳過去了。
我自己也是 b 站老用戶了，怎么會遇到這個情況？我就拿小米和三星手機看了一下，發(fā)現返回的是相聲頁。難道是版本的原因？我又把兩個手機中的 b 站都升級到最新版本，發(fā)現小米和三星都是一層一層的返回，而 iPhone 則是直接回到搜索結果。這到底是怎么回事，我現在也沒搞懂。我也索性寫篇文章來專門聊一聊返回功能。
需求分類
任何一個功能的提出都是基于用戶的需求。那么為什么用戶需要「返回」呢？簡單來說，返回可以給用戶提供了一個離開當前頁面的路徑，回到上一個頁面。而「上一個頁面」可能是上一層級，例如從三級頁面回到二級頁面，這個屬于層級返回；也有可能是同一層級，例如購買理財項目到輸入短信驗證碼的時候突然想更改購買金額，可以點擊返回，這屬于任務流返回。
當然了，這種分類方式不一定準確，因為有的時候它既屬于層級返回，也屬于任務流返回。
交互設計
分類好了，我們再來了解一下最常見的返回樣式。在界面左上角加箭頭 icon 是我們最常見的返回樣式，這么用沒人敢說你不對。我們還可以在旁邊加上文字，讓用戶知道返回的路徑。
這種返回的樣式，基本可以應付大部分的用戶需求。但是有些特殊情況，我們還是要仔細斟酌的。
就以上面這個理財產品購買流程為例，這是一個任務流。假定用戶需要5步才能完成購買理財產品的操作，如果用戶在第4步的時候點擊了返回，有兩個可能：
- 用戶想更改購買金額或者重新確認利率，周期等產品信息；
- 用戶不想買了。
如果是第二種，用戶一步步的返回就會很累。所以當用戶處于一個任務流中，一旦用戶點擊了返回，我們可以考慮給用戶提供關閉的功能，讓用戶可以快速地離開。當然也不止是任務流，如果用戶處于層級過深的情況下，我們也可以給用戶提供關閉功能。
關閉功能在不同的階段有不同的叫法，在任務流的終點，我們稱之為「成功」。
設計師需要考慮不同的使用場景，例如當網絡狀況不佳的時候，新頁面遲遲加載不了。我們應該給用戶提供一個關閉功能，要不然像圖上的這種，用戶只能選擇退出產品了。當然這個案例是開發(fā)的鍋，返回功能應該是提前渲染好的，就像微信這樣。所以一個產品要做好，設計師必須關注開發(fā)的還原度。
滑動手勢
不管是返回，關閉還是完成，用戶想離開當前的狀態(tài)（頁面或者彈框），都必須要點擊 icon 或者文字。這樣會不會太單調了？我們可以嘗試引入其他的手勢。
以網易云音樂為例，如果用戶想查看歌曲評論，需要點擊「評論」icon，進入評論列表，然后再點擊「返回」回到播放界面。但是在蝦米音樂，歌曲評論的打開和收起只需用戶上下滑動就能完成。當然設計師們怕步子太大，用戶一下子接受不了，還是展示了 icon，用戶通過點擊 icon 也能返回。
這種新的嘗試我非常的認可，因為它不僅豐富了返回的實現場景，還開拓了新的維度。用戶對于操作流程「前后」的認知還停留在「左右」這個階段，例如在 iPhone 中，用戶可以通過右滑返回到上一個頁面。突然發(fā)現上下滑動也能完成返回的功能。這樣可以給我們在接下來的交互設計中提供一些新的思路。
而且從易用性的角度來說，滑動比點擊更受到用戶的喜愛。因為點擊的區(qū)域很小，特別是放在界面左上角，單手操作和大屏手機的用戶拇指很難直接觸及到，需要更改手機握持姿勢或者改為雙手操作?？赡軙腥苏f，安卓有物理的返回鍵，用戶也很容易操作，簡直完美。
對于這個問題，我覺得這體現了安卓和 iOS 的兩種不同的思路。我們都知道 iPhone 的一大革命性突破就是拋棄了物理鍵盤，引入虛擬按鍵，增加了屏幕面積。而去年發(fā)布的 iPhone X 則直接把 HOME 鍵也給去掉了，整個底部的空間也解放了出來。這讓我想起了08年上高中的時候，父母給我買了第一部手機，當時如果想放大照片必須點+號，現在照片的放大縮小都完全依靠手勢了。所以我在想會不會有一天手勢完全取代了按鈕。
當然任何創(chuàng)新本質都是打破原有的規(guī)則，挑戰(zhàn)用戶的固有認知，增加用戶的學習成本。以上面的蝦米音樂為例，即使引入了手勢，還是保留了返回按鈕，給用戶一個過渡的時期。
手勢的引入可以節(jié)省界面的空間，但是我們通過其他的方法也能達到這個目的。下圖就是一個很好的例子。
上面提到了安卓和 iPhone 的差異性，所以我們在設計過程要充分考慮不同的操作系統和機型。我可以給大家再舉一個例子。
在 iPhone 中，手勢密碼登錄失敗的時候，會跳出一個彈框，彈框的文字會抖動一下，告訴用戶登錄失敗。但是一些安卓機不支持這個抖動效果，這個會造成用戶無法獲知第二次、第三次、第四次失敗，因為彈框沒有發(fā)生任何變化。直到最后失敗次數超過限制，被鎖定。
總結
以上就是我對返回功能的一些思考跟分析，希望可以幫助到大家，也歡迎留言交流。
#專欄作家#
王M爭（微信公眾號：王M爭），人人都是經理專欄作家，資深互聯網人。
本文原創(chuàng)發(fā)布于人人都是產品經理。未經許可，禁止轉載。
題圖來自 Unsplash，基于 CC0 協議
無用分享
“有的時候它既屬于層級返回，也屬于任務流返回。” 比如？
我實際項目碰到過同樣問題，有技術層面原因，native頁面和h5頁面之間有時不能做到原路逐級返回，技術不大懂，開發(fā)解釋的
很久沒有看過交互類的文章了，好文，作為產品在交互上，還需要多下點功夫
OPPO R11s已經取消實體鍵了（音量和鎖屏鍵還在）
感謝分享??
我也遇到過類似的場景（iphone用戶），例如安居客APP 首頁 “購房百科”進入三級頁面，點擊左上角會返回二級頁面，而左滑手勢返回卻到了首頁面，還得再次進入“購房百科”，然后點擊某條信息，進入三級，在點擊左上角的返回，雖然左滑手勢返回提供了一個快捷關閉的操作，但是對于iphone用戶，感覺還是欠缺了一點完美程度。