UI界面設計與制作（AI助學）（全彩慕課版）（第2版）
徐翠娟 宋磊
商品描述
本書以理論與項目實戰相結合的方式，詳細講解UI界面設計與制作的方法。第1章為初識UI設計，介紹UI設計的基本概念、常用軟件、發展趨勢、學習方法、項目流程，以及規範與規則。第2章到第6章分別介紹UI設計中的圖標設計、控件設計、組件設計、頁面設計和UI設計輸出。
本書除第1章外，其他章的內容均以知識點講解加課堂案例為主線。知識點講解部分可以幫助讀者系統了解UI設計的各類規範，課堂案例部分可以幫助讀者快速掌握UI設計流程並能完成案例實戰操作。第2章至第6章還安排了課堂練習、課後習題和AI擴展案例，課堂練習與課後習題可以有效拓展讀者的實際應用能力，AI擴展案例設計巧妙結合UI相關的AI軟件和工具進行輔助設計，全方位助力讀者系統掌握AI在UI設計中的核心應用技能，使讀者順利達到實戰水平。
本書可作為高職高專院校數字媒體藝術類專業課程的教材，也可供初學者自學參考。
作者簡介
徐翠娟 哈爾濱職業技術學院電子與信息工程學院院長、教授，黑龍江省高職高專計算機類專業教學指導委員會副主任委員，黑龍江省教學名師，獲得黑龍江省師德先進個人、黃炎培職業教育優秀教師獎等榮譽稱號，主講《圖形圖像處理技術》《網頁設計基礎》《Java程序設計》等多門課程。2010年主持的《Java項目實戰》課程評為省級精品課程，2018年評為省級精品在線開放課程，2010年評為黑龍江省課程思政示範課。主編《數字影音編輯與合成案例教程》《Java程序設計》《計算機應用基礎》等多部教材。主持項目獲黑龍江省高等職業教育教學成果一等獎1項、二等獎1項，參與項目獲全國職業教育教學成果二等獎1項。
目錄大綱
第 1章 初識UI設計 001
1.1 UI設計的基本概念 001
1.2 UI設計的常用軟件 002
1.3 UI設計的發展趨勢 003
1.4 UI設計的學習方法 003
1.5 UI設計的項目流程 005
1.6 UI設計規範與規則 005
AI擴展知識1：AI輔助UI設計的常用工具 014
AI擴展知識2：AI輔助UI設計的流程 014
第 2章 圖標設計 015
2.1 線性圖標 015
2.1.1 基本概念 015
2.1.2 使用場景 016
2.1.3 設計要點 016
2.1.4 課堂案例——制作探途旅遊App線性圖標 018
2.2 面性圖標 022
2.2.1 基本概念 022
2.2.2 使用場景 022
2.2.3 設計要點 023
2.2.4 課堂案例——制作探途旅遊App面性圖標 024
2.3 線面圖標 029
2.3.1 基本概念 029
2.3.2 使用場景 029
2.3.3 設計要點 030
2.3.4 課堂案例——制作探途旅遊App線面圖標 030
2.4 課堂練習——制作臻選電商App線性圖標 035
2.5 課後習題——制作食匯餐飲App面性圖標 035
2.6 AI輔助圖標設計 036
2.6.1 AI擴展案例——使用豆包生成趣遊旅遊App果凍面性圖標 036
2.6.2 AI擴展案例——使用即夢AI生成享食餐飲App微質感面性圖標 037
第3章 控件設計 038
3.1 控件 039
3.1.1 控件的概念 039
3.1.2 控件的獲取 039
3.2 按鈕控件 040
3.2.1 按鈕控件的概念 040
3.2.2 按鈕控件的類型 040
3.2.3 按鈕控件的設計規範 042
3.2.4 課堂案例——制作探途旅遊App按鈕控件 044
3.3 選擇控件 046
3.3.1 選擇控件的概念 046
3.3.2 選擇控件的類型 046
3.3.3 選擇控件的設計規範 047
3.3.4 課堂案例——制作探途旅遊App選擇控件 048
3.4 加減控件 051
3.4.1 加減控件的概念 051
3.4.2 加減控件的類型 051
3.4.3 加減控件的設計規範 051
3.4.4 課堂案例——制作食匯餐飲App加減控件 052
3.5 分段控件 054
3.5.1 分段控件的概念 054
3.5.2 分段控件的類型 054
3.5.3 分段控件的設計規範 055
3.5.4 課堂案例——制作探途旅遊App分段控件 056
3.6 頁面控件 060
3.6.1 頁面控件的概念 060
3.6.2 頁面控件的類型 060
3.6.3 頁面控件的設計規範 061
3.6.4 課堂案例——制作探途旅遊App頁面控件 061
3.7 反饋控件 063
3.7.1 反饋控件的概念 063
3.7.2 反饋控件的類型 064
3.7.3 反饋控件的設計規範 065
3.7.4 課堂案例——制作臻選電商App反饋控件 068
3.8 文本框控件 069
3.8.1 文本框控件的概念 069
3.8.2 文本框控件的類型 070
3.8.3 文本框控件的設計規範 070
3.8.4 課堂案例——制作探途旅遊App文本框控件 071
3.9 課堂練習——制作臻選電商App文本框控件 073
3.10 課後習題——制作食匯餐飲App頁面控件 074
3.11 AI輔助控件設計 074
3.11.1 AI擴展案例1——使用妙多AI制作趣遊旅遊App分段控件 074
3.11.2 AI擴展案例2——使用MasterGO AI制作享食餐飲App按鈕控件 075
第4章 組件設計 076
4.1 組件 076
4.1.1 組件的概念 076
4.1.2 組件的獲取 077
4.2 導航欄 077
4.2.1 導航欄的概念 078
4.2.2 導航欄的類型 078
4.2.3 導航欄的設計規範 080
4.2.4 課堂案例——制作探途旅遊App導航欄 082
4.3 標簽欄 087
4.3.1 標簽欄的概念 087
4.3.2 標簽欄的樣式 087
4.3.3 標簽欄的設計規範 088
4.3.4 課堂案例——制作探途旅遊App標簽欄 091
4.4 金剛區 098
4.4.1 金剛區的概念 099
4.4.2 金剛區的類型 099
4.4.3 金剛區的設計規範 100
4.4.4 課堂案例——制作探途旅遊App金剛區 103
4.5 瓷片區 107
4.5.1 瓷片區的概念 108
4.5.2 瓷片區的類型 108
4.5.3 瓷片區的設計規範 109
4.5.4 課堂案例——制作探途旅遊App瓷片區 112
4.6 課堂練習——制作臻選電商App導航欄 117
4.7 課後習題——制作食匯餐飲App標簽欄 117
4.8 AI輔助組件設計 117
4.8.1 AI擴展案例1——使用DeepSeek和妙多AI制作趣遊旅遊App金剛區 117
4.8.2 AI擴展案例2——使用即夢AI和MasterGo AI制作享食餐飲App瓷片區 118
第5章 頁面設計 119
5.1 閃屏頁 119
5.1.1 閃屏頁的概念 120
5.1.2 閃屏頁的類型 120
5.1.3 課堂案例——制作探途旅遊App閃屏頁 121
5.2 引導頁 123
5.2.1 引導頁的概念 124
5.2.2 引導頁的類型 124
5.2.3 課堂案例——制作探途旅遊App引導頁 125
5.3 首頁 130
5.3.1 首頁的概念 130
5.3.2 首頁的類型 130
5.3.3 課堂案例——制作探途旅遊App首頁 132
5.4 詳情頁 146
5.4.1 詳情頁的概念 147
5.4.2 課堂案例——制作探途旅遊App酒店詳情頁 147
5.5 個人中心頁 173
5.5.1 個人中心頁的概念 173
5.5.2 課堂案例——制作探途旅遊App個人中心頁 174
5.6 註冊登錄頁 187
5.6.1 註冊登錄頁的概念 187
5.6.2 課堂案例——制作探途旅遊App登錄頁 188
5.7 課堂練習——制作臻選電商App頁面 197
5.8 課後習題——制作食匯餐飲App頁面 199
5.9 AI輔助頁面設計 201
5.9.1 AI擴展案例1——使用DeepSeek和妙多AI制作趣遊旅遊App頁面 201
5.9.2 AI擴展案例2——使用MasterGO AI制作享食餐飲App頁面 203
第6章 UI設計輸出 206
6.1 UI頁面標註 206
6.1.1 標註原因 206
6.1.2 標註內容 207
6.1.3 標註規則 209
6.1.4 標註工具 210
6.1.5 課堂案例——標註探途旅遊App首頁 211
6.2 UI頁面切圖 214
6.2.1 切圖目的 214
6.2.2 切圖類型 215
6.2.3 切圖規則 217
6.2.4 切圖方法 218
6.2.5 大小優化 218
6.2.6 課堂案例——制作探途旅遊App首頁切圖 219
6.3 UI頁面命名 223
6.3.1 命名原因 224
6.3.2 命名規則 224
6.3.3 常用名稱 224
6.3.4 課堂案例——命名探途旅遊App首頁切圖 225
6.4 課堂練習——輸出臻選電商App首頁 226
6.5 課後習題——輸出食匯餐飲App首頁 227
6.6 AI輔助UI輸出 228
6.6.1 AI擴展案例1——使用妙多AI輸出趣遊旅遊App首頁 228
6.6.2 AI擴展案例2——使用MasterGO AI輸出享食餐飲App首頁 229
