這些不同類型的菜單圖標和用法,我做了個總結(jié)分析迟隅!

大家好但骨,我是Clippp。今天為大家分享的是「菜單導(dǎo)航」智袭。一個簡單的漢堡菜單就可以包括多種不同的樣式奔缠,可能有的樣式甚至沒有官方的名稱,但因為樣式的差異在功能上這些菜單也會出現(xiàn)差異性吼野。

我們可以通過分析這些樣式校哎,來思考不同的樣式代表著怎樣的設(shè)計含義和設(shè)計目的,不能因為簡單常見而忽視了功能的內(nèi)核瞳步。

1.漢堡菜單

關(guān)鍵詞:橫條闷哆、多個菜單選項

這個圖標的樣式簡潔易懂,通常位于網(wǎng)頁和App的上下角单起,用來告知用戶這個按鈕之外還有更多內(nèi)容可以探索抱怔。

當產(chǎn)品有多個菜單選項時,考慮使用漢堡圖標來顯示嘀倒,但盡可能避免在桌面視圖中使用屈留。

2.垂直三點式菜單

關(guān)鍵詞:垂直、內(nèi)嵌菜單

通常位于屏幕或窗口的右上角或頂部测蘑,是用于打開帶有附加選項的圖標灌危,打開的內(nèi)容往往是一個較小的內(nèi)嵌菜單而不是整個全新的頁面。

3.水平三點式菜單

關(guān)鍵詞:水平碳胳、內(nèi)嵌菜單勇蝙、web

水平三點式菜單同樣常位于屏幕或窗口的右上角,用于打開菜單或顯示相關(guān)項的操作挨约。

因為圖標樣式是水平的味混,所以更容易在web上或者在表格等水平方向中使用。

4.九宮格菜單?

關(guān)鍵詞:子分類诫惭、子功能

九宮格菜單通常用于打開同一產(chǎn)品中包含不同子產(chǎn)品或子功能惜傲,可以在它們之間快速切換,此圖標常位于產(chǎn)品主頁的右上角贝攒。

5.過濾式菜單

關(guān)鍵詞:過濾、排序

過濾式菜單由三行不同長度的線段水平疊放而成时甚,是最廣泛使用的過濾符號隘弊」猓可以將過濾式菜單與“排序方式”選項結(jié)合使用,或者與全局過濾器結(jié)合使用梨熙。

6.漢堡菜單變體

關(guān)鍵詞:樣式特殊开镣、時尚感更強

作為漢堡圖標的替代品,與顯示列表菜單的目的相同嗎咽扇,但是這些樣式我們平常見的可能會比較少邪财,更常用在充滿現(xiàn)代感、時尚感和藝術(shù)感的網(wǎng)站上质欲。

最后

不同的樣式可能代表著截然不同的設(shè)計目的树埠,常思考這些小而精的細節(jié),是保證產(chǎn)品體驗提升的關(guān)鍵嘶伟。

慢慢來比較快怎憋,希望對你有幫助~


1、聊聊卡片式設(shè)計的運用

2九昧、案例分析:柵格系統(tǒng)的布局設(shè)計

3绊袋、如何設(shè)計深色模式?這3點因素需要考慮

4铸鹰、深度解析:服務(wù)藍圖的應(yīng)用邏輯設(shè)計

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末癌别,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子蹋笼,更是在濱河造成了極大的恐慌展姐,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,324評論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件姓建,死亡現(xiàn)場離奇詭異诞仓,居然都是意外死亡,警方通過查閱死者的電腦和手機速兔,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,356評論 3 392
  • 文/潘曉璐 我一進店門墅拭,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人涣狗,你說我怎么就攤上這事谍婉。” “怎么了镀钓?”我有些...
    開封第一講書人閱讀 162,328評論 0 353
  • 文/不壞的土叔 我叫張陵穗熬,是天一觀的道長。 經(jīng)常有香客問我丁溅,道長唤蔗,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,147評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮妓柜,結(jié)果婚禮上箱季,老公的妹妹穿的比我還像新娘。我一直安慰自己棍掐,他們只是感情好藏雏,可當我...
    茶點故事閱讀 67,160評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著作煌,像睡著了一般掘殴。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上粟誓,一...
    開封第一講書人閱讀 51,115評論 1 296
  • 那天奏寨,我揣著相機與錄音,去河邊找鬼努酸。 笑死服爷,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的获诈。 我是一名探鬼主播仍源,決...
    沈念sama閱讀 40,025評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼舔涎!你這毒婦竟也來了笼踩?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,867評論 0 274
  • 序言:老撾萬榮一對情侶失蹤亡嫌,失蹤者是張志新(化名)和其女友劉穎嚎于,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體挟冠,經(jīng)...
    沈念sama閱讀 45,307評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡于购,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,528評論 2 332
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了知染。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片肋僧。...
    茶點故事閱讀 39,688評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖控淡,靈堂內(nèi)的尸體忽然破棺而出嫌吠,到底是詐尸還是另有隱情,我是刑警寧澤掺炭,帶...
    沈念sama閱讀 35,409評論 5 343
  • 正文 年R本政府宣布辫诅,位于F島的核電站,受9級特大地震影響涧狮,放射性物質(zhì)發(fā)生泄漏炕矮。R本人自食惡果不足惜么夫,卻給世界環(huán)境...
    茶點故事閱讀 41,001評論 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望肤视。 院中可真熱鬧魏割,春花似錦、人聲如沸钢颂。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,657評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽殊鞭。三九已至,卻和暖如春尼桶,著一層夾襖步出監(jiān)牢的瞬間操灿,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,811評論 1 268
  • 我被黑心中介騙來泰國打工泵督, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留趾盐,地道東北人。 一個月前我還...
    沈念sama閱讀 47,685評論 2 368
  • 正文 我出身青樓小腊,卻偏偏與公主長得像救鲤,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子秩冈,可洞房花燭夜當晚...
    茶點故事閱讀 44,573評論 2 353

推薦閱讀更多精彩內(nèi)容

  • 這里收藏了各種類型的App圖標與應(yīng)用截圖本缠,包括:一、內(nèi)容型產(chǎn)品:為內(nèi)容而生1入问、長視頻(愛拍原創(chuàng)丹锹、愛奇藝、優(yōu)酷芬失、騰訊...
    鳶飛雨霽閱讀 5,923評論 0 8
  • 本文同樣來自NNgroup楣黍,視覺設(shè)計不僅要考慮美觀,用戶體驗的思考更是必不可少棱烂。 閱讀原文請戳傳送門 歡迎關(guān)注我的...
    TerryFan閱讀 1,543評論 0 18
  • 能做出一場刷屏級的活動大概是每個運營人的小目標租漂,但是真正實現(xiàn)的少之又少,我們嘴里經(jīng)常談?wù)摰囊廊皇蔷W(wǎng)易垢啼,騰訊窜锯,京東,...
    言射手閱讀 332評論 0 7
  • 用兩張圖告訴你芭析,為什么你的 App 會卡頓? - Android - 掘金 Cover 有什么料锚扎? 從這篇文章中你...
    hw1212閱讀 12,712評論 2 59
  • 16宿命:用概率思維提高你的勝算 以前的我是風(fēng)險厭惡者,不喜歡去冒險馁启,但是人生放棄了冒險驾孔,也就放棄了無數(shù)的可能芍秆。 ...
    yichen大刀閱讀 6,046評論 0 4