四、翻頁的創新 【替代法】

傳統的翻頁方式是“上一頁+頁碼+下一頁”,大家最熟悉的設計。

Bing圖片搜索

Google reader

看圖購

而近年興起的這種“無盡滾動翻頁”的翻頁方式,即滾動條拖動到最底部后開始加載后面的內容,而不再有“上一頁+頁碼+下一頁”這樣的鏈接。

相對而言twitter、Iphone app store這樣的“遞進式翻頁”則沒那么激進,保留了一個翻頁按鈕,是介于傳統翻頁與無盡滾動翻頁的一種折中方式。

上圖是Google book search一個巧妙的翻頁設計,鼠標懸停在文檔底部一個局部區域(高度約50px)時,出現一個半透明的層,點擊這個層開始翻頁。這個巨大的輔助翻頁按鈕,大大提升了翻頁的便利性,且對界面影響很小。

這里講到的翻頁組件創新,是用新的翻頁方式替代傳統翻頁組件。從信息的結構來看,傳統翻頁是將信息分段,而“無盡滾動翻頁”屬于信息滾動。這兩種方式對應現實生活中的原型是:書籍和電影膠片,書籍把信息拆分到每頁里去翻動,電影膠片的信息則一幀幀的滾動而過。

從信息流動速度和翻頁便利性來看,“信息滾動”遠遠大于“信息分段”。這兩種翻頁方式應該如何選擇?我想這應該取決于用戶對后面內容的需求強度,像google搜索結果頁這種越往后信息質量越低的場景,用戶對翻頁需求并不那么強烈。Google reader這樣不是按信息質量排序的場景,提供高速的翻頁方式是個相對必要的做法。需要注意的是,滾動翻頁不利于內容準確定位和信息回溯。

信息流動速度對信息接受者心態有很大影響,流動速度越快信息吸收量相對越小,所以閱讀pdf文檔比閱讀紙質書籍心情急躁,忍不住去翻頁,是在“掃描”而不是“閱讀”(個人主觀感受,如有雷同純屬必然)

由此也延伸出一點,交互設計師的工作職責除了架構信息,還應該控制信息的流動速度和供給量。

總結

最后,以一張圖片總結交互組件創新的四種方式,一家之言希望對大家有所啟發。創新無定法,必然存在更多創新方式,歡迎交流補充: pigtwo#gmail.com

不一樣的交互組件(上)

不一樣的交互組件(中)

本期碳酸飲料會完整PPT下載>>