您當(dāng)前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設(shè)計(jì)教程 >> 設(shè)計(jì)理論 >> 瀏覽設(shè)計(jì)教程

社會(huì)化網(wǎng)絡(luò)的核心,信息內(nèi)容設(shè)計(jì)

 

        在我們生活中,不僅僅有書、雜志、報(bào)紙、電視等等這些傳統(tǒng)媒體供我們獲取各種信息,而且還有電腦網(wǎng)絡(luò)、移動(dòng)互聯(lián)網(wǎng)等這些網(wǎng)絡(luò)媒介,使得各種信息的獲取更為便捷。我們可以通過各類的社交網(wǎng)絡(luò),來了解朋友、同學(xué)、同事、家人,他們又更新了什么新動(dòng)態(tài),發(fā)了什么新照片,去哪里吃飯了,推薦什么東西好用。。。等等。

 

所以,信息(FEED)是用戶信息獲取的來源,是SNS網(wǎng)站上非常關(guān)鍵的元素,在這類網(wǎng)站中,F(xiàn)EED就是那些信息墻,它會(huì)給我們推送各類動(dòng)態(tài)信息,如facebook的wall、開心上的好友動(dòng)態(tài)。

本質(zhì)上,從信息設(shè)計(jì)的角度來說,無論是傳統(tǒng)的平面媒體,還是SNS網(wǎng)站中的FEED,都要考慮到信息的易讀性信息獲取的效率(特別是在信息紛繁復(fù)雜的怎么快速讓用戶選擇他需要的內(nèi)容),同時(shí)結(jié)合社交網(wǎng)絡(luò)的特性來分析如何去更好設(shè)計(jì)的信息獲取的來源 — FEED。如何提高信息的可讀性和信息獲取效率,當(dāng)然這兩者之間相互聯(lián)系,易讀性強(qiáng)自然帶來效率的提高,我們通過幾個(gè)例子來具體分析說明。

 

        (一)信息區(qū)塊感

        對(duì)比Facebook和開心的feed,用戶的識(shí)別,前者直接通過頭像照片能夠清晰辨認(rèn)信息的來源,而后者只有用戶名,相對(duì)來說,圖片更容易行程明顯的區(qū)塊感,識(shí)別性高于文字。

        然后我們?cè)侔堰@兩個(gè)頁面處理成灰框模式,來看下更清晰的信息布局(推薦更快捷的方式:原型工具wirify,可以將任意網(wǎng)頁轉(zhuǎn)換成線框圖以觀察布局)。前者的信息區(qū)塊感更強(qiáng),信息布局整齊;后者的信息相對(duì)比較散亂,容易造成用戶視線的跳躍。因此我們?cè)谠O(shè)計(jì)中,要對(duì)不同信息模塊分區(qū)塊布局,相同的內(nèi)容、功能、操作可以各自區(qū)塊劃分,避免各個(gè)信息點(diǎn)太多太散亂。

        Tumblr和輕博客,則是在視覺上通過明顯的色塊區(qū)分來強(qiáng)調(diào)信息區(qū)塊,能夠明顯感受到內(nèi)容清晰,閱讀順暢,提高獲取信息的效率。

 

(二)提供信息分類的過濾

        在一大片信息密集的頁面中,就如在一片七嘴八舌的充滿各種聲音的場(chǎng)合,如何快速選擇你所需要的信息?按照我們的習(xí)慣,我們會(huì)直接找到感興趣的人,或者感興趣的話題圈子去交流。

同樣在我們?cè)O(shè)計(jì)中,當(dāng)信息的豐富量達(dá)到一定程度時(shí),需要把信息分組,并且提供信息的篩選,有對(duì)信息來源的分組,對(duì)內(nèi)容的分組,對(duì)內(nèi)容類型的分類等等。

 

 

 

 

 

(三)重點(diǎn)突出,清晰的信息層次感

我們?cè)谛r(shí)候?qū)W語文的時(shí)候總是有一項(xiàng)提煉主要內(nèi)容,其實(shí)這對(duì)于我們?cè)谠O(shè)計(jì)信息的時(shí)候也很有幫助,當(dāng)我們能夠把最主要的信息提煉出來的時(shí)候,也就分清了信息的優(yōu)先層級(jí),決定了之后的信息層次體現(xiàn)。

        如果把sns網(wǎng)站中的feed按照這個(gè)方式來提煉,那么每條信息可以重點(diǎn)簡(jiǎn)化為“誰說了什么,在什么時(shí)間(什么地點(diǎn)/通過什么方式)”當(dāng)然sns是少不了用戶的互動(dòng),因此還有一個(gè)信息互動(dòng)模塊。總結(jié)每條信息的構(gòu)成主要由“人+內(nèi)容+時(shí)間(地點(diǎn)/來源/方式)+信息互動(dòng)”。

一般來說,我們會(huì)把“人”和“內(nèi)容”以突出重點(diǎn)顯示,“時(shí)間(地點(diǎn)/來源/方式)”等輔助信息以相對(duì)弱化的顯示,使信息層次更清晰。

        再來對(duì)比QQ空間和新浪微博,對(duì)于信息互動(dòng)區(qū)塊的處理有比較大區(qū)別,從突出核心信息的角度出發(fā),前者在feed中穿插顯示了部分評(píng)論內(nèi)容,而微博則是不出現(xiàn)評(píng)論內(nèi)容,相對(duì)來說后者更為突出信息內(nèi)容的本身,對(duì)于用戶獲取信息的干擾更少。但是兩者是不同定位不同類型的產(chǎn)品,因此前者有可能從提高用戶互動(dòng)的考慮,需要加重信息互動(dòng)的重要性。

因此,對(duì)于突出核心內(nèi)容,體現(xiàn)信息層次來說,可能需要平衡產(chǎn)品的各方面考量的情況下,盡量簡(jiǎn)潔突出重點(diǎn)。

 

(四)減少在獲取主要內(nèi)容時(shí)頁面的跳轉(zhuǎn)

 

 

        目前各類社交網(wǎng)站,對(duì)于feed中包含的圖片視頻等,基本上都是在本頁面顯示,避免新開頁面,減少信息瀏覽的中斷。對(duì)于評(píng)論等內(nèi)容,也是點(diǎn)擊后展開,當(dāng)評(píng)論數(shù)超過一定數(shù)量,才點(diǎn)擊去新頁面查看。

 

 

        甚至twitter有一次改版對(duì)于相關(guān)內(nèi)容的處理,當(dāng)你點(diǎn)擊一條feed時(shí),右側(cè)的內(nèi)容面板會(huì)顯示與此用戶相關(guān)的其他內(nèi)容,包括具體內(nèi)容,該用戶發(fā)布的其他內(nèi)容等等。這些處理能夠讓我們?cè)跒g覽信息時(shí)盡量減少跳到新頁面,保證瀏覽信息的流暢性。

[教程作者:admin]
免責(zé)聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請(qǐng)注明出處,素材資料僅供個(gè)人學(xué)習(xí)與參考,請(qǐng)勿用于商業(yè)用途!
本文地址:http://m.pkvc.cn/tutorial/di1518.html
如何成為配色達(dá)人
不要為了1%用戶的需求去影響99%用戶的正常操作
圖趣網(wǎng)微信
建議反饋
×