網站模式分析：Pinterest「瀑布流」背後的心理學

仲介交易 HTTP://www.aliyun.com/zixun/aggregation/6858.html">SEO診斷 淘寶客 雲主機 技術大廳

Pinterest很紅。 根據comScore的資料，2012年1月Pinterest的獨立訪客數達到1170萬，是除google+外最快達到千萬使用者的網站，穩居美國社交網站第七把交椅(前六位是Facebook、twitter、Linkedin、 myspace、google+、tumblr)，而國內也是山寨者眾多。

Pinterest為什麼會紅?原因是多方面的，比如對使用者來說極低的參與成本、更靈活的訂閱機制減少了資訊雜訊、Repin操作形成病毒性的擴散機制等，但是更受人矚目的就是其獨特的「瀑布流」圖片佈局。 這種佈局詬病者不少，但是我卻很喜歡，因為雖然這個創意來自于網站創始人在生活中的靈光一現，但是卻恰好符合人的視覺心理學規律，下面就分析一番：

這裡首先要從人眼感知文本內容和圖片內容的差異說起。 人閱讀文字是一種串列模式，必須一個詞一個詞按確定的順序線性地讀下來;而人觀賞圖片是並行模式，他可以在眾多圖片中快速地掃視，然後選擇其中自己感興趣的部分，這種方式比線性模式找到感興趣內容的效率要高得多。

所以很多典型的產品介面模式遵從了這種差異，比如：

1 搜尋引擎的搜尋結果頁，若是網頁搜尋結果都是線性排列，若是圖片搜尋結果都是矩陣排列(google和bing的圖片搜尋結果頁甚至去掉了所有的文本資訊，只有在滑鼠懸停在某張圖片才會出現文本，這種設計正是凸顯圖片並行流覽的優勢 );

2 SNS類產品、微博的feed頁面都是線性排列。 不過這裡有個問題，如果是純文字feed(如知乎)，線性排列是最佳模式，而圖文內容皆有的feed(如微博和SNS)，你會發現流覽圖片的效率比較低，因為圖片內容不適合線性排。

那麼傳統的圖片展現是以矩陣模式為主，搞一個交錯型的瀑布流模式是怎麼回事呢? 這裡首先要瞭解一下人眼的掃視路徑的影響因素是什麼。 這方面的認識取自認知心理學中有關「視覺搜索(visual search)」領域的大量研究。 目前心理學家的共識時，影響視覺搜索效率的因素主要是兩個：一個是人既有的經驗和習慣，是一種自上而下的影響;另一個是畫面本身的視覺顯著性，是一種自下而上的影響。 對於前者，我們都知道人一般是從上往下、從左往右看，所以一個矩陣式的多圖片頁面，其掃視路徑差不多受這種習慣影響而有些僵化。 對於後者，畫面本身的視覺顯著性(動態、顏色及其整體美感等)構成了一個「顯著性地圖(saliency map)」，使用者的注意力首先會被畫面中視覺上最顯著的部分所牽引。 所以自下而上的因素(圖片本身的因素)容易使使用者可以更高效地選擇到優質的視覺內容，而矩形模式下的掃視習慣會干擾自下而上的因素髮揮作用。

舉個例子來說，在搜尋引擎的圖片搜尋結果頁面中，如果有一張好圖位於頁面的右下角位置，你可能會先在頁面左上部徘徊幾下才能逐漸找到這種圖片;而在瀑布流佈局中，你則能更快地找到這張圖片。 所以說，線性模式是文本內容最好的佈局方式;瀑布流模式則是圖片內容(迄今為止)最好的佈局方式。

Pinterest更妙的一點是，使用者可以按自己的偏好選擇圖片視覺搜索的方式：雖然網頁預設有5列圖片，但當你把網頁縮小時，頁面中每張圖片縮小，同時列數增加(最多可增加到10列)，每頁同時呈現的圖片數量就會增加， 這對一些使用者來說就可以增加搜索的效率。

正由於瀑布流模式是一種十分高效的圖片流覽介面，所以吸引了很多使用者將它作為收集和欣賞圖片的工具，也正是這點，成為了Pinterest快速流行的最大動力。

版權聲明：轉載時請以超連結形式標明文章原始出處和作者資訊及本聲明

HTTP://xuexinlu.blogbus.com/logs/192808388.html