中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

如何設(shè)計(jì)“標(biāo)題欄”?

2021-03-02    分類: 網(wǎng)站建設(shè)

標(biāo)題欄是我們最常見的功能模塊了,這一次來解讀一下標(biāo)題欄為什么是標(biāo)題欄。

我知道產(chǎn)品經(jīng)理很多時(shí)候會去思考一些有的沒有的問題,比如微信為什么不做消息閱讀狀態(tài),為什么不做離線狀態(tài)。

又或者頭像為什么是方的不是圓的。

這些問題往往會以對方產(chǎn)品經(jīng)理的個(gè)人價(jià)值觀為終結(jié)答案,畢竟不參與到其中的成員,無法知道真正的情況是什么樣的。

也因?yàn)檫@個(gè)情況,許多產(chǎn)品經(jīng)理會將此類問題定義到主觀因素里,忽略了對問題的深入思考過程。

其實(shí)我覺得這些問題背后總有一些深意,如果明白做法的原因后,我們可以借鑒,但在不清楚原因的情況下,就只有抄襲了。

▌布局分析

為什么陌陌的篩選放在右上角?

為什么微信的搜索放在右上角?

為什么設(shè)置放在右上角?

這篇文字,我們就來回答這三個(gè)任性的“問題”。

首先,我們來看看視覺熱點(diǎn)圖。

這是在網(wǎng)絡(luò)中找到的一張APP的眼動(dòng)熱力圖,可以看到標(biāo)題欄幾乎不會被注意到,對視覺熱力圖感興趣的朋友,可以百度視覺熱力圖或者眼動(dòng)熱力圖,類似這樣的素材并不那么容易被找到,需要有多一點(diǎn)耐心。

▌配圖

App的頂部局域是最容易被忽視地方,我們在看界面時(shí),潛意識是看中間部分,這和我們生活中的視線有關(guān)聯(lián)的。

如果你身邊有一本書,或者一個(gè)鍵盤,不如試試你第一眼看的是哪個(gè)位置。

讓我猜猜,你會看到書的中間,或者書的標(biāo)題,不太會看到書的頂部,你也會看到鍵盤上FGHJ這四個(gè)按鍵,不太會看到F5,F6這一列。

人們的眼睛似乎遵守著某種生物本能,潛意識的會先看“中間部分” 。

我們在使用手機(jī)app 閱讀一篇文章時(shí),為什么會將文章標(biāo)題做的和正文內(nèi)容完全不一樣,

也是因?yàn)檫@樣的一個(gè)原因。

借助標(biāo)題的視覺特殊性,將人們的視線從中間部分,提升到頁面頂部,這樣才能從頭看內(nèi)容,否則人們第一眼就會看到文章中間部分的內(nèi)容,這樣就會出現(xiàn)閱讀障礙了,難以理解文章從哪里開始的。

圖中,你看見的第一個(gè)字是什么?

▌?dòng)脩羰褂玫钠惹杏?/b>

當(dāng)我們特別想得到什么時(shí),會做出一些平時(shí)難以理解的行為,其中包括做一些成本非常高的動(dòng)作。

如果將用戶對一款A(yù)PP的使用理解成許多的行為動(dòng)作,那用戶的使用欲望變可以理解為對某個(gè)行為的專注程度。

專注度,越高,對行為成本的感知越弱,越不敏感。

被放置在標(biāo)題欄的功能,具備很強(qiáng)的特性。

上圖列舉了一部分常見的標(biāo)題欄功能,而這部分功能最典型的特征便在于用戶使用的迫切欲望。

也就是當(dāng)用戶想要舉報(bào)某條內(nèi)容時(shí),對“舉報(bào)”這一行為的專注度,超過了行為成本。

我們試想一下,上述的功能,在什么時(shí)候會被用戶使用?

比如:搜索功能。

人們不太可能去“隨意搜索”,往往已經(jīng)有了明確搜索對象了,我已經(jīng)明確知道我要搜索的內(nèi)容,此時(shí),我想要立即知道搜索結(jié)果。

此時(shí),我的注意力都放在搜索結(jié)果上,也就是行為之后的結(jié)果,并不太在意這個(gè)行為發(fā)生的過程。

同理推斷,舉報(bào),添加,清空,刪除,修改等等一系列行為,都是屬于專注度較高,且專注對象都是行為之后的結(jié)果,而非行為本身的過程。

類似這樣的需求,我們便可以利用人們對行為的專注度,將這部分功能設(shè)計(jì)在一些比較薄弱的角落里。

(前文已經(jīng)提及到了頂部屬于視覺薄弱區(qū)域)

反向思維,若用戶對這個(gè)功能沒有使用欲望,又會怎么樣呢?

被設(shè)計(jì)在標(biāo)題欄的功能,在用戶沒有產(chǎn)生需求的時(shí)候,會被很自然的遺忘,并且是完全遺忘。

我們在前文已經(jīng)提及了用戶對頂部內(nèi)容的不關(guān)注,源自于人們作為生物的視覺本能,因此,在沒有產(chǎn)生需求的時(shí)候,我們的視覺就會自動(dòng)忽視這部分的內(nèi)容。

這樣一來,所謂的“高成本行為”就變成了“不存在的行為”自然就不會給用戶產(chǎn)生復(fù)雜或者不方便的感知了。

簡單的來講,當(dāng)用戶需要時(shí)能夠不計(jì)成本去使用,當(dāng)用戶不需要時(shí),能夠“自動(dòng)消失”便是標(biāo)題欄功能的特色。

▌微信之分享

微信是個(gè)能引起山寨效應(yīng)的產(chǎn)品,比如在標(biāo)題欄右側(cè)設(shè)計(jì)分享以及上傳功能。

因此我單獨(dú)來說解讀一下微信標(biāo)題欄右側(cè)的分享功能。

微信,為什么將分享放在標(biāo)題欄右側(cè)。

將分享功能放置在右上角的原因,除了前文所提及的兩點(diǎn)之外,還有一個(gè)決定性因素是對H5的支撐。

H5在app內(nèi)的使用往往是以內(nèi)嵌瀏覽器的方式進(jìn)行實(shí)現(xiàn),而分享面板的功能則是native自身的能力。

我們在朋友圈所訪問的H5頁面實(shí)際上是這樣的。

除了標(biāo)題欄區(qū)域以外的地方,都是H5的區(qū)域。

我們可以嘗試在底部參考標(biāo)題欄的做法,也固定一個(gè)底部區(qū)域由native來開發(fā),但這樣一來就會減少H5的展示空間,同時(shí)也會局限H5本身的擴(kuò)展玩法,這樣的做法并沒有被大面積的使用。

鑒于技術(shù)上的交互成本以及瓶頸,H5沒有辦法直接控制客戶端的響應(yīng)事件,這表示我們也沒有辦法點(diǎn)擊H5上的分享按鈕,直接喚起native的分享面板。

你還記得箭頭指向右上角提示用戶點(diǎn)此分享的引到頁嗎?

右上角放置分享按鈕基本上是微信特色,只是因?yàn)榧夹g(shù)限制以及更開放的對待其他人的H5接入。

有時(shí),我看到某款產(chǎn)品使用native做的頁面承載,也依然學(xué)習(xí)微信將分享按鈕置于頁面右上角時(shí),覺得挺浪費(fèi)的。

我相信大部分產(chǎn)品都希望用戶將內(nèi)容分享到微信朋友圈,以此產(chǎn)生擴(kuò)散效應(yīng),不過盲目的抄襲,可不是一位好的產(chǎn)品應(yīng)該做的事情。

這會讓我們失去很多尋找真相和原因的機(jī)會。

▌?wù)l是需求方

發(fā)布內(nèi)容這個(gè)功能也是標(biāo)題欄的一個(gè)奇葩功能,我們在設(shè)計(jì)產(chǎn)品時(shí),都希望盡可能多的生產(chǎn)內(nèi)容,按照前文的原則,這樣一個(gè)重要的功能似乎不應(yīng)該放在容易被忽視的右上角。

其實(shí)這個(gè)做法也是微信引起來的,朋友圈的上傳功能就在頁面右上角,于是許多產(chǎn)品經(jīng)理在不知道如何放置功能時(shí),就參考了微信的做法。把發(fā)布內(nèi)容丟到右上角去了。

△提問:為什么朋友圈的發(fā)布功能放在標(biāo)題欄右側(cè)?

先說個(gè)思維陷阱吧!

朋友圈是微信這個(gè)產(chǎn)品的一部分組成元素,發(fā)朋友圈的價(jià)值僅在這個(gè)板塊存在價(jià)值,而對于整個(gè)微信產(chǎn)品而言,更提倡的是用戶聊天,而不是發(fā)布動(dòng)態(tài)。

這個(gè)地方的誤區(qū)在于,我們常常將朋友圈提升到了一個(gè)獨(dú)立APP的地位進(jìn)行思考。

比如:

我們做了一款圖片社交軟件,功能比較多,以至于我們沒有地方放置“上傳圖片”這個(gè)功能入口了。

A產(chǎn)品經(jīng)理說:“放到右上角去吧,微信也是這樣做的”。

在這樣的判斷下,微信的一個(gè)子模塊的功能,成了另一款產(chǎn)品的設(shè)計(jì)源頭。

最終的結(jié)果是什么呢?

就算微信用戶不發(fā)朋友圈,人們還在聊天呢,甚至因?yàn)槿趸l(fā)朋友圈的設(shè)計(jì),讓人們更多的去聊天,而不是枯燥的發(fā)朋友圈。

而這款根據(jù)微信而設(shè)計(jì)的圖片社交產(chǎn)品,很不幸的是,用戶即不發(fā)照片,也沒有產(chǎn)生其他的行為。

然后就這樣迷惑的一直尋找提高用戶內(nèi)容生產(chǎn)率的辦法。

不同的產(chǎn)品環(huán)境,相同的功能,但需求方是不一樣的。

功能的需求方,這大概是我第一次公開提到這個(gè)概念。

就如同發(fā)布內(nèi)容,對于微信而言,用戶是需求方,當(dāng)用戶需要時(shí),就會遵從于文中所提到的第二個(gè)概念,迫切的行為欲望會讓我們忽視行為成本。

所謂的需求方,是指尋求幫助的人,雖然這樣說并不耿直,但話糙理不糙,我們可以向需要幫助的人提出一定的要求。

什么時(shí)候向他人提出要求最容易得到回應(yīng)呢?當(dāng)他有求于你時(shí)。

“你想發(fā)布內(nèi)容對吧,那你就去右上角發(fā)吧”。

這是微信對待“發(fā)布內(nèi)容”的態(tài)度,想發(fā)你就去上面發(fā), 不想發(fā)就算了,是不是很高冷?其實(shí)朋友圈的更新頻率并不高,試想一下你是多久發(fā)一條朋友圈呢?

而對于我們案例里提到的圖片社交而言,發(fā)布內(nèi)容的需求方并不是用戶,而是產(chǎn)品。

其實(shí)對于許多產(chǎn)品而言,發(fā)布內(nèi)容的需求方是產(chǎn)品本身,是我們希望用戶去發(fā)內(nèi)容,可以說想盡辦法讓用戶發(fā)內(nèi)容。

我們希望用戶最好一天能發(fā)多條內(nèi)容,盡管他現(xiàn)在可能并不想發(fā)。

對于這種類型的產(chǎn)品,將發(fā)布入口放在右上角并不是一個(gè)明智的決定,這會導(dǎo)致用戶不想發(fā)的時(shí)候,完全忽視掉這個(gè)功能。

常見的做法是放在底部菜單的中間位置,而置于這個(gè)地方也是出于一個(gè)簡單的概念。

“就算你現(xiàn)在不發(fā),萬一看到了,就想發(fā)了呢”?

以此為基礎(chǔ),所引發(fā)的做法則是提高“發(fā)布入口”的曝光率以及視覺權(quán)重,反復(fù)的告訴用戶。

“這里能發(fā)內(nèi)容,這里能發(fā)內(nèi)容,這里能發(fā)內(nèi)容”。

如此一來,我們便能理解為什么 發(fā)布內(nèi)容這樣一個(gè)重要的功能,卻被放在了標(biāo)題欄右側(cè)。

△原因有三:

微信高冷,不追求用戶發(fā)布朋友圈的頻率及數(shù)量

用戶是需求方,有需求時(shí),可以讓用戶付出行為成本

盲目跟風(fēng),搞不清楚誰是需求方

▌結(jié)尾

現(xiàn)在你知道標(biāo)題欄的設(shè)計(jì)原理了嗎?

標(biāo)題欄是容易被忽視的地方,基本不在人們的視線熱力區(qū)域。

用戶對功能有迫切使用欲望。

標(biāo)題欄的分享,設(shè)計(jì)原理是對H5的兼容,并不是用戶習(xí)慣。

若功能的需求方是用戶,那就放在標(biāo)題欄吧。

反之,若功能的需求方是產(chǎn)品本身,切忌放在標(biāo)題欄,會被忽視的。

文章名稱:如何設(shè)計(jì)“標(biāo)題欄”?
分享路徑:http://m.rwnh.cn/news42/103742.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)建站網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、App設(shè)計(jì)、面包屑導(dǎo)航、域名注冊

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

南丹县| 扶余县| 东平县| 十堰市| 怀仁县| 宜宾市| 青浦区| 平邑县| 巴中市| 邵阳市| 含山县| 西昌市| 明星| 太仓市| 馆陶县| 淳安县| 稻城县| 沭阳县| 金溪县| 马鞍山市| 乌鲁木齐县| 潮安县| 河北区| 波密县| 东台市| 镇雄县| 霍州市| 丁青县| 博野县| 武定县| 乌拉特后旗| 瓮安县| 报价| 三都| 靖江市| 穆棱市| 麻江县| 雷州市| 昌宁县| 德惠市| 莲花县|