輕松看懂規(guī)范！詳解組件控件結構系統(tǒng)之空數(shù)據(jù)類

Echo ：設計師或產品經理在設計產品原型時，大部分情況都是先設計主流程的主界面，然后設計其他各個場景的界面，最后設計非常界面、空數(shù)據(jù)界面等等。那么，空數(shù)據(jù)界面一共有哪幾種類型呢？這篇文章我們來看一下設計規(guī)范中的空數(shù)據(jù)類型。

系列文章： 

空數(shù)據(jù)類型一共有三類：

• 初始狀況
• 清空狀況
• 出錯狀況

仍舊附上一張腦圖，組件控件分類（假如單純通過組件控件，難以知足功能劃分的需求，所以我將這個范圍擴大，分類里面不僅僅含有組件和控件，所以請不要在意細節(jié)。）

初始狀況

定義：初始化狀況，沒有任何內容，必要用戶進行某種操作才能產生內容的界面。

用途：提醒用戶必要進行某種操作才會出現(xiàn)內容，并不是沒有內容。

例如京東App，當用戶沒有把商品加入購物車時，進入購物車界面，會給出提醒購物車界面為空，給出用戶提醒后，給出相對應的入口按鈕，指導用戶操作。假如直接給出一個空白界面，那樣的話用戶可能以為該界面出Bug了，不知所措。

Gmail直接用一個插畫提醒用戶收件箱為空。

初始狀況的組成部分：

• 相干插畫/圖片。
• 解說文案。
• 操作入口按鈕或可點擊筆墨（非必須）。

一樣平常對于初始狀況的設計，常規(guī)做法是簡單的插畫配合簡潔的文案，需要的時候給出指導用戶操作舉動的按鈕。

如今流行的設計趨勢是插畫越輕量越簡單越好，以免搶奪了文案信息。

清空狀況

定義：通過刪除或其他用戶操作，清空當前的網(wǎng)頁內容，產生了空界面，這時候必要有明確的提醒，且告知用戶該如何處理。

用途：提醒用戶該界面為空數(shù)據(jù)的緣故原由是用戶刪除了內容。

清空狀況是對初始狀況的進一步細化。清空狀況的界面和初始狀況設計很相似，唯一不同的是文案的提醒。

清空狀況的組成部分：

• 相干插畫/圖片
• 宣傳解說文案的
• 操作入口按鈕或可點擊筆墨（非必須）

有的產品設計直接把清空狀況的界面按照初始狀況來設計，如許也是可以的，瑕玷就是沒有告知用戶產生空狀況緣故原由是初始化照舊清空所致。

出錯狀況

定義：因為網(wǎng)絡、服務器或者沒有找他其他效果等緣故原由導致無法加載內容，產生了空界面，這時候必要有明確的提醒，且告知用戶該如何處理。用戶操作反饋的無效果界面也可以用如許的思路來設計。

用途：告知用戶當前產生的空界面是因為某些緣故原由出錯所致。

例如知乎在網(wǎng)絡非常時，網(wǎng)頁加載不出來，出現(xiàn)空數(shù)據(jù)網(wǎng)頁，給出文案提醒和點擊重試按鈕。微博國際版也給出文案提醒，小插畫和點擊按鈕。

在對信息進行搜索，無法獲取數(shù)據(jù)時，產生的空數(shù)據(jù)界面。例如iOS原生郵件在搜索不到內容時，產生的空數(shù)據(jù)狀況界面。而網(wǎng)易考拉在搜索無效果時，給出新的解決方案。

原有界面內容被刪除時，用戶點擊進入時出現(xiàn)的出錯狀況。例如QQ欣賞器，通過消息列表點擊，進入消息詳情，因為文章被刪除，會出現(xiàn)出錯狀況的提醒。

迎接關注作者的微信公眾號：「UEDC」