Photoshop CC UI設計案例教程（AI助學）（全彩慕課版）（第3版）
王京晶
商品描述
本書全面、系統地介紹UI 設計的相關知識點和基本設計技巧，包括初識UI 設計、圖標設計、App界面設計、網頁界面設計、軟件界面設計和遊戲界面設計等內容。
本書除第1 章外，其他章的內容均以知識點講解和課堂案例為主線。知識點講解部分可以使讀者系統地了解UI 設計的各類知識，課堂案例部分可以使讀者快速掌握UI 設計流程並能完成案例制作。第2章至第6 章的最後還安排了課堂練習、課後習題和AI 擴展案例,課堂練習和課後習題能拓展讀者對UI設計的實際應用能力；AI 擴展案例可以在案例制作中巧妙融入AI 技術，輔助完成設計。
作者簡介
王京晶，北京印刷學院新媒體學院任教17年，主要教學課程視覺表現軟件基礎、數字媒體軟件基礎、視聽語言、影視廣告設計等；組織學生參加中國大學生廣告藝術學院獎、北京科普新媒體創新大賽等各種比賽，通過比賽提高學生的實踐經驗。
目錄大綱
第 1章 初識UI設計
1.1 UI設計基礎…………………………2
1.1.1 UI設計的概念… ………………2
1.1.2 WUI和GUI……………………2
1.1.3 UI設計常用術語中
英文對照… ……………………3
1.2 UI設計的常用軟件…………………3
1.3 UI設計的項目流程…………………4
1.3.1 項目設計流程… ………………4
1.3.2 UI設計流程… …………………4
1.4 UI設計的風格………………………5
1.4.1 擬物化風格… …………………6
1.4.2 扁平化風格… …………………6
1.5 UI設計的行業現狀及發展趨勢……6
1.5.1 UI設計行業現狀… ……………6
1.5.2 UI設計發展趨勢… ……………9
1.6 UI設計的學習方法…………………9
1.7 AI擴展閱讀 ………………………11
1.7.1 AI擴展知識1——AI輔助
UI設計的常用工具… …………11
1.7.2 AI擴展知識2——AI輔助
UI設計的流程… ………………11
第 2章 圖標設計
2.1 圖標的基礎知識……………………13
2.1.1 圖標的概念… …………………13
2.1.2 圖標設計的流程… ……………13
2.1.3 圖標設計的原則… ……………15
2.2 圖標的設計規範……………………18
2.2.1 圖標的尺寸及單位… …………18
2.2.2 圖標的視覺統一… ……………21
2.2.3 圖標的清晰度… ………………21
2.3 圖標的風格…………………………22
2.3.1 擬物化風格… …………………22
2.3.2 扁平化風格… …………………22
2.3.3 3D風格… ……………………23
2.3.4 2.5D風格………………………23
2.4 課堂案例——繪制扁平化風格的
面性圖標……………………………24
2.5 課堂練習……………………………29
2.5.1 課堂練習——繪制扁平化風格
的不透明色塊面性圖標………29
2.5.2 課堂練習——繪制扁平化風格
的微漸變面性圖標… …………30
2.6 課後習題……………………………30
2.6.1 課後習題——繪制扁平化風格
的光影效果圖標… ……………30
目 錄
2.6.2 課後習題——繪制扁平化風格
的折紙投影圖標… ……………31
2.7 AI助學圖標設計…………………31
2.7.1 AI助學——即夢AI生成
3D風格圖標… ………………31
2.7.2 AI助學——豆包生成
2.5D風格圖標… ……………32
第3章 App界面設計
3.1 App界面設計的基礎知識………34
3.1.1 App的概念… ………………34
3.1.2 App界面設計的流程… ……34
3.1.3 App界面設計的原則… ……36
3.2 App界面的設計規範……………38
3.2.1 iOS界面的設計規範…………38
3.2.2 Android界面的設計規範……43
3.3 App常用的界面類型……………47
3.3.1 引導頁…………………………47
3.3.2 閃屏頁…………………………48
3.3.3 首頁……………………………48
3.3.4 詳情頁…………………………50
3.3.5 個人中心頁……………………51
3.3.6 註冊登錄頁……………………51
3.4 課堂案例——制作暢遊旅遊
App界面…………………………52
3.4.1 課堂案例——制作暢遊旅遊
App引導頁… ………………52
3.4.2 課堂案例——制作暢遊旅遊
App閃屏頁… ………………56
3.4.3 課堂案例——制作暢遊旅遊
App首頁… …………………57
3.4.4 課堂案例——制作暢遊旅遊
App酒店詳情頁… …………68
3.4.5 課堂案例——制作暢遊旅遊
App個人中心頁… …………88
3.4.6 課堂案例——制作暢遊旅遊
App登錄頁… ………………98
3.5 課堂練習——制作潮貨電商
App界面………………………105
3.6 課後習題——制作三餐美食
App界面………………………106
3.7 AI助學——妙多AI制作悅途旅遊
App界面………………………107
第4章 網頁界面設計
4.1 網頁界面設計的基礎知識………110
4.1.1 網頁界面設計的概念… ……110
4.1.2 網頁界面設計的流程… ……110
4.1.3 網頁界面設計的原則… ……112
4.2 網頁界面的設計規範……………114
4.2.1 網頁界面設計的
單位及尺寸… ………………114
4.2.2 網頁界面設計的界面結構……117
4.2.3 網頁界面設計的布局… ……117
4.2.4 網頁界面設計的文字… ……120
4.2.5 網頁界面設計的圖標… ……123
4.3 網頁常用的界面類型……………126
4.4 課堂案例——制作東方木品家居
電商網站界面……………………129
4.4.1 課堂案例——制作東方木品
家居電商網站首頁… ………129
4.4.2 課堂案例——制作東方木品家
居電商網站產品列表頁………149
4.4.3 課堂案例——制作東方木品家
居電商網站產品詳情頁……158
4.5 課堂練習——制作一點生活家居
電商網站界面……………………166
4.6 課後習題——制作臻藝裝飾家居
電商網站界面……………………167
4.7 AI助學——MasterGO制作尚
家家居電商網站界面……………167
第5章 軟件界面設計
5.1 軟件界面設計的基礎知識………170
5.1.1 軟件界面設計的概念… ……170
5.1.2 軟件界面設計的流程… ……170
5.1.3 軟件界面設計的原則… ……173
5.2 軟件界面的設計規範……………174
5.2.1 軟件界面設計的單位及
尺寸… ………………………174
5.2.2 軟件界面設計的界面結構……175
5.2.3 軟件界面設計的布局… ……176
5.2.4 軟件界面設計的文字… ……179
5.2.5 軟件界面設計的圖標… ……181
5.3 軟件常用的界面類型……………185
5.4 課堂案例——制作天籟音樂
播放器軟件界面…………………188
5.4.1 課堂案例——制作天籟音樂
播放器軟件首頁… …………188
5.4.2 課堂案例——制作天籟音樂
播放器軟件歌單頁… ………203
5.4.3 課堂案例——制作天籟音樂
播放器軟件歌曲列表頁……208
5.5 課堂練習——制作不凡音樂
播放器軟件界面…………………216
5.6 課後習題——制作酷聽音樂
播放器軟件界面…………………217
5.7 AI助學——MasterGO制作律動
音樂播放器軟件界面……………217
第6章 遊戲界面設計
6.1 遊戲界面設計的基礎知識………220
6.1.1 遊戲界面設計的概念… ……220
6.1.2 遊戲界面設計的流程… ……220
6.1.3 遊戲界面設計的原則… ……222
6.2 遊戲界面的設計規範……………224
6.2.1 遊戲界面設計的單位及
尺寸… ……………………… 224
6.2.2 遊戲界面設計的界面結構… 225
6.2.3 遊戲界面設計的類型和
布局… ……………………… 225
6.2.4 遊戲界面設計的文字… …… 229
6.2.5 遊戲界面設計的圖標… …… 229
6.3 課堂案例——制作果蔬消消消
遊戲界面…………………………230
6.4 課堂練習——制作糖果消消樂
遊戲界面…………………………238
6.5 課後習題——制作開心連連看
遊戲界面…………………………239
6.6 AI 助學——妙多AI 制作美味
消消樂遊戲界面…………………239
