標(biāo)簽導(dǎo)航

標(biāo)簽導(dǎo)航是十大界面框架設(shè)計(jì)里最常用的界面框架設(shè)計(jì),也是被公認(rèn)的一種的頁面框架設(shè)計(jì)。標(biāo)簽導(dǎo)航位于頁面底部,標(biāo)簽的分類最好可以控制在5個(gè)之內(nèi)。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

標(biāo)簽導(dǎo)航能夠讓用戶清楚當(dāng)前所在的入口位置,輕松在各入口間頻繁跳轉(zhuǎn)且不會(huì)迷失方向,直接展現(xiàn)最重要入口的內(nèi)容信息。如果功能入口過多時(shí),該模式反而顯得笨重不實(shí)用。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

舵式導(dǎo)航


目前流行一種標(biāo)簽框架的變體,稱為“舵式導(dǎo)航”,因?yàn)樗臉邮胶芟褫喆嫌脕碇笓]的船舵,在標(biāo)簽導(dǎo)航的基礎(chǔ)上中間加了一個(gè)導(dǎo)航操作項(xiàng),這種舵盤很容易區(qū)分開旁邊的導(dǎo)航模式,能夠讓用戶知道中間這個(gè)標(biāo)志是它主要的導(dǎo)航操作項(xiàng)。美中不足的是只能用在奇數(shù)導(dǎo)航標(biāo)簽里面。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

抽屜導(dǎo)航

抽屜導(dǎo)航是將菜單隱藏在當(dāng)前頁面后,點(diǎn)擊入口即可像拉抽屜一樣拉出菜單。可以節(jié)省頁面展示空間,讓用戶注意力聚焦到當(dāng)前頁面。缺點(diǎn)是不適合頻繁切換的應(yīng)用。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

宮格導(dǎo)航

宮格導(dǎo)航和之前所講的兩種界面導(dǎo)航設(shè)計(jì)不太一樣,宮格導(dǎo)航是將主要入口全部聚合在頁面,讓用戶進(jìn)入界面之后第一步的反應(yīng)就是做出選擇,直觀展現(xiàn)各項(xiàng)內(nèi)容。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

缺點(diǎn)是不能顯示太多入口次級內(nèi)容,它只能展示一級入口,只適合一些功能層級沒有太多的APP,并且每一個(gè)功能與功能之間有明顯的間隔。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

組合導(dǎo)航

組合導(dǎo)航與之前所講的導(dǎo)航模式之間有一些相關(guān),它并不是一種獨(dú)立的界面框架設(shè)計(jì),而是一種綜合式的,靈活運(yùn)用剛才所講的很多類型的界面導(dǎo)航設(shè)計(jì)的模式。當(dāng)用戶需要聚焦內(nèi)容,同時(shí)又需要一些快捷入口能夠連接到某些頁面時(shí),就可以采用組合導(dǎo)航。布局靈活,能適應(yīng)架構(gòu)的快速調(diào)整。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?


列表導(dǎo)航

列表導(dǎo)航是在我們這種二三級頁面最常見的一種導(dǎo)航模式,或者說二三級功能里面最常見的。層次展示清晰,可展示內(nèi)容較長的標(biāo)題,比如三個(gè)字、四個(gè)字、五個(gè)字都可以。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

如果同級過多時(shí),會(huì)產(chǎn)生疲勞。排版靈活性不高,無論怎么排都是列表的樣式,而且每一個(gè)列表的細(xì)分模塊都要同樣大小的圖標(biāo),甚至風(fēng)格都要固定,標(biāo)題、文案都需要擺放在固定的位置,排版非常不靈活,樣式基本是固定死的。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

輪播導(dǎo)航

輪播導(dǎo)航我們使用的比較少,運(yùn)用這種導(dǎo)航模式的APP也不多。單頁面,頁面層級比較簡單,整體性非常強(qiáng),內(nèi)容也比較少;瀏覽方式非常順暢、有方向感,滑動(dòng)為左右滑動(dòng),用戶用起來不會(huì)困難。不適合展示過多頁面,如果功能太多了,層級太多了,都不適用于輪播導(dǎo)航。

 

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

點(diǎn)聚導(dǎo)航

點(diǎn)聚導(dǎo)航是一種比較酷炫的界面框架設(shè)計(jì)的方式,指的是我們將主要的按鈕或者導(dǎo)航合并在一起作為一個(gè)主要的按鈕浮動(dòng)在頁面上面。靈活、展現(xiàn)方式有趣、頁面更開闊,點(diǎn)聚式導(dǎo)航配上抽屜式導(dǎo)航,能夠解決標(biāo)簽式導(dǎo)航的缺點(diǎn)。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?


瀑布導(dǎo)航

瀑布式導(dǎo)航這種界面框架設(shè)計(jì)適用的范圍是比較固定的,就是適應(yīng)這種圖片為主的內(nèi)容,就像我們所說的瀑布流,這種瀑布流的界面框架是一邊“拉”一邊刷新、自動(dòng)向下拉自動(dòng)刷新。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

瀏覽時(shí)產(chǎn)生流暢體驗(yàn)。特別適合展示大圖,不用小圖點(diǎn)擊,直接展示大圖。因?yàn)檫@種布局不用標(biāo)簽式的導(dǎo)航,用戶會(huì)被圖片所吸引,能夠讓用戶長時(shí)間地停留在頁面里去瀏覽圖片。層級比較復(fù)雜的架構(gòu)不適合瀑布導(dǎo)航,容易產(chǎn)生疲勞感。

九種APP界面導(dǎo)航模式詳解,你掌握了幾個(gè)?

標(biāo)簽:APP界面APP導(dǎo)航

相關(guān)文章

隨機(jī)推薦