UI用戶界面設計
吳翊楠、趙袁冰、張璇、張雲輝
相關主題
商品描述
本書以時代背景為依托,從設計的理論和實踐的雙重角度入手進行分析解讀,全面介紹了UI設計相關知識及實戰操作技巧。全書共6章,分別為UI設計概述、UI設計流程、UI構成元素管理、主流移動端UI交互系統、Material Design和設計思維、移動端App界面設計。本書對主流UI設計流程、UI 設計軟件的操作步驟和設計技巧以圖文並茂的方式進行了全面且細致的分析解讀,書中內容清晰簡潔、案例分析典型有效,可以幫助讀者增強理解和掌握UI 設計的相關概念知識,有效提高讀者在UI 設計領域的認知與思辨能力,同時提高讀者對實際操作與項目的解讀能力。 本書可作為高等院校、職業院校藝術設計類UI課程的專業教材,也可作為UI設計愛好者、相關設計行業從業者的參考用書。
作者簡介
趙袁冰,男,魯迅美術學院設計藝術學碩士,現任魯迅美術學院視覺傳達設計學院講師。從事空間設計方向教學和實踐研究近十年,主要講授商業空間設計、會展場館空間設計等核心課程。教學同時任職業設計師十餘年,設計領域涉及室內設計、建築空間設計、軟裝設計、傢具設計等。2015年被中國文化部文化產業司授予“中國百強設計師”稱號,並列為全國青年優秀人才培養計劃入庫人員;2016年入選遼寧省沈陽市青聯教育委員會委員。完成了30餘個空間設計項目,積累了豐富的設計實踐經驗。
目錄大綱
︱目 錄︱
第1章 UI設計概述
/
1
1.1 概念與定義
/
1
1.2 UI
設計的構成要素
/
2
1.2.1
視覺傳達作為基礎:圖形、圖像與文字 /
2
1.2.2
交互作為實現:流程、手勢、動畫與聲音 /
4
1.2.3
用戶體驗作為目標:UCD 的設計準則 /
6
1.3 UI
的設計類型
/
7
1.3.1
軟件UI /
7
1.3.2
網頁UI /
9
1.3.3
移動端產品UI / 10
1.3.4
游戲產品UI / 11
第2章 UI設計流程
/
13
2.1 定位產品屬性和用戶人群
/
13
2.1.1
用戶分析 / 13
2.1.2
客戶分析 / 13
2.1.3
競品分析 / 14
2.2 低保真原型
/
14
2.2.1
界面線路圖 / 15
2.2.2
線框圖 / 16
2.2.3
紙質原型 / 17
2.3 高保真原型
/
19
2.3.1
界面視覺 / 19
2.3.2
交互流程 / 20
2.3.3
動態效果 / 20
2.4 產品可用性測試
/
21
2.5 常用軟件分類
/
21
Uyjzw.indd 7
2024/5/21 16:55:44
VIII
2.5.1
圖像設計軟件 / 21
2.5.2
標註和切圖軟件 / 25
2.5.3
交互原型設計軟件 / 25
2.5.4
視頻動效設計軟件 / 28
第3章 UI構成元素管理
/
29
3.1 色彩基礎
/
29
3.1.1
色彩的概念 / 30
3.1.2
色彩與視知覺 / 31
3.1.3
色彩的冷暖感 / 32
3.1.4
色彩的空間感 / 34
3.1.5
色彩的情感 / 34
3.1.6
屏幕上的顏色 / 36
3.2 圖形與文字
/
37
3.2.1
圖形的功能 / 37
3.2.2
文字的功能 / 42
3.2.3
圖文配合 / 43
3.3 交互實用原則
/
45
3.3.1
交互流程的合理性 / 45
3.3.2
交互流程的體驗性 / 45
3.3.3
案例分析 / 46
第
4
章 主流移動端UI
交互系統
/
50
4.1 移動端屏幕尺寸和相關概念
/
50
4.2 移動端UI
設計中用到的單位
/
50
4.3 iOS系統
/
51
4.3.1 iOS 系統概述 / 51
4.3.2 iOS 系統設計主旨和設計原則 / 52
4.3.3 iOS 系統設計規範 / 53
4.4 Android
系統
/
58
4.4.1 Android 系統概述 / 58
4.4.2 Android 系統設計主旨 / 59
4.4.3 Android 系統設計規範 / 60
4.5 Windows
Phone
系統
/
60
4.5.1
Windows Phone 系統概述 / 60
Uyjzw.indd 8
2024/5/21 16:55:44
IX
4.5.2
Windows Phone 系統設計主旨 / 61
4.5.3
Windows Phone 系統設計規範 / 61
第
5
章 Material
Design
和設計思維
/
67
5.1 Material
Design
的設計理念
/
67
5.2 Material
Design
中可用到的設計資源和工具
/
70
5.3 Material
Design
設計說明
/
70
5.3.1
頁面環境 / 70
5.3.2
頁面佈局 / 72
5.3.3
導航 / 72
5.3.4
顏色 / 73
5.3.5
文字 / 74
5.3.6
聲音 / 76
5.3.7
圖標 / 77
5.3.8
圖形 / 79
5.3.9
動效 / 79
5.3.10
交互 / 80
5.4 Material
Design
案例分析
/
81
第6章 移動端App界面設計
/
84
6.1 圖標設計
/
85
6.1.1
扁平化圖標設計 / 90
6.1.2
擬物化圖標設計 / 92
6.2 頁面設計
/
99
6.2.1
引導頁設計 / 99
6.2.2
啟動頁設計 / 101
6.2.3
登錄頁設計 / 103
6.2.4
首頁設計 / 106
6.3 使用Adobe
XD
設計App
案例實踐
/
108
參考文獻
/
124
Uyjzw.indd 9
2024/5/21 16:55:44
Uyjzw.indd 10