您位於此處:
使用視覺階層組織顯示面板頁面
安排每個顯示面板頁面,讓使用者從大圖到詳細資料都以自然順序閱讀頁面。
使用顯示面板頁面來在單一顯示面板中說明分層的情節,而不需要建立許多個別的顯示面板。頁面也會改善載入時間,因為只有在顯示面板開啟時,預設頁面上的查詢才會執行。
具有標題的商機,接著是內文,接著是詳細資料
- 標題.將關鍵度量與 takeaways 放置在頂端,讓使用者在其中尋找第一位。
- 身體.在標題下方,顯示解釋和細分這些度量的圖表。
- 詳細資料.為需要深入瞭解的使用者,將細微的表格與參考資訊放在最後。
選擇引導眼睛的版面配置模式
- F 模式。使用者會掃描頂端,然後掃描左側。用於具有許多小工具的內容密集顯示面板。
- Z 模式。眼睛會從左上移至右上,然後對角移至底部。將其用於更簡單的顯示面板,並具有明確的行動呼籲。
- 並排.將相關檢視放在彼此旁邊,以支援直接比較,例如本期與前期。
分組並對齊以取得清楚度
- 使用容器小工具來分組相關的小工具和分隔區段。
- 將小工具對齊至一致的網格,並保持平均的間距。
- 使用標籤和區段色彩來加強分組。
- 保留空格,讓每個區段容易區分。
檢視顯示面板位置的設計
- 在獨立應用程式中顯示完整詳細資料。
- 當您在記錄頁面或首頁中內嵌顯示面板時,顯示較少且更高的度量。
