UI設計基礎
設計三點原則
- 遵從:UI幫助用戶更好地理解內容並與之交互,而不是喧賓奪主。
- 清晰:文字和圖標清晰且表意清楚;聚焦功能,減少裝飾。
- 層次(Depth):多層次的視覺和動畫效果賦予了UI活力,這有助於用戶的理解,並在使用時獲得愉悅感。
設計步驟
- 把應用核心功能和UI相關聯,確認相關性。
- 用iOS的設計三準則指導UI和用戶體驗設計。謹慎地添加必要的細節。
- UI設計儘可能多地適應不同設備和場景。
專注於內容和功能,對傳統、假想保持懷疑。
UI遵從內容
- 利用好全屏。
- 重新思考現實世界的視覺標誌:裝飾使得UI變得厚重,分散了用戶對內容的注意力。
- 使用半透明UI元素,告知用戶當前內容所處的上下文:在iOS中,半透明物體只會模糊它後面的區域,而不會模糊屏幕的其它區域。
清晰、清楚
- 重要內容和功能附近有大量留白。
- 用顏色簡化UI:可以用顏色體現重要內容和交互。同時也給App打造了一致的視覺系統。
- 使用系統內置字體:它會隨着設置的字體大小自動調整間距和行高等參數。不管使用哪種字體,一定要是Dynamic Type的。
- 擁抱無邊框按鈕:按鈕通過上下文、顏色、表示操作的名字等暗示其本身的交互性。某些情況下,也可以給按鈕加邊框或給背景着色。
通過層次交流
- 半透明物體引起的視覺上的層級關係。
- 過場動畫。