
文章分類:設(shè)計前沿 發(fā)布時間:2017-02-27 原文作者:Shi Yongfeng 閱讀( )
【文章摘要】通過相關(guān)競品與用戶訪談分析,我們發(fā)現(xiàn),該類產(chǎn)品的用戶在某個時間段的興趣域幾乎是特定的,比如我現(xiàn)在就想刷一些大V的干貨,因此決定了用戶頻繁切換的概率是比較低的。
一、寫在前面
關(guān)于移動端導(dǎo)航模式,我想你身邊已經(jīng)有很多很多類似的文章了,什么“標(biāo)簽式導(dǎo)航”、“抽屜式導(dǎo)航”、“列表式導(dǎo)航”、“葫蘆娃噴火式導(dǎo)航”、“天馬流星式導(dǎo) 航”…甚至你以為掌握這些,就能游走產(chǎn)品信息架構(gòu)中的任何和導(dǎo)航有關(guān)的問題,現(xiàn)實是,當(dāng)你在真正運用時,你才發(fā)現(xiàn)“咦?剛才葫蘆娃噴火式導(dǎo)航是咋用的 啦”。所以在開始之前,你需要明白一個事實:用戶體驗是一個整體,脫離產(chǎn)品方向去解釋那些所謂的“葫蘆娃噴火式”毫無意義。
二、你的產(chǎn)品為什么需要導(dǎo)航欄
導(dǎo)航設(shè)計的目的就是需要突出產(chǎn)品的核心,扁平化用戶的任務(wù)路徑。無論是PC還是移動端,很難想象一個沒有導(dǎo)航的產(chǎn)品會是什么樣子,我們可能都會成為“瞎 子”,悶頭亂撞。當(dāng)然,那些有導(dǎo)航的也別50步笑百步,錯誤的使用導(dǎo)航模式,和沒使用導(dǎo)航的效果是一樣的,你的產(chǎn)品沒那么不言而喻,等待你產(chǎn)品的只有死路 一條。
因此明白了導(dǎo)航設(shè)計的目的:突出產(chǎn)品核心,扁平化用戶任務(wù)路徑,下面的就是對產(chǎn)品的理解,產(chǎn)品的核心是什么?什么樣的導(dǎo)航模式最能反映我產(chǎn)品的核心,包括是否起到了扁平用戶操作的作用?
三、它的作用很大,但并沒有描述中的那么神乎
1.抽屜式導(dǎo)航?它其實就是一種化繁為簡的“超級整理術(shù)”
抽屜式導(dǎo)航更多的被應(yīng)用于信息流產(chǎn)品設(shè)計中,這類產(chǎn)品注重核心內(nèi)容的展示,用戶的任務(wù)路徑較為單一,幾乎都是用于瀏覽產(chǎn)品的核心內(nèi)容,至于其他比較低頻的模塊入口則會隱藏在當(dāng)前界面后方,避免冗余的模塊搶奪用戶的眼球。
其實我并不喜歡將其稱為“XXX導(dǎo)航”,因為可能在我解釋完所有內(nèi)容之后,等你在工作中再遇到相似的情境,你可能又會疑問“咦?那個XXX導(dǎo)航是怎么用的來著”。
抽屜式導(dǎo)航本質(zhì)是什么?有人可能會說:“一種交互風(fēng)格”,再具體一點,有人可能又會說:“交互風(fēng)格中的一種導(dǎo)航風(fēng)格”。如果今天你也看了我這篇文章,請你忘 記這以上這兩種回答。抽屜式導(dǎo)航說到底就是一種化繁為簡的“超級整理術(shù)”。“2/8”法則告訴我們,80%的用戶只用哪寫20%功能,這20%功能就是信 息流里面的核心功能,如果那80%不常用的功能也占用著最重要的位置,那么用戶就會被打擾,產(chǎn)生臃腫感,甚至?xí)艞壥褂卯a(chǎn)品。
2.標(biāo)簽式導(dǎo)航?它僅是讓用戶任務(wù)路徑更加扁平
同樣的,我們經(jīng)常會講到的,標(biāo)簽式、標(biāo)簽式,那么標(biāo)簽式導(dǎo)航的的本質(zhì)是什么呢?
在設(shè)計規(guī)劃期,我們通過產(chǎn)品的信息架構(gòu)可以直觀的了解產(chǎn)品的核心功能,以及各功能之間的一個關(guān)系,當(dāng)產(chǎn)品的整個體驗流中是以幾個常用功能模塊(PS:一般不 超過5個)貫穿的,意味著用戶需要在多個標(biāo)簽入口之間來回切換,為了保證切換的效率,將貫穿產(chǎn)品整個體驗的流的模塊平鋪在Tab Bar位置,保證了用戶任務(wù)路徑的扁平。
3.桌面式導(dǎo)航?它只是對于扁平比較獨立的用戶任務(wù)路徑模塊的另一種思考
我前面提到了“當(dāng)產(chǎn)品的整體體驗流是由幾個常用功能模塊貫穿而成時,為了保證用戶任務(wù)路徑的扁平,我們將這幾個模塊平鋪在Tab Bar上,后來被冠以’標(biāo)簽式導(dǎo)航‘的稱呼”。那么當(dāng)產(chǎn)品的整體體驗流不能由有限個(一般不超過5個)功能模塊貫穿時,或者說,整個體驗流是由無限個 (PS:這里的“無限”是相對的概念,一般數(shù)十個以上都可稱為無限個)功能模塊集成而成的,那么這是我們是不是還可以平鋪在“Tab Bar”上呢?
“Tab Bar”就算了,因為通過相關(guān)競品分析,我們發(fā)現(xiàn)使用“桌面式”導(dǎo)航的應(yīng)用,每一個入口往往是比較獨立的信息內(nèi)容,用戶進入一個入口后只處理與此入口相關(guān) 的內(nèi)容,這就意味著用戶在幾個任務(wù)之間頻繁切換的概率比較低,這就意味著就算有標(biāo)簽式導(dǎo)航,也是個雞肋導(dǎo)航。但是由于功能入口眾多,我們還得“平鋪”,不 過“平鋪”的意義不太一樣了,Tab Bar是為了保證來回切換任務(wù)的扁平,而這里的“平鋪”是用來保證用戶搜索行為的扁平,因此對展示功能入口數(shù)量的限制沒有Tab Bar那么苛刻,所以Table View就成了最好的舞臺,也就是我們一直神叨叨的“桌面式導(dǎo)航。”
4.菜單式導(dǎo)航?相比于扁平用戶任務(wù)路徑,凸顯產(chǎn)品的核心會顯的更加重要
對于像微博這樣開放性的信息流,用戶在不同情景和不同時段下可能會有不同的興趣域,我想看一下我喜愛明星最近的動態(tài)放松一下、我想看一下我的專業(yè)領(lǐng)域達人的 動態(tài)學(xué)習(xí)一些干貨…不同的人的需求是不一樣的,同一個人不同時段的需求也是不一樣的,可能前一秒你還是“酷愛足球運動的財經(jīng)男”,下一秒你很可能又會 成為那個喜歡娛樂八卦的“清新女”。
通過相關(guān)競品與用戶訪談分析,我們發(fā)現(xiàn),該類產(chǎn)品的用戶在某個時間段的興趣域幾乎是特定的,比如我現(xiàn)在就想刷一些大V的干貨,因此決定了用戶頻繁切換的概率是比較低的。
說到這里,有人可能覺得這句話好像在哪里聽過,是的,桌面式導(dǎo)航也是這種情境——用戶頻繁切換的概率是比較低的,那么我們可不可以也像“桌面式導(dǎo)航”那樣,將這些興趣頻道入口平鋪在Table View上呢?
首 先你想到了這一層,我很開心,因為你已經(jīng)不再糾結(jié)那些神叨叨的形式了,開始追求“花架子”背后的機制了。其次不知道你注意沒有,桌面式導(dǎo)航為什么需要平 鋪?因為獨立的功能入口太多了,我們?yōu)榱吮WC搜索行為的扁平而采用的招式。但是這里的興趣頻道是獨立且有限的。獨立性是菜單式導(dǎo)航與桌面式導(dǎo)航的共性,你 還記得在桌面式導(dǎo)航,我強調(diào)“平鋪只是為了服務(wù)搜索,和切換沒有關(guān)系”,但是菜單式導(dǎo)航的興趣頻道就那么幾個(有限性),沒有多少搜索成本,因此此時的 “平鋪”似乎沒有太大意義,再想想我在第二部分講的:“導(dǎo)航設(shè)計的目的是突出產(chǎn)品的核心,扁平化用戶的任務(wù)路徑。”現(xiàn)在相比于扁平用戶的任務(wù)路徑,突出產(chǎn) 品的核心(因為這里的產(chǎn)品更多的是信息流產(chǎn)品,信息流最強調(diào)沉浸體驗)反而會顯得更加重要,因此我們需要“超級整理術(shù)”,收起那些現(xiàn)在可能用不到的80% 模塊,保留真正有用的20%,通過面積和內(nèi)容限制保證了此刻用戶的沉浸體驗。
5.點聚式導(dǎo)航?它僅是一種暖心的UCD法則的衍生物
點聚式導(dǎo)航最早來自于“Path”,它將用戶最頻繁使用的多個核心功能點匯聚在主界面中顯示,通常這些功能具有一定的交集,比如都是“發(fā)動態(tài)”用的,發(fā)音樂有關(guān)的動態(tài)、發(fā)LBS信息有關(guān)的動態(tài)、發(fā)照片有關(guān)的動態(tài)。本質(zhì)其實是一種“超級整理術(shù)”中的合并同類項術(shù)。
為什么需要“合并同類項”?合并同類項是為了突出產(chǎn)品更重要的內(nèi)容,當(dāng)用戶已經(jīng)確定,自己需要那些同類項來豐富自己的移動端體驗,此時再分解同類項,并且分解的過程是那么的有趣。懂你+有趣=暖心。
6.走馬燈導(dǎo)航?它僅想讓你多看她一眼
看到只顯示1/8的圖片,你會本能地把它滑出來,因為強迫癥在作怪,當(dāng)然你可能抑制力很好,沒有滑,但是1/8不完整圖片也會讓你感覺別扭,只要你“別扭 了”它的目的已經(jīng)達到了,你的眼球已經(jīng)被它“Catch”了,換句話說,它希望你看到這些內(nèi)容(和商業(yè)目標(biāo)有關(guān)),你的確因為強迫癥的驅(qū)使聚焦于這些內(nèi) 容,結(jié)果發(fā)現(xiàn)“哎呦,不錯喲”(迎合了用戶目標(biāo)),產(chǎn)品目標(biāo)、用戶目標(biāo)達成完美融合。
7.列表導(dǎo)航?一張名片的效果
“我是做xxx的,這是我的名片,如果哪天你有類似需求,歡迎找我啊,一定給你優(yōu)惠!”盡管你沒有買東西,但是銷售人員也成功了,因為它銷售了一張名片,有了 這張名片,就等于你現(xiàn)在已經(jīng)是他的長線之魚。有一天你很想買一樣?xùn)|西,突然想起,那天那個人給你一張名片,依據(jù)名片上的不同信息,你成功從數(shù)十張里面找到 了它,再次依據(jù)這張名片上的信息,你聯(lián)系到了那天的銷售人員,并且達成了交易。
這個過程中,名片扮演了“長線”的作用。試想一下,如果沒有名片,就意味著這條線就斷了,那位銷售者也因此損失了一條魚。對應(yīng)到產(chǎn)品,那位銷售者其實就是我 們產(chǎn)品,顧客就是我們的用戶,那個“名片”或者“長線”就是這里的“列表導(dǎo)航”,通過列表導(dǎo)航的識別,用戶可以完成自己的目標(biāo),同時也帶來了商業(yè)目標(biāo)。
易識別性是其最重要的衡量準則,因為它承載了產(chǎn)品大量的數(shù)據(jù)信息,相當(dāng)于產(chǎn)品的語言元數(shù)據(jù),只有具備共同的語言元數(shù)據(jù),才有可能促使產(chǎn)品做到真正意義上的不言而喻!
8.圖示導(dǎo)航?它只是一種展示信息的扁平處理方式
針對以圖片為主的應(yīng)用平臺,經(jīng)常變化的圖片會讓用戶感受到欄目內(nèi)容的更新的及時性,對用戶來說是比較核心的點。圖示導(dǎo)航將這些更新的信息可視化,以達到展示 信息扁平化的作用。這里需要注意的是,這種導(dǎo)航需要配置固定的欄目或標(biāo)題,防止不斷更新的圖片讓用戶找不到相應(yīng)的入口。
9.分段選項卡?它只是用戶來扁平用戶來回切換任務(wù)路徑
我們來思考這樣一個問題“當(dāng)產(chǎn)品的某個模塊是由有限個子集貫穿時,我們該采用什么導(dǎo)航形式?”這句話,好眼熟啊,沒錯,在“標(biāo)簽式導(dǎo)航”部分我們提到“當(dāng)產(chǎn)品由有限個模塊貫穿時,我們會采用平鋪在‘Tab Bar’位置的標(biāo)簽式導(dǎo)航。”
現(xiàn)在我們的對象由產(chǎn)品變成了產(chǎn)品的某個模塊,數(shù)學(xué)里有一個叫做”等效替換法”,令t=sin(x),然后將有關(guān)sinx的元素全部替換成t,從而使一個復(fù)雜 的正弦問題,變成了一個簡單的線性問題。同樣對應(yīng)產(chǎn)品的某個模塊我們可以將其看成產(chǎn)品,這樣問題又變成了一個標(biāo)簽式導(dǎo)航問題了,對于標(biāo)簽式導(dǎo)航我們再熟悉 不過,所以我們只需采取相同的手法就行了,只是原來的“Tab Bar”要換成“Segment Control”區(qū)域。
四、總結(jié)
當(dāng)你讀到這兒,你可能已經(jīng)忘記了“走馬燈導(dǎo)航導(dǎo)航是什么鬼?”“菜單式導(dǎo)航是什么鬼?”但是有一天你在實戰(zhàn)中發(fā)現(xiàn)當(dāng)前產(chǎn)品的信息架構(gòu)正是由有限個元素貫穿時,你意識到用戶對這些模塊來回切換的需求比較大,因此需要將他們平鋪在Tab Bar上,以確保用戶操作路徑的扁平,從而實現(xiàn)用戶體驗的優(yōu)化與用戶留存。如果你真的做到了這一步,我會很開心,因為我這篇文章的目的已經(jīng)達到了。
APP設(shè)計,廣州APP設(shè)計,廣州APP用戶體驗,廣州APP手機軟件,廣州APP應(yīng)用開發(fā),廣州手機應(yīng)用開發(fā),報價咨詢奕環(huán)科技sdxz66.cn
? 廣州奕環(huán)信息科技有限公司所有??粵ICP備16005555號-1?????
友情鏈接: 北京軟件開發(fā)公司 廣州營銷公司 鞋業(yè)ERP軟件 移動OA 小程序開發(fā) ehr系統(tǒng)