交互設計：有趣的下拉刷新

下拉刷新這個操作最早由Tweetie創始人洛倫•布裡切特(Loren Brichter)發明，到現在已經非常廣泛地在各種應用中使用，Sparrow、Facebook、新浪微博、甚至是iOS原生系統也都在使用這種方 式。有理論認為，下拉刷新是一種適用於按照從新到舊的時間順序排列feeds的應用，在這種應用場景中看完舊的內容時，用戶會很自然地下拉查找更新的內 容，因此下拉刷新就顯得非常合理。隨著下拉刷新這種方式的不斷演變，下拉刷新已經跳出基礎功能，成為一種表現品牌、表現設計感的元素，本文主要介紹幾款有意思的下拉刷新。在收集過程 中發現，有一些應用是把應用類型巧妙地融合到了下拉刷新中;有很多應用的下拉刷新都是滲透了品牌元素，包括logo的顏色、icon的形狀等等，另外還有 一些就比較特別，是結合整個應用的風格去做了一些創新。因此本文把有趣的下拉刷新分為了三類來介紹。

第一類：與應用類型相關

大家可以猜下這個應用是做什麼的，這是一個叫Cheeze的應用，下拉時，界面會出現一個小老鼠，再往下拉小老鼠會掏出一個相機，松手之後咔嚓一下拍照。

根據老鼠的動作，我想很容易聯想到這是一個照片分享應用。這樣的下拉刷新設計，一方面傳達了這個應用的核心價值，另一方面也對品牌有了更深刻的印象，非常有趣。

第二類：與品牌元素相關

當看到一只藍色的小鳥，大家會很自然的想到Twitter;看到一個戴紅色圍巾的企鵝，大家會很自然地想到QQ;看到黃色中間帶Z的星星，大家也會想到QQ空間，這就是品牌的力量，在下拉刷新這個設計點上，有很多應用在堅持做自己的品牌推廣。

下圖是Flickr的下拉刷新，下拉時，首先出現Flickr水印，松手loading時，玫紅色和寶藍色圓圈開始轉動，相信Flickr的用戶對這兩個轉動的小圈圈再熟悉不過。

再下面是Google的兩個例子，它們都是圍繞Google品牌色的黃紅綠藍來做文章，當然不知道是不是因為是由不同部門分開設計開發的原 因，Google+和Gmail的下拉刷新在形式上稍微有點差別，個人覺得Google+的四條彩帶相對而言稍顯誇張，比較喜歡Gmail裡面折紙一樣不 停翻轉的圈圈。

嗡嗡是螞蜂窩出品的旅行分享應用，在下拉時候會出現一只振翅的小馬蜂，第一次進來還搭配有馬蜂嗡嗡的聲音，生動有趣。

想去是一個主推設計師市場的電商導購類的網站，設計一直比較別致，非常對設計師胃口，這裡給的圖不是下拉刷新而是加載更多，與品牌相關度比較高，覺得很有趣所以也就貼進來了。Loading過程中會有一條魚蹦出來，想去logo就會像一條鲨魚游動著追逐小魚，特別可愛。

第三類：特立獨行，我有我姿態

在手機側，各種層出不窮的小應用滿足著形形色色各種垂直化的需求，在設計方面大家也是想方設法去做一些創新，希望自己能夠在各種應用中脫穎而出，下拉刷新也就自然而然成為了一個展現自己個性的地方。

Tumblr一直是一個勇於創新的應用，從向上滑動寫操作按鈕可以快速出拍照、向右滑動快速進入寫說說界面、多圖支持自由拖動編輯等種種小細節的精 心設計都可以看出來，各種嘗試令人眼前一亮。在下拉刷新這一塊，Tumblr采用了iOS比較系統的方式，創新點在loading時，有三個小方塊呼吸態 躍動，這三個躍動的小方塊貫穿了Tumblr整個應用的刷新操作，比較有意思。

Twittelator是Twitter的一個第三方應用，整個應用把紙張的概念貫徹得非常好，寫操作是用一個動畫飄出來一張紙，下拉刷新這裡也采用了展開折紙的效果。

Timehop是一個可以整合自己各個平台老照片的應用，能夠很方便地跟朋友們分享你的那些美好時光，沒有研究過為什麼他們的下拉刷新會出現一個表情俏皮、朝大家招手的恐龍，但是第一次看到的時候就覺得特別可愛有趣。

網易應用中心的下拉刷新用了一個方塊在頁面上從左往右滾動，根據網速不同，方塊滾動的速度會有差異，還挺特別的，如果網絡不給力或者刷新成功的提醒，都會 有一個方塊從屏幕右側倒下來給出提醒。雖然不知道是不是技術問題，方塊在滾動過程中會有一點點鋸齒，但這總的來說也算是一個特別的刷新嘗試。

總的來說，下拉刷新這一部分的細節設計，可以是傳達產品價值、推廣品牌理念的一個機會，精心做一些特別一點的設計，就可以讓大家記住你。所以，我們 可以在以後的產品設計中，把握好產品大方向的同時，兼顧一些這種小細節設計，把我們的品牌元素和產品價值的東西能夠成為產品的一些小亮點，讓我們的應用能 夠在精致的路上，越走越好~