網(wǎng)站氛圍漫談
互聯(lián)網(wǎng)在從推送式信息展示邁向以互動(dòng)和用戶自內(nèi)容產(chǎn)生的時(shí)代進(jìn)程中,我們關(guān)注新的營(yíng)利模式,關(guān)注精細(xì)化用戶營(yíng)銷,關(guān)注用戶體驗(yàn)研究,關(guān)注更完善的信息架構(gòu)和頁(yè)面展示,與此同時(shí),我們還常常會(huì)詢問(wèn),我們的網(wǎng)站是否給用戶傳達(dá)出一種體現(xiàn)品牌訴求的氛圍。
在所承擔(dān)的項(xiàng)目中,經(jīng)常會(huì)和產(chǎn)品經(jīng)理一起討論,如何營(yíng)造一種安全或熱鬧或嚴(yán)肅或輕松的網(wǎng)站氛圍,去打造一種相對(duì)明確的產(chǎn)品特色,傳達(dá)給用戶,以期待獲得良好的美譽(yù)度。應(yīng)該從哪幾個(gè)緯度去把握,產(chǎn)品功能?信息架構(gòu)?操作方式?還是視覺(jué)效果?
先舉幾個(gè)例子,看看網(wǎng)站氛圍是怎么影響我們的體驗(yàn)的:
案例1.體育直播
體育直播改版前,曾做過(guò)用戶體驗(yàn)考核,其實(shí)可用性問(wèn)題不多,關(guān)鍵任務(wù)(定位直播內(nèi)容、觀看直播內(nèi)容、參與互動(dòng))都還能準(zhǔn)確完成,然而卻很多用戶抱怨道,沒(méi)有點(diǎn)擊欲望,沒(méi)有感受到自己是在一個(gè)直播的頻道,沒(méi)有那種熱烈而緊張的氣氛。
圖1 改版前的體育直播頁(yè)面
分析下改版前的頁(yè)面:
1) 界面表現(xiàn)平平,視覺(jué)區(qū)域分為兩大塊,左邊樹(shù)形瀏覽視圖,按時(shí)間維度和直播兩種排列方式實(shí)現(xiàn)不同賽事的轉(zhuǎn)換,典型的windows資源管理器的體驗(yàn),沒(méi)有時(shí)間和賽事組合的展現(xiàn)方式,缺乏對(duì)即將開(kāi)始的賽事的突出展示;
2) 右側(cè)分為四個(gè)模塊,“圖文并茂”靜態(tài)展示熱點(diǎn)賽事,模塊內(nèi)推薦內(nèi)容和當(dāng)前直播內(nèi)容關(guān)聯(lián)度低
3) 直播聊天室和評(píng)論里垃圾內(nèi)容較多,無(wú)相應(yīng)的內(nèi)容篩選機(jī)制,降低了網(wǎng)站的信賴感
4) 媒體介質(zhì)只有文字和圖片,且圖片的比例較少,無(wú)動(dòng)態(tài)展現(xiàn)效果
改版后,
1) 文字和圖片內(nèi)容運(yùn)營(yíng)做了優(yōu)化,針對(duì)當(dāng)前熱門(mén)賽事進(jìn)行相關(guān)文章主題關(guān)注
2) 直播入口豐富化,按照直播內(nèi)容、直播頻道和賽事資訊劃分
3) 模塊間優(yōu)次關(guān)系清晰,部分直播內(nèi)容增添了音視頻多媒體展現(xiàn)
圖2 改版后的體育直播頁(yè)面
這樣一來(lái),賽事的緊迫、比賽資訊的豐富、各種花絮交織的娛樂(lè)感躍然于眼前,也許還不是最好,但相對(duì)改版前的平淡無(wú)奇已經(jīng)有了很大的進(jìn)步。
案例2 公益網(wǎng)站
一場(chǎng)牽動(dòng)億萬(wàn)中國(guó)人的天災(zāi),使得公益網(wǎng)站一時(shí)間作為焦點(diǎn)頻頻出現(xiàn)在人們面前,一起來(lái)看看各大門(mén)戶網(wǎng)站的公益網(wǎng)站:
騰訊:標(biāo)準(zhǔn)模塊化的排列,第一屏從上到下分別是banner展示圖、個(gè)人帳號(hào)信息、新聞資訊類和在線捐助。其中熱點(diǎn)新聞、人物和話題焦點(diǎn)間沒(méi)有重點(diǎn)優(yōu)次的比例區(qū)分。頁(yè)面內(nèi)公益信息展示和互動(dòng)捐助都有所體現(xiàn)。
圖3 騰訊公益網(wǎng)(http://gongyi.qq.com)
搜狐:純新聞資訊類的版式,大量文字排版,內(nèi)容多為網(wǎng)站編輯新聞,偏重主旋律感,沒(méi)有參與互動(dòng)類的欄目。
圖4 搜狐公益網(wǎng)
新浪:將公益內(nèi)容進(jìn)行精細(xì)化編輯,并采用多種媒體形式展現(xiàn),如博客、電子雜志等。另增設(shè)有實(shí)時(shí)刷新捐贈(zèng)的模塊,網(wǎng)站的整體參與度較高。
圖5 新浪公益網(wǎng)
三大門(mén)戶網(wǎng)站,同樣在訴說(shuō)公益,卻因不同的展示形式和側(cè)重點(diǎn),傳達(dá)給用戶截然不同的體驗(yàn):騰訊強(qiáng)調(diào)個(gè)人帳號(hào)信息,內(nèi)容互動(dòng)一起抓,搜狐走傳統(tǒng)媒體路線,講新聞?wù)f政策;新浪內(nèi)容編輯精細(xì),傳達(dá)一站式體驗(yàn),企業(yè)公益、草根愛(ài)心、福利彩票、音樂(lè)雜志都有涉獵。個(gè)人認(rèn)為,且不說(shuō)公益貢獻(xiàn)有多大,單單采用豐富的媒體介質(zhì)、向草根傾斜的編排展示,至少讓關(guān)注公益的人們有被尊重的感覺(jué),同時(shí)會(huì)對(duì)信息透明公開(kāi)的做法產(chǎn)生信任感。
案例3? 心情排行和列表展示
網(wǎng)站氛圍,不僅是體現(xiàn)在“宏觀”頁(yè)面排版和內(nèi)容放置。心情排行和列表展示這種細(xì)節(jié)表現(xiàn),也能帶來(lái)不同的感覺(jué)。
圖6 心情排行1
在上圖中,用戶的關(guān)注點(diǎn)很自然的被吸引在不同的心情類型上,有不同的心情可選,還能看出偏好度,圖形化的表現(xiàn)降低了認(rèn)知判別負(fù)擔(dān)。
而當(dāng)把數(shù)據(jù)放出來(lái)之后,具體數(shù)據(jù)反而起了騷擾作用。這些數(shù)字,太大了沒(méi)有實(shí)在意義,太少了,用戶會(huì)覺(jué)得自己是不是來(lái)到一個(gè)很爛的網(wǎng)站,才這么點(diǎn)流量,沒(méi)勁。
圖7 心情排行2
再看下列表展示,類滔滔的mini blog,頭像加喇叭框,有點(diǎn)Q的表現(xiàn),期待傳達(dá)出懶懶散散、自言自語(yǔ)、嘮嘮叨叨、嘰嘰喳喳的感覺(jué)。
圖8 嘮叨展示列表
而熱帖推薦列表,就更強(qiáng)調(diào)整體一致的清晰感,同時(shí)輔助信息(類別、點(diǎn)擊量)易找而不騷擾。
圖8 熱帖推薦列表(來(lái)自youku)
綜上所述,這是一種細(xì)節(jié)規(guī)避,將重要的,希望傳達(dá)的重點(diǎn)以對(duì)產(chǎn)品方有利的方式展現(xiàn)出來(lái),即使是同樣的組件,也要根據(jù)所傳達(dá)的產(chǎn)品特性進(jìn)行有側(cè)重的設(shè)計(jì)。
案例4? 財(cái)富通的捐錢(qián)頁(yè)面
還是地震時(shí)期的一個(gè)頁(yè)面:財(cái)付通捐錢(qián)??吹竭@個(gè)頁(yè)面,你是否有種想要捐款的沖動(dòng)呢?
圖8 財(cái)富通(https://www.tenpay.com)
這個(gè)頁(yè)面強(qiáng)調(diào)了兩點(diǎn):
1) 實(shí)時(shí)刷新顯示總額,營(yíng)造緊迫感
2) 以最能扣住用戶動(dòng)情點(diǎn)的文字來(lái)進(jìn)行轉(zhuǎn)換表達(dá),如生活費(fèi)、文具、課桌。
看到這些,相信每個(gè)人都有貢獻(xiàn)自己小小力量的沖動(dòng)。同樣是捐錢(qián),相比簡(jiǎn)單的捐款錢(qián)的數(shù)目羅列,通過(guò)Wording的簡(jiǎn)單變化,就能立刻增強(qiáng)緊迫感,升華捐款的意義。
案例5 開(kāi)心網(wǎng)
開(kāi)心最近很火,在開(kāi)心網(wǎng)上玩,時(shí)光總是如白駒過(guò)隙,且不談它的插件應(yīng)用如何契合了用戶情感點(diǎn),單單對(duì)我等懶人來(lái)說(shuō),舒舒服服窩在椅子里,只動(dòng)鼠標(biāo)不動(dòng)鍵盤(pán),就能在站點(diǎn)里四處晃蕩,盡情沉浸在這種非嚴(yán)肅、甚至有些小無(wú)聊的慵懶氛圍中,經(jīng)常玩玩,確實(shí)不失為一件開(kāi)心的事兒。
1) 精細(xì)化篩選好友,無(wú)需手動(dòng)輸入篩選條件
圖9 圖片來(lái)自開(kāi)心網(wǎng)
2) 根據(jù)使用場(chǎng)景自適應(yīng)內(nèi)容,省去鍵盤(pán)打字的操作
圖10 圖片來(lái)自開(kāi)心網(wǎng)
3) 所有可能需要鍵盤(pán)輸入的地方都給出了點(diǎn)擊推薦項(xiàng)
圖11 圖片來(lái)自開(kāi)心網(wǎng)
案例6? 氛圍繼承
網(wǎng)站氛圍,還有一部分是對(duì)線下生活的繼承而來(lái)。
1) 八卦
現(xiàn)實(shí)生活中,我們說(shuō)到八卦時(shí),個(gè)個(gè)神采飛揚(yáng),不停的爆出和話題相關(guān)的其他事件來(lái)舉證,同理可得,用戶看到某一個(gè)八卦新聞時(shí),適時(shí)的把同時(shí)期同類型的事件推送給他,對(duì)他而言,會(huì)產(chǎn)生一種“夠八卦,我喜歡”的感覺(jué),也就樂(lè)得多逛逛看看了。
圖12 圖片來(lái)自雅虎
2) 紙面媒體的排版借鑒
網(wǎng)上的信息鋪天蓋地、魚(yú)龍混雜,而雜志、報(bào)紙的專題作為已被二次加工的信息,嚴(yán)謹(jǐn)且更有深度。在網(wǎng)頁(yè)上采取類似的形式,可以給用戶傳遞這樣一種信息:我們?cè)谡J(rèn)真為您挑選您值得關(guān)注的信息。
圖13 圖片來(lái)自QZONE社區(qū)(qzone.qq.com)
3) 讀書(shū)
悠悠下午,一捧香茶相伴抑或挑燈夜讀,孜孜不倦。讀書(shū)是一件大事,看場(chǎng)地看時(shí)間也看心情。當(dāng)當(dāng)就把這種氛圍給借鑒過(guò)來(lái),雖然很小的一點(diǎn),但卻足夠貼心。
圖14 圖片來(lái)自當(dāng)當(dāng)網(wǎng)
綜上所述,想營(yíng)造一種網(wǎng)站氣氛可以試著從以下幾點(diǎn)來(lái)把握:
1、模塊內(nèi)容的優(yōu)先級(jí)
2、是否采用多媒體介質(zhì)
3、圖文如何搭配,文字的長(zhǎng)度、圖片的大小
4、頁(yè)面空白比例
5、靜態(tài)展示內(nèi)容和互動(dòng)內(nèi)容的排布
6、鼠標(biāo)、鍵盤(pán)的操作頻度和交替
7、是否需要實(shí)時(shí)刷新
8、關(guān)注用戶群體歸屬感、被尊重等心理需求
9、是否允許自定義
10、動(dòng)態(tài)效果的強(qiáng)度和數(shù)量
11、Wording揚(yáng)長(zhǎng)避短
12、提煉繼承線下生活體驗(yàn)
以上是一些想法漫談,歡迎更多的討論補(bǔ)充。謝謝!
- (本文出自Tencent CDC Blog,轉(zhuǎn)載時(shí)請(qǐng)注明出處)
- 目前還沒(méi)評(píng)論,等你發(fā)揮!