漢堡包菜單,也叫側邊欄菜單。它由三個堆疊線條(你可以形象的想象成漢堡包中上下的兩個麵包和中間的肉)的圖標用於表示菜單。點擊圖標時,會顯示可用的導航選項。很多設計師寫的有關漢堡包菜單設計的文章,都不看好這種設計。總結其缺點,主要體現在:1.可發現性較低;2.效率較低;3.與系統的導航模式衝突;4.不夠 ...
漢堡包菜單,也叫側邊欄菜單。它由三個堆疊線條(你可以形象的想象成漢堡包中上下的兩個麵包和中間的肉)的圖標用於表示菜單。點擊圖標時,會顯示可用的導航選項。很多設計師寫的有關漢堡包菜單設計的文章,都不看好這種設計。總結其缺點,主要體現在:1.可發現性較低;2.效率較低;3.與系統的導航模式衝突;4.不夠一目瞭然。大家如果感興趣的話,可以搜索相關文章詳細瞭解一下。但究其根本,並不是圖標本身,而是隱藏在圖標後面導航選項。
儘管如此,在某些情況下,漢堡包菜單設計可能是一個不錯的選擇。
如:漢堡包菜單作為輔助導航
由於漢堡包菜單的主要缺點是其低可發現性,因此不推薦將其使用為主導航菜單。但是,在設計輔助導航選項時,這種模式可能是一個合適的解決方案。如果主導航選項在屏幕上以CTA按鈕(即用戶響應行動或叫用戶行為召喚)或其他形式展現,在輔助導航中使用漢堡包菜單設計會是一個好的方法。
下麵以Uber主屏幕作為例子:
地圖和搜索(Uber屏幕的兩個重要導航元素)始終是可見的。
由於主屏幕的所有內容都是為了打車,所以諸如歷史記錄和設置等次要選項可以隱藏在漢堡菜單的後面(這些功能在每個人打開應用程式時不太可能都去使用)。這個漢堡包圖標不會分散用戶打車的註意力,而且仍然允許他們訪問裡面的輔助功能。
在這種特殊情況下:
導航元素越少意味著當用戶與應用程式交互時受到的干擾就越少。而且,最小化導航使用戶的註意力集中在打車上。
一般來說,在你選擇是否使用漢堡包菜單時,請考慮“80%規則”。也就是,你想要隱藏在漢堡圖標後面的導航選項會低於正常使用的80%嗎? 如果你的答案是肯定的,那麼把它們放在漢堡菜單里就沒問題了。
結論:
雖然隱藏的導航通常不利於用戶體驗,但任何設計決策都必須對應用程式的目標情景進行綜合考慮。換句話說,沒有“好”或“壞”的設計模式。最重要的是使用情景。
原文作者:Nick Babich
原文鏈接:http://babich.biz/hamburger-good-ux/
更多設計類相關乾貨(文章及經驗教程),盡在:UI/UX專業博客