工具提示只說一句短提示。浮動框可以放更多文字、選項或按鈕。
幾個字就能說清楚時，用工具提示。需要閱讀更多或直接操作時，用浮動框。 開啟指南比較容易搞混的 UI 模式
兩種介面可能長得很像，工作卻不同。用短規則選出適合的一種。
對話框會先停住頁面，等你完成任務。浮動框留在按鈕旁，不會停住整頁。
一定要先完成一件事時，用對話框。只要補充資料或做小操作時，用浮動框。 開啟指南下拉選單用來執行動作。選擇欄從固定清單挑一個值。組合方塊還能輸入或搜尋。
要執行動作時，用下拉選單。固定短清單用選擇欄。清單很長或要搜尋時，用組合方塊。 開啟指南分頁標籤用來切換不同內容。分段控制只改變同一畫面裡的模式、篩選或值。
每個選項都有一大段不同內容時，用分頁標籤。少量短選項只改變同一內容時，用分段控制。 開啟指南折疊區塊會在頁面中展開，也能同時開啟多段。分頁標籤一次只顯示一段內容。
問答或需要一起閱讀的段落，用折疊區塊。少量分開的內容一次只看一個時，用分頁標籤。 開啟指南短暫通知不會打斷工作，而且很快消失。重要警告會留下或暫停工作，避免你漏看。
要確認動作已完成時，用短暫通知。發生失敗、危險或必須立刻選擇時，用警告。 開啟指南工具提示只放短標籤或提醒。預覽卡會顯示人物、物件或連結的更多資料。
幾個字就夠時，用工具提示。預覽能省下一次跳頁時，用預覽卡；鍵盤和觸控也要能打開。 開啟指南快顯選單會顯示目前物件的操作。下拉選單則從看得見、用途清楚的按鈕打開。
快顯選單只能當額外捷徑，不能是唯一入口。需要讓人清楚看到入口時，用下拉選單。 開啟指南輪播一次顯示一張內容，並提供切換按鈕。跑馬燈會讓一串內容持續移動。
每個項目都需要慢慢看時，用輪播。跑馬燈只適合不重要的裝飾內容，而且要能暫停或關閉動態。 開啟指南圖片燈箱是專門看圖片或影片的對話框。一般對話框用來做選擇、填表單或完成短任務。
要放大圖片或影片時，用圖片燈箱。主要工作是操作或做決定時，用一般對話框。 開啟指南瀑布流會把不同高度的卡片排進直欄。便當網格會安排不同大小的卡片，顯示內容的重要順序。
大量獨立項目高度不同時，用瀑布流。少量精選內容需要用大小分出重點時，用便當網格。 開啟指南側邊欄會一直留在版面中。側滑面板只會暫時滑入，可能蓋住或推開內容。
空間足夠，而且導覽或工具常用時，用側邊欄。偶爾才用或螢幕很小時，用側滑面板，並提供清楚的關閉按鈕。 開啟指南三條線按鈕會打開網站導覽。三個點按鈕會顯示旁邊項目的更多操作。
小螢幕需要收起導覽時，用三條線。項目旁放不下其他操作時，用三個點，並把按鈕命名為「更多操作」。 開啟指南速度曲線會照設定好的節奏移動。彈簧動畫像真的彈簧，會自己慢慢停下來。
淡入淡出、顏色改變和固定步驟，用速度曲線。物件移動或跟著拖曳時，用彈簧動畫。 開啟指南數值步進器會用固定幅度增加或減少數字。滑桿會在一段範圍中選擇位置。
少量又精確的調整，用數值步進器。大概位置比精確輸入重要時，用滑桿；仍要顯示數字並支援鍵盤。 開啟指南工作表會連在一個視窗上，用來完成短任務。警告會顯示需要立刻注意的訊息或選擇。
文件專用設定、儲存或短表單，用工作表。警告、失敗或一步確認，用警告框。 開啟指南空白狀態表示真的沒有內容。內容骨架表示資料還在載入，但版面形狀已經知道。
沒有內容，而且要告訴使用者下一步時，用空白狀態。短暫載入且知道版面形狀時，用內容骨架。 開啟指南工具列把常用操作放在視窗裡。選單列把應用程式的完整指令放在螢幕頂端。
常用的文件或選取操作放在工具列。完整指令、鍵盤快速鍵和較少使用的操作留在選單列。 開啟指南