資訊類產(chǎn)品閱讀列表的交互設(shè)計(jì)思考

2022-06-21    分類: 網(wǎng)站建設(shè)

列表,定義為:以表格為容器,裝載著文字或圖表的一種形式。根據(jù)產(chǎn)品類型的不同,大部分都有其各自樣式的列表,有些成為產(chǎn)品的主體,有些則為其他頁(yè)面的輔助。列表設(shè)計(jì)的主要目的,就是讓用戶快速瀏覽、掃描,從中選擇出自己想要“費(fèi)力”點(diǎn)擊并“費(fèi)時(shí)”去仔細(xì)閱讀的內(nèi)容。

  與傳統(tǒng)閱讀平臺(tái)比較,閱讀列表就像是實(shí)體書中的目錄。小說(shuō)的目錄簡(jiǎn)潔:標(biāo)題+頁(yè)碼;雜志的目錄則相對(duì)豐富:標(biāo)題、副標(biāo)題、圖片、摘要、頁(yè)碼,精致的排版,有些甚至還包括廣告。每種內(nèi)容都會(huì)有適合其展現(xiàn)的列表形式,資訊類產(chǎn)品的閱讀列表需要考慮的幾點(diǎn):

  1. 視覺(jué)重心

  把產(chǎn)品希望用戶看到的內(nèi)容凸顯出來(lái),引導(dǎo)用戶去閱讀那些重點(diǎn)推薦的內(nèi)容。

  在閱讀信息的時(shí)候,常常受到周圍文字和圖像的干擾,并不是那么順暢,根據(jù)人眼視覺(jué)心理,網(wǎng)站制作公司,會(huì)有幾種容易引導(dǎo)或者說(shuō)干擾到視覺(jué)移動(dòng)方向的特點(diǎn)。

  1) 視線引導(dǎo)

  a. 一般,暖色比冷色,鮮艷比暗淡,更容易吸引視線。

  一般閱讀時(shí),視線是從左到右從上到下的,但顏色的引導(dǎo)會(huì)改變視線的順序。合理運(yùn)用能給列表以重點(diǎn),反之則會(huì)破壞用戶的心理預(yù)期,造成閱讀的負(fù)擔(dān),影響認(rèn)知效率。

  b. 圖片比文字更吸引人。

  圖片在視覺(jué)傳達(dá)上能輔助文字,幫助理解,更可以使版面立體、真實(shí)。

  大多數(shù)資訊類列表中都含有文章配圖的縮略圖。縮略圖的擺放位置,根據(jù)產(chǎn)品定位也有所不同。

  更專注于資訊本身較為穩(wěn)重的產(chǎn)品,傾向于將縮略圖放在新聞標(biāo)題的后面。這類資訊內(nèi)容的圖片質(zhì)量往往較為一般,同時(shí),能夠讓用戶處于較平穩(wěn)的心態(tài)閱讀每一條標(biāo)題,從而選擇自己喜歡的內(nèi)容,圖片只期待起到輔助標(biāo)題的作用。

  而對(duì)于偏娛樂(lè)化,碎片化的資訊類產(chǎn)品,縮略圖放在標(biāo)題前面能夠更直觀的傳達(dá)出內(nèi)容的含義,網(wǎng)站設(shè)計(jì)從而縮短用戶理解文字標(biāo)題的時(shí)間,讓用戶的時(shí)間順著右側(cè)的圖片向下快速瀏覽,起到快速篩選的目的。

  c. 環(huán)形能夠匯聚視線

  d. 視線會(huì)隨箭頭,或數(shù)字或編號(hào)移動(dòng)。

  規(guī)律的箭頭或數(shù)字排布,容易造成頁(yè)面一側(cè)過(guò)重,或有強(qiáng)烈的提示意味,要注意頁(yè)面的平穩(wěn)。

  2) 突出

  如果需要你認(rèn)為用戶會(huì)感興趣的文章,或者花了很多功夫設(shè)計(jì)的部分真的吸引到他們的注意,那就要想辦法把這些部分“突出”出來(lái)。

  最簡(jiǎn)單的方法是使用亮色的樣式,或者改變?cè)擁?xiàng)的背景顏色。還可以為這篇文章找一個(gè)可以突出于其他層次的位置,比如在標(biāo)題前面放一個(gè)縮略圖之類的。但也需要考慮到頁(yè)面的整體視覺(jué)效果,一個(gè)原則是“太多重點(diǎn)等于沒(méi)有重點(diǎn)”。

  3) 反饋

  給予已閱讀內(nèi)容相應(yīng)的視覺(jué)反饋,并使用區(qū)別于“突出”內(nèi)容的交互方式。比如已經(jīng)使用不同顏色的圓點(diǎn)區(qū)別內(nèi)容的重點(diǎn)或普通,就不要再用圓點(diǎn)的形式提示已讀。相同的樣式在人們的心中暗示相同的內(nèi)容,而未讀和已讀則是同種內(nèi)容的兩種狀態(tài)。

  2. 不打擾

  1) 長(zhǎng)列表

  如果能夠有效的掃視瀏覽,長(zhǎng)列表并不會(huì)是種麻煩,至少它可以讓瀏覽不用付出多少努力和代價(jià)。

  在資訊類的長(zhǎng)列表中,沒(méi)有必要使用標(biāo)準(zhǔn)的頁(yè)碼指示,原因如下:

  a. 從一個(gè)閱讀內(nèi)容的世界到一個(gè)導(dǎo)航的世界。

  當(dāng)每一次用戶都通過(guò)選擇頁(yè)碼去看更多內(nèi)容,他需要把自己從一個(gè)閱讀內(nèi)容的世界拖出來(lái),再放到一個(gè)導(dǎo)航的世界中去。用戶思考的不再是他們要閱讀什么樣的內(nèi)容,而是怎么找到更多的東西去看。選擇頁(yè)碼增加了自然的停頓時(shí)間,也給了用戶機(jī)會(huì)能夠評(píng)估他們是否想要繼續(xù)閱讀或者是直接離開(kāi)。

  b. 另外頁(yè)碼沒(méi)有本質(zhì)的含義。

  用戶按頁(yè)碼選擇只是為了方便他們找到在第2頁(yè)或者更早以前想要閱讀的內(nèi)容而已。給他一個(gè)更好的方法,比如按照周、月、年,分類,標(biāo)簽等屬性的方式篩選,遠(yuǎn)比頁(yè)碼有效的多。也有很多的移動(dòng)終端中,使用了分頁(yè)的指示控件,但將頁(yè)碼數(shù)去掉了,這不失為一種好辦法。

  2) 廣告

  閱讀的重點(diǎn)在于內(nèi)容,用戶并不在意看到與內(nèi)容相關(guān)的廣告,或不影響列表瀏覽的廣告。

  經(jīng)常使用瀏覽器或使用免費(fèi)應(yīng)用的用戶應(yīng)該已經(jīng)較為習(xí)慣廣告的存在,也能夠理解廣告于產(chǎn)品的意義,只要不太打擾他們的正常閱讀就好。

  a. 不要假裝廣告是一則有趣的內(nèi)容。

  這樣做雖然可以增加廣告的點(diǎn)擊量,但是用戶也會(huì)因?yàn)椤笆茯_”而惱怒,帶來(lái)不好的體驗(yàn)。

  b. 為內(nèi)容提供相關(guān)的廣告。

  數(shù)據(jù)表明,用戶愿意點(diǎn)擊與汽車相關(guān)的廣告。當(dāng)用戶查看車型的時(shí)候,相應(yīng)的專賣店推薦正好為他提供了購(gòu)買的渠道,甚至比價(jià)的渠道,用戶當(dāng)然欣然前往。

  c. 易于忽略。

  有時(shí)為了列表的整齊和產(chǎn)品的美觀,在設(shè)計(jì)中會(huì)將廣告插在列表間,并假裝它是列表中的一條項(xiàng)目。但應(yīng)盡量減少?gòu)V告的視覺(jué)效果,讓其看起來(lái)不起眼,可以輕松跳過(guò)而不被意識(shí)到。

  有些將廣告放在頁(yè)頂部的產(chǎn)品,雖然位置明顯,但可以通過(guò)按鈕關(guān)閉或只有下拉才顯示,也是種折中的選擇。

  3. 閱讀節(jié)奏

  整齊而重復(fù)的格式和產(chǎn)品把握“第一屏”的策略,容易使篩選閱讀列表的過(guò)程產(chǎn)生一種類似于“白噪音”的屏蔽效果。再好的東西都會(huì)產(chǎn)生“審美疲勞”,在稍長(zhǎng)時(shí)間的閱讀后,用戶往往會(huì)覺(jué)得內(nèi)容都相對(duì)平淡無(wú)奇而離開(kāi)列表,用戶體驗(yàn)。

  微博產(chǎn)品作為一種閱讀媒介的優(yōu)點(diǎn)在于它不時(shí)的出現(xiàn)亮點(diǎn),讓閱讀保持節(jié)奏和驚喜。

  保持節(jié)奏的呼吸可以讓運(yùn)動(dòng)更持久,保持內(nèi)容的節(jié)奏也會(huì)讓閱讀長(zhǎng)時(shí)間的延續(xù)下去。有趣與無(wú)趣的交替反復(fù),給用戶休息和從新提起興趣的間歇,加上對(duì)于下一個(gè)小驚喜的期待,從而產(chǎn)生產(chǎn)品整體的舒適體驗(yàn),而不是很多有趣之后與很多無(wú)趣的平均值。

  4. 列表中的項(xiàng)目

  大部分產(chǎn)品都會(huì)包括的項(xiàng)目有:標(biāo)題,摘要,發(fā)布日期,操作(點(diǎn)擊閱讀更多,查看更多);

  常見(jiàn)的項(xiàng)目:分類,縮略圖,評(píng)論數(shù),圖片數(shù),作者。

當(dāng)前標(biāo)題:資訊類產(chǎn)品閱讀列表的交互設(shè)計(jì)思考
URL網(wǎng)址:http://www.muchs.cn/news35/170285.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供Google、網(wǎng)站改版微信公眾號(hào)、網(wǎng)頁(yè)設(shè)計(jì)公司、手機(jī)網(wǎng)站建設(shè)、服務(wù)器托管

廣告

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

手機(jī)網(wǎng)站建設(shè)