關于介紹「刷新的類型」的文章，各類論壇、公眾號有很多，也并不復雜，我就最常用的「下拉刷新」，從品牌、功能、驚喜、運營、反饋五個維度結合情感化設計，分享一些我的個人看法。
我理解的刷新是頁面中有緩存數據，從服務器獲取新數據的過程。
下拉刷新是十分常見的一種操作，并且在下拉刷新的時候，整個頁面也會跟著下移，但是會存在一種彈性，頁面會恢復到初始狀態，在這中間會存在一個時間差。
iOS原生系統的刷新形態是這種普通的旋轉菊花 loading，但是我們可以在下拉刷新中加入很多情感化的設計元素。
什么是情感化設計？Norman 在《情感化設計》一書中，提出了情感化設計的三個層次水平，分別是本能層次水平，行為層次水平，反思層次水平，以下是這三種水平的設計與產品特點的對應關系 ：
那怎么將情感化融入到設計里？以下拉刷新為例，因為后面我主要從品牌、功能、驚喜、運營、反饋五個維度分析下拉刷新，我將這五個維度映射到三種情感化的表達方式中，分別是外觀視覺，功能操作，產品特性。
- 比如品牌維度可能涉及到外觀視覺上要給人打造品牌印象；
- 比如功能維度可能涉及到巧妙的功能使用方式，有趣的操作體驗；
- 比如驚喜維度可能涉及到產品特性上要給人驚喜，勾起回憶，和用戶互動等。
一、品牌維度
在下拉刷新中融入產品品牌，可以加深用戶的品牌印象，因為一個產品的品牌建立，是日積月累在細節上給用戶的印象感知。
將品牌傳播分為三個層級：簡單品牌logo、品牌吉祥物、品牌場景故事。
1. 簡單品牌logo
比如開眼、想去、足記、大佬說這些 app 的下拉刷新使用產品 logo 或者 brand name 等簡單的形式作為下拉刷新的動畫。
△ 開眼
△ 想去
△ 足記
△ 大佬說
2. 品牌吉祥物
比如飛豬、閑魚、嗶哩嗶哩、美團使用品牌吉祥物的卡通形象作為加載動畫。
△?飛豬
△ 閑魚
△ 嗶哩嗶哩
△ 美團
3. 品牌場景故事
比如美團外賣的下拉刷新，是一位外賣騎手在騎車，但是旁邊附有紅黃綠燈的切換，當切換到紅燈時，騎手停止騎車，切換到綠燈時，騎手繼續騎車…符合騎手配送外賣的場景故事（ 這一點的分析我有在公眾號每日微交互里分享過）
比如好奇心日報的下拉刷新，訴說的品牌故事是：好奇驅動你的世界。
再比如京東的下拉刷新，是配送員端著快遞盒在奔跑，并且附上京東的 slogan：讓購物更便捷 ，符合京東的產品定位，也突出京東與其他電商平臺的差異化競爭力：購物更便捷，獨立配送員，配送更快。
類似的還有蘇寧的下拉刷新。
二、功能維度
我把以下這些歸為功能維度是因為這些下拉的場景，已經不局限于刷新，還給下拉賦予了新的功能。
我把它們分為三類：快捷操作、新功能入口、多空間的交互。
1. 快捷操作
比如微信讀書文章頁，下拉是快速添加書簽和刪除書簽，比從 icon 里進入再去添加/刪除書簽更快捷。
再比如紅板報的文章頁，下拉是快速返回文章列表，這跟紅板報產品本身的手勢操作特色：「上滑下滑的卡片翻折切換列表」 相一致。
2. 新功能入口
比如微信的下拉可以展示最近使用的小程序：
TIM 的下拉可以新建待辦事項：
KEEP 的下拉可以載入 KG等級與成長值：
3. 多空間交互
當然「多空間交互」是我自己瞎取的一個名字，可以理解為下拉后切換到另外一個空間，如日簽，二樓等等。
比如淘票票的下拉切換到日簽：
潮汐下拉切換到日簽：
淘寶下拉切換到淘寶二樓：
三、驚喜維度
比如網易新聞的下拉刷新，出現的是與刷新無關的文案內容，并且每次文案會不一樣，有日歷，格言，段子等，帶給用戶驚喜。
比如在生日那天，在京東的個人中心頁下拉刷新，京東給用戶定制的生日驚喜。
比如58同城里的首頁下拉刷新，每一次下拉給的文案內容都不一樣，可能是告訴用戶 app 里的一些功能，可能是一句很貼心的問候，可能是一句賣萌求好評等等。
我有嘗試過20多次，每次都是不同的問候語，每一句話都很意外很驚喜，這種刷新的方式不但不會讓用戶感到煩躁，反而會不斷勾起用戶好奇心，吸引用戶不斷刷新。
四、運營維度
運營維度的話，一般是指活動運營，并且一般是下拉后跳轉至一個 H5頁面。
感覺運營維度可以發散很多，下拉領取紅包，下拉送券等等。
比如去哪兒旅行的國際暑期大促活動；
比如房多多的看世界杯 瓜分購房基金活動：
比如優酷在下拉里面加入了運營廣告位：
五、反饋維度
反饋維度，可以這么理解，用戶下拉后系統會給出哪些指示以及下拉后的反饋狀態，或者說給用戶一個預告內容。
比如網易云音樂下拉后會告訴用戶「首頁內容根據你的口味生成」，給用戶一個預期的反饋：
用戶在下拉開始，每一步操作都會有對應的反饋，最常見的就是：下拉刷新 - 松開刷新 - 刷新中。
比如華爾街見聞發現頁的下拉刷新：
一般對于內容型產品，在刷新后都會給一個 HUD反饋刷新XX條內容，比如今日頭條的下拉刷新經歷了四個狀態的反饋：下拉刷新 - 松開刷新 - 推薦中 - XX條更新。
但是更重要的是需要知道什么時候顯示什么反饋狀態，是看用戶的下拉張力、加速度？還是看頁面下移的距離？或者其他計算方法？
（交互設計師可以在交互輸出文檔中需要設計下拉刷新的地方，用文字描述場景以及文案，手勢操作等，這樣可以讓視覺設計師根據這個需求進行設計。）
總結
- 情感化設計的三個層次水平：本能層次，行為層次，反思層次；
- 將情感化設計融入下拉刷新：外觀視覺、功能操作、產品特性；
- 關于 「下拉刷新」分析的幾個維度：品牌、功能、驚喜、運營、反饋；
- 品牌傳播的三個層級：簡單品牌logo、品牌吉祥物、品牌場景故事；
- 下拉可以不局限于「刷新」，我們可以給下拉賦予新的功能；
- 通過下拉的多變性，個性化定制等來給用戶制造驚喜；
- 當活動運營過多時，下拉可作為運營位。
什么時候顯示什么反饋狀態用什么方法判別？是看用戶的下拉張力、加速度？還是看頁面下移的距離？或者其他計算方法？歡迎討論。
歡迎關注作者的微信公眾號：「UED設計筆記」
圖片素材作者：Dannniel
「保證體驗無縫銜接的加載設計」
復制本文鏈接 文章為作者獨立觀點不代表優設網立場，未經允許不得轉載。
發評論！每天贏獎品
點擊 登錄 后，在評論區留言，系統會隨機派送獎品
2012年成立至今，是國內備受歡迎的設計師平臺，提供獎品贊助 聯系我們
標志設計標準教程
已累計誕生 729 位幸運星
發表評論 為下方 1 條評論點贊，解鎖好運彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓