描述：以一種合適的方式告訴用戶正在發生什么，將會發生什么，減少用戶的等待感。
上下文情境：用戶進行一種操作后，打開APP，點擊列表，點擊下載等等，需要一定的時間的等待，加載結束后的過渡和隨后呈現。
任務流程：操作，加載，同時反饋，結果呈現
構成元素：進度條，無限循環指示器，
相關元素：太多，不列舉
設計標準：不要讓用戶無聊；給予用戶及時的反饋；讓用戶有流暢的使用體驗；用戶隨時可以取消

按照加載出現的前置條件可以分為下列幾種，只是列舉，可能會有考慮不全的地方

1開屏加載

這個是最常見的花樣也是最多的，各種開屏加載方式五花八門在iOS的設計規范中，對開屏的加載方式有了比較詳盡的指導：

盡可能避免使用啟動畫面或類似的啟動體驗。最好讓用戶可以立即開始使用你的app
顯示一個和app首屏及其相似的啟動畫面（框架，或背景色）。這可以讓用戶感覺你的app非?？?，并讓你有足夠的時間去加載內容
但作為一個開屏畫面，使用app的用戶都能看到的地方，不對它上下其手，是在不符合我們的商業利益，所以在開屏動畫這里一般會放入以下幾個東西代替交互規范的推薦

1）品牌展示

通常包括LOGO，品牌名稱，slogan；或者還有分發渠道（某某首發等）

2）活動頁面

在一些活動上線，或者一些隱藏功能，起到告知用戶的作用

3）廣告頁面

不解釋，不過最好配一些高大上的，有逼格的廣告

最后還有這個微信這個獨樹一幟的，充滿情懷的啟動畫面

2層級內切換

在同級頁面如tab間的切換，如果信息不多或可以復用，可以在一個頁面內先加載完成。如很多APP中的我的模塊，基本都是采用一個頁面加載多個的方式。如微信的個性信息。你進入微信后，即使關閉網絡，也能看到我頁面的信息。這樣在同級頁面間切換時會很流暢，同時也不會消耗太多流量，是一種平衡。

3層級間跳轉

如列表頁進入詳情頁，圖片詳情等。
1）如果頁面內容單一，采取全頁面加載，頁面會處于空白，這個時候需要一個無限加載循環或進度條來顯示狀態，讓用戶保持耐心。這個常見于只有一個元素的載入情形，或者也適用于全屏圖片加載。

2）如果頁面元素比較多，但框架比較固定，搜索進入進入結果頁，首頁進入列表頁等?？梢圆扇》謮K加載的方式。分塊加載，分步加載，優先重要內容，易加載信息；如果模塊有關聯性優先加載父內容；框架固定的，內容更新的，先把框架加載出來。加載用戶的等待感；帶入前置窗口已加載過的部分信息（如知乎，請忽略內容~）。

注意：這種加載方式要注意加載失敗的狀態，不能多個模塊提示多個錯誤，可以根據信息的優先級來決定哪些數據失敗采用默認狀態，哪些數據采用失敗提示。
在這方式下，可以采用預置的格式化信息（圖片的占位符，信息分割樣式，按鈕形狀顏色），在信息傳入前就把信息傳遞給用戶。

3）預先加載，這種在新聞列表頁面比較常見的一種加載方法，預判用戶會點擊的列表項，在用戶點擊前就加載頁面內容；或者在一些功能使用流程中（如閱讀中的預先加載下一頁），預判用戶操作流程提前一步。這種加載方式給予用戶無縫的使用體驗，使得用戶在使用產品過程中更直接流程，沒有被打斷的感覺。但這種加載方式容易消耗不必要的流量，要結合網絡情況和加載內容進行綜合考慮，可以只加載文字信息或關鍵信息。同時預先加載也是需要消耗時間，所以要同時考慮一種正常情況下的加載方式。

4界面內加載

1）模態提示層，app在觸發后加載后，出現模態提示層，防止用戶在加載過程中進行其他操作，導致當前加載出錯。如果采用模態加載，肯會因為網絡原因或內容過多導致長時間處于加載狀態，建議提供一個“取消”的操作。同時在安卓中的后退按鈕能關閉模態提示。

2）控件自身加載，把操作加載的狀態與控件的樣式結合起來，對某個控件進行操作后，控件變為加載狀態，此時控件不能重復操作，當加載完畢后，控件再作為顯示加載結果的狀態。比如說appstore的免費/獲取/打開按鈕，還要支付寶的支付按鈕，音頻軟件中常見的下載按鈕。這種加載方式是控件的自身狀態，不影響其他操作，所以用戶也可以對頁面進行操作，因此也會導致同時有多個請求的情況，增加了加載失敗的風險。請求失敗后可配合提示告知用戶失敗的原因。
3）導航欄加載，這個在微信里面比較常見，以導航欄的形式展現加載狀態，如剛進入的連接中，消息數，對方正在輸入等。將導航欄標題臨時變為加載信息，在用戶與產品互動過程中提供實時反饋，此時的產品不再是一堆冷冰冰的界面，而是一位善于溝通的人。

4）后臺加載，用戶在操作后，app立即反饋操作成功，然后把加載過程放到后臺，用戶不需要了解也不需要等待，例如微信里面的點贊。但因為后臺操作，可能有時候明明顯示成功，但其實失敗，所以一些比較重要的操作不太適合用這種方式來呈現。
5）界面內刷新，自從teitter出了下拉刷新后，這種無盡列表加載方式（下拉刷新，上拉加載更多）已經已經為廣大用戶所接受。列表頁面默認加載部分，在用戶進行操作后，根據用戶行為俠士更多列表內容，無需點擊下一頁。但這個會導致用戶沒有足夠的定位信息，不知道自己閱讀到哪里。很難再次找到以前見過的一些信息。懶注意，加載時需要注意一次要加載的內容的數量，一般是根據內容的大小和高度來決定，既能較快的載入內容，又能讓用戶更順暢地查看而不用一直等待加載；另一方面是加載的時間，好的懶加載會根據用戶的瀏覽速度去調節加載的時間點，而不是在瀏覽加載完內容后才開始繼續加載。
看看微信逆天下之大不違把小視頻放在聊天窗口的下拉里，導致網上罵聲一片，最近在最新的版本里有偷偷改掉。有些用戶習慣，可以被挑戰，有些不能~

5上述劃分是根據層級關系進行的加載方式區分，另外還有從網絡情況角度進行考慮

1）智能加載方式，根據網絡環境自適應加載。在不同的網絡情況下，智能判斷是否下載圖片，圖片質量（花瓣上傳）等，并且在網絡情況發生變化時提醒用戶變化情況。對于2G用戶給用戶提供最核心的少量內容，同時在更多內容的情況下也要提供手動查看這部分信息的操作（知乎圖片）。

2）離線訪問，移動場景帶來的網絡情況的多樣性，有時候用戶沒有網絡（網絡覆蓋），或者關閉網絡（流量限制）?？梢跃彺嬉徊糠謹祿磉M行離線訪問，這樣在斷網情況下也能使用英語，并能訪問已有的數據；減少流量的消耗；減少訪問時間。但考慮到手機空間，要設計合適的離線機制。并配合一定的清理緩存的機制。另外要考慮現在安卓手機清理軟件的橫行，要提醒用戶加入白名單，不然用戶會經常以為app出問題。

6使用一個確定的指示器

在加載過程中盡量使應用加載過程令人愉快，這時候有一個狀態指示可以減少用戶等待的焦慮感，同時在長時間加載中不會誤以為app崩潰。

對于完成部分可以確定的情況下，使用一個確定的指示器，他們會告知用戶操作所需的時間。
對于完成部分不確定，用戶需要等待，無需告知后臺的情況以及所需時間，這時可以使用一個不確定的指示器。

1)無限循環指示器

用于表明app正在執行某些處理。如果正在執行的處理影響范圍較大，可以使用模態的無限循環指示器。如果只是界面的一部分，可以采用小尺寸的提示信息。
如果顯示時間較長，筆者建議改用進度條來提示用戶當前的執行進度以及還需要等待多少時間，這樣能減少用戶的焦躁感。同時讓用戶可以取消這個狀態，或執行其他操作
ios（多個顏色深淺隨時間變化的圓角長方形來營造旋轉的感覺），安卓采用一個不斷旋轉的色彩深淺不一的環形圖標

2)進度條

瀏覽器的進度條是一種較為常見的進度告知設計，通過這個進度告知，讓用戶有了更加明確的知情權，也能更好的預期到加載完成的時間。但即便是小小的進度條，也有很多的設計技巧在里面。
一個非常經典的體驗設問，同樣是3s的加載時間，勻速的進度條、先慢后快的進度條、先快后慢的進度條，哪個讓用戶感覺上最快?經過科學的實驗證實，先慢后快的進度條是讓用戶心理感受上最快的設計。這是因為用戶最容易記住最后一瞬間的感覺，如果最后一瞬間，感知到了快，就覺得順暢了。但這點論點存疑，微信朋友圈網頁打開后進度條會快速前進一大半，然后再緩慢加載。不知道是不是有另外的依據。

3)自定義的動畫

自定義動畫現在是比較常見的指示器方式，加入與品牌相關的元素，增加趣味性。

一些相關書籍文章
《iOS設計規范》
《移動設計》
《APP這樣設計才好賣》
淺談移動端App的頁面載入方式
iOS App中數據加載的6種方式
隱藏在背后的交互設計

作者：靜默之思

來源：http://www.jianshu.com/p/5349de8d0c9c