觸屏版
全國(guó)服務(wù)熱線:0571-87205688
登錄
注冊(cè)
客戶中心
關(guān)注云客
文章對(duì)底部導(dǎo)航進(jìn)行相應(yīng)的剖析,希望對(duì)你有所幫助。
引·底部導(dǎo)航是產(chǎn)品的框架所在
底部導(dǎo)航是一個(gè)APP最直觀的框架表現(xiàn)。從某乎的多次改版、到導(dǎo)航動(dòng)效的多樣化,每次改版大家都會(huì)對(duì)底部導(dǎo)航傾注很大的熱情。
在做功能模塊時(shí)也一樣,很多時(shí)候我們也需要為模塊加一個(gè)底部導(dǎo)航。但是在需求評(píng)審的時(shí)候,你也一定聽(tīng)領(lǐng)導(dǎo)說(shuō)過(guò)這句話:“這不就是APP套APP嗎?”。
其實(shí)不然,底部導(dǎo)航的運(yùn)用和意義仔細(xì)琢磨整理之后,是體現(xiàn)了功能模塊的需求和布局思路的,下面筆者整理四種場(chǎng)景的導(dǎo)航情況,進(jìn)行梳理分析。
理·四種常見(jiàn)底部導(dǎo)航模式
一、全局底部導(dǎo)航
第一種,是最常見(jiàn)的全局底部導(dǎo)航。這種導(dǎo)航微信是用的最普遍且層級(jí)最高的。全局導(dǎo)航在切換時(shí)互不影響,在首頁(yè)進(jìn)行滾動(dòng)查看后換回來(lái)依然還在原處,這種導(dǎo)航有四大特點(diǎn):
四大導(dǎo)航內(nèi)部界面互不影響
切換后不會(huì)重新刷新界面
四大功能同等級(jí)別
隨時(shí)切換,扁平關(guān)系
那么這種導(dǎo)航的應(yīng)用場(chǎng)景需要具有幾大特點(diǎn):
高頻次切換模塊的需求,多見(jiàn)于社交場(chǎng)景
幾大功能模塊優(yōu)先級(jí)較高且平等,多見(jiàn)于APP首頁(yè)的全局
二、H5底部導(dǎo)航
第二種,稱之為H5底部導(dǎo)航。這種導(dǎo)航多見(jiàn)于H5功能模塊中,也較常見(jiàn)。類似于第一種,但功能切換上是關(guān)鍵區(qū)分點(diǎn)。這種導(dǎo)航在切換模塊時(shí),每一次進(jìn)入都是一次刷新,是沒(méi)有緩存的,都是從0開(kāi)始,這也就意味著并不適用于高頻次切換場(chǎng)景。
故我們稱之為偽底部導(dǎo)航,在不涉及到切換保留、瀏覽保留等情況下,基本等同于第一種。
三、跳轉(zhuǎn)底部導(dǎo)航
第三種我們稱之為跳轉(zhuǎn)底部導(dǎo)航,這種就僅僅是形式上的底部導(dǎo)航了。因?yàn)槌酥黜?yè)之外的功能,跟首頁(yè)導(dǎo)航是上下級(jí)的關(guān)系。這也就意味著,剩下的幾個(gè)導(dǎo)航基本完完全全相當(dāng)于按鈕,只不過(guò)是導(dǎo)航樣式的按鈕擺放。特點(diǎn)如下:
點(diǎn)擊后是跳轉(zhuǎn)刷新,新界面導(dǎo)航不復(fù)存在
不可切換,是前進(jìn)后退的關(guān)系
這種導(dǎo)航在我們希望突出某種功能的情況下可以使用,且前提是多個(gè)導(dǎo)航功能之間沒(méi)有切換的需求。
四、駝式底部導(dǎo)航
第四種,是特殊版的底部導(dǎo)航,因?yàn)槌R?jiàn)于一個(gè)加號(hào)形狀的駝峰,故叫駝式底部導(dǎo)航。這種導(dǎo)航的關(guān)鍵在于駝峰,駝峰是處于略高于其他功能點(diǎn)的層級(jí)。這種導(dǎo)航的使用常見(jiàn)于社區(qū)型APP,具有多格式發(fā)布需求的情況下,會(huì)選擇采用駝式導(dǎo)航來(lái)突出功能點(diǎn)。
聯(lián)·四種模式的橫向比較分析
功能結(jié)構(gòu)分析
如圖所示,我們假設(shè)ABCD為四大功能。根據(jù)上文的分析研究,我們可以得到以下結(jié)論:
全局和H5的差別幾乎只在于切換時(shí)的真獨(dú)立切換還是需要刷新。
跳轉(zhuǎn)式的底部導(dǎo)航功能結(jié)構(gòu)是分兩個(gè)層級(jí)的。
駝式導(dǎo)航的駝峰要略高于其他幾個(gè)層級(jí)。
對(duì)于功能模塊想應(yīng)用底部導(dǎo)航的情況,要根據(jù)功能結(jié)構(gòu)需求而定。
應(yīng)用場(chǎng)景分析
四種導(dǎo)航除了應(yīng)用在不同場(chǎng)景之外,我們需要對(duì)應(yīng)不同的交互和視覺(jué)方案,考慮以下幾點(diǎn):
是否需要滑動(dòng)切換還是僅僅允許點(diǎn)擊切換?
跳轉(zhuǎn)動(dòng)畫(huà)及動(dòng)效適合哪種?
命名規(guī)則和劃分是否互不干擾完全獨(dú)立?
刷新場(chǎng)景的數(shù)據(jù)量大小,是否適合高頻切換刷新?需要如何做本地緩存配合?
充分考慮布局及交互后,我們才能拿出一個(gè)完整的導(dǎo)航設(shè)計(jì)方案。
結(jié)·從導(dǎo)航開(kāi)始
底部導(dǎo)航的應(yīng)用目前演變形式多樣化,交互動(dòng)效也比較豐富。我們要謹(jǐn)記這個(gè)設(shè)計(jì)的初心即“導(dǎo)航”二字,底部的導(dǎo)航是視覺(jué)習(xí)慣的終點(diǎn),也意味著當(dāng)我們這個(gè)界面操作結(jié)束的時(shí)候,想換界面的時(shí)候,目光是停留在界面下方的。所以底部導(dǎo)航要做的就是在用戶猶豫的間隙,給出指引和導(dǎo)航。這是底部導(dǎo)航之余TAB頁(yè)的區(qū)別,TAB頁(yè)體現(xiàn)的是一種角度視角的劃分,類似于一種篩選,而底部導(dǎo)航則代表著門和通道。
至于這個(gè)門和通道怎么設(shè)置,你給用戶的是四個(gè)互通的門,還是四條平行的路,亦或是其它關(guān)系層級(jí),是需要我們?cè)谧霾季趾头治鰰r(shí)考慮的永恒話題。
網(wǎng)站流量下降?別說(shuō)我沒(méi)教你,全在這了!
擴(kuò)展高質(zhì)量搬家網(wǎng)站站內(nèi)內(nèi)容技巧你知道有多少
淺談網(wǎng)站優(yōu)化中不可或缺的元素:多元化發(fā)展
頂級(jí)域名301重定向到帶www域名后對(duì)二級(jí)域名的影響
谷歌和百度關(guān)鍵詞優(yōu)化有什么區(qū)別
網(wǎng)站被掛了黑鏈導(dǎo)致百度降權(quán),清理后多久恢復(fù)
如何優(yōu)化才能讓關(guān)鍵詞快速提高排名
網(wǎng)站如何快速收錄,不回檔
百度快照回檔的原因分析
SEO最后的方法就是等待
評(píng)論(0人參與,0條評(píng)論)
發(fā)布評(píng)論
最新評(píng)論