內容簡介

詳細分析各類風格的UI設計及實現過程

從清新的扁平化風格到重金屬風格一應俱全

全方位了解圖標、按鈕、界面、字效、UI整體設計的制作方法

作者介紹

曾軍梅,西安工程大學副教授，陝西省動漫遊戲行業協會動漫教育專業委員會委員，陝西當代水彩粉畫研究院研究員、理事。

發表論文及作品30餘篇（其中EI、ISTP檢索5篇），獲外觀專利1項。參加了一項國家、五項省級、三項院級科研專案，十二項橫向課題。其中14項為項目負責人，十八項已結題。獲教學成果一等獎（主持人）一次，傳統工藝美術作品獲首屆全國高校美術.設計作品大獎賽入圍獎，中國西部風情全國水彩作品媒體展入選，獲畢業設計（論文）工作優秀指導教師獎3次，指導學生多次在國內專業比賽獲獎，並獲大賽優秀指導教師9次。

研究方向：數位媒體藝術、動畫設計理論及實踐、動漫遊戲美術理論與實踐。現作為主導師指導學生11名，副導師指導學生2名。

Chapter 01 智慧手機App UI設計
1.1 App UI設計概述 / 2
1.1.1 UI設計的概念 / 2
1.1.2 App用戶端 / 2
1.1.3 主要工具軟體 / 3
1.2 智慧手機平面設計師要掌握的技術 / 3
1.3 優秀App介面 / 4
1.3.1 優秀App介面的特點 / 5
1.3.2 產品團隊與設計師 / 6
1.3.3 專案中的App設計流程 / 6
1.3.4 設計靈感 / 7
1.4 設計構圖與介面佈局 / 8
1.4.1 App介面設計構圖 / 8
1.4.2 智慧手機介面的佈局構成 / 9
1.5 優秀App介面的要求 / 12

Chapter 02 App介面設計的配色意向
2.1 App UI的色彩設計意象 / 18
2.2 色彩的表現力和感染力 / 20
2.2.1 色彩的效應 / 20
2.2.2 色彩的反應 / 22
2.3 色彩研究 / 22
2.4 配色 / 24
2.4.1 色相配色 / 25
2.4.2 色調配色 / 25
2.4.3 明度配色 / 27
2.5 使用Photoshop進行配色 / 28
2.6 配色案例 / 31
2.7 色彩的對比組合 / 38

Chapter 03 Photoshop製作App UI常用的操作
3.1 Photoshop CC的工作介面 / 40
3.1.1 瞭解Photoshop CC的工作介面 / 40
3.1.2 工具箱 / 41
3.1.3 選項欄 / 42
3.1.4 狀態列 / 44
3.1.5 面板 / 44
3.1.6 調整面板 / 46
3.2 選擇工具 / 47
3.2.1 設定選區的工具組 / 48
3.2.2 矩形選框工具的選項欄 / 48
3.2.3 選區的基本運算 / 49
3.3 填充工具 / 51
3.3.1 漸變工具的選項欄 / 52
3.3.2 油漆桶工具的選項欄 / 56
3.4 理解圖層的概念 / 57
3.4.1 “圖層編組”命令 / 59
3.4.2 “排列”命令 / 60

Chapter 04 手機UI設計平面圖標製作
4.1 設計吸引眼球的圖示 / 62
4.2 圖示的設計方案 / 63
4.3 正確的圖示設計流程 / 64
4.4 啟動鍵製作 / 70
4.5 人像圖示製作 / 72
4.6 記事本圖示製作 / 74
4.7 放大鏡搜索圖示製作 / 76
4.8 麥克風圖示製作 / 78

Chapter 05 UI的質感表現
5.1 質感圖示設計的三個階段 / 82
5.1.1 確定題材 / 82
5.1.2 確定表現風格 / 82
5.1.3 具體實現 / 83
5.2 金屬質感 / 84
5.3 磨砂玻璃質感 / 90
5.4 光滑表面質感 / 99
5.5 皮革質感 / 107

Chapter 06 手機UI設計的字效表現
6.1 App UI的字型大小控制 / 114
6.1.1 字體尺寸的規則 / 114
6.1.2 字體規範 / 115
6.2 字體配色 / 116
6.2.1 配色規則 / 116
6.2.2 疊加、柔光和透明度 / 117
6.3 玻璃字體 / 118
6.4 鑲鑽字效 / 123
6.5 布料字體 / 133

Chapter 07 手機UI設計立體圖標製作
7.1 圖示的存儲格式 / 140
7.1.1 向量格式與點陣圖格式 / 140
7.1.2 JPG壓縮格式 / 141
7.1.3 PNG非壓縮格式 / 142
7.1.4 圖像的有損和無失真壓縮 / 143
7.2 照相機圖示製作 / 144
7.3 循環圖表標製作 / 158
7.4 多雲圖示製作 / 164

Chapter 08 手機UI介面元素設計
8.1 App UI設計思路 / 172
8.2 圖形設計尺寸 / 173
8.3 登錄介面 / 175
8.4 設置介面開關 / 181
8.5 通知列表 / 192

Chapter 09 手機UI按鈕設計
9.1 App IU中按鈕的設計思路 / 202
9.2 啟動按鈕 / 204
9.3 音樂播放按鈕 / 215
9.4 清新彩色按鈕 / 221
9.5 選項按鈕 / 230

Chapter 10 智慧手機UI整體介面製作
10.1 完整App UI介面的設計流程 / 238
10.1.1 需求階段 / 238
10.1.2 分析設計階段 / 238
10.1.3 調研驗證階段 / 239
10.1.4 方案改進階段 / 239
10.1.5 用戶驗證回饋階段 / 240
10.2 Android介面時尚風格設計 / 241
10.2.1 製作鎖屏介面 / 241
10.2.2 製作排程介面 / 246
10.2.3 製作相冊介面 / 249
10.2.4 製作清單介面 / 253
10.3 iOS介面扁平化風格設計 / 256
10.3.1 製作登錄介面 / 256
10.3.2 制作主介面 / 258
10.3.3 製作排程介面 / 262
10.3.4 製作提示欄介面 / 265

看更多