當一名產品設計師沒有考慮到某種場景時，整個產品的 UI 會變得"awkward". 這意味著沿著某條線遵循的邏輯規則被打破了。
這個規則就是"UI Stack".
The UI Stack
基本上，你處理的每個產品的頁面都有5個狀態，如上圖所示。
遵循 UI Stack 的規則和5個狀態，可以設計出人性化的一致性界面。
Ideal State
理想的頁面狀態是我們首次建立的，因為這是我們想要給用戶看得最多的狀態。
Empty State
空白狀態有3個版本，第一是用戶第一次使用你的產品所看到的內容；第二是當用戶清除屏幕中的數據時所看到的；第三是沒有任何東西出現，比如，搜索結果。大多數時候，處理這種狀態，要么出格，要么沒有應對措施。
用戶第一次使用產品時，你需要用直白的語言鼓勵他進行下一步操作，并讓他了解下一步操作的結果。還可以利用產品本身的內容指導用戶怎么做。或者，檢測用戶的操作進程，并適當回應，比如用戶停留某頁面太長時間，可以在線詢問是否需要幫助。
第二種空白狀態就是當用戶清空數據，這時候需要你獎賞用戶或者引導用戶進一步操作。第三種是有時候用戶在搜索時，沒有出現結果。我們需要避免出現這樣的情況，搜不到時可以提供另一個選項。
Error State
用戶在操作過程中，也會偶然出現錯誤提示。特別是在用戶輸入表單信息時，要做到保護用戶輸入內容的完整安全。另外出現的錯誤提示要易懂，下圖windows是個反例。
Partical State
除了出現理想狀態和錯誤狀態外，有時還會出現部分狀態，例如只顯示幾個數據或圖片，你要避免用戶在個這階段退出產品。
Loading State
還有網頁在 loading 狀態時，可以用 skeleton screens 代替空白區域。另外可以用工程技巧，提升用戶對產品的感知速度，比如點贊這個交互動作。
所以不僅要設計出理想的狀態，還要應對其它四種狀態，并相互間流暢地運做。
