全鏈路UI設(shè)計 創(chuàng)意思維 項目實戰(zhàn) 就業(yè)指導

目錄

第1章　UI 行業(yè)認知
1.1　UI 入門必修課——UI 行業(yè)全面認知　13
1.1.1　UI 設(shè)計師的產(chǎn)出　14
1.1.2　設(shè)計軟件分類　20
1.1.3　什么是全鏈路設(shè)計師　26
1.2　設(shè)計素材庫　27
1.2.1　素材整理　28
1.2.2　建設(shè)素材庫　28

第2章　設(shè)計軟件
2.1　設(shè)計軟件分析　31
2.2　圖標起源認知　31
2.3　Photoshop 軟件基礎(chǔ)　32
2.3.1　擬物圖標制作　38
2.3.2　金屬質(zhì)感圖標　42
2.3.3　鋼筆工具　48
2.3.4　布爾運算—— Logo設(shè)計　50
2.4　Adobe Illustrator 設(shè)計基礎(chǔ)　51
2.4.1　AI 設(shè)計基礎(chǔ)　52
2.4.2　實戰(zhàn)：Wi-Fi 圖標繪制　55
2.4.3　實戰(zhàn)：漸變Logo 設(shè)計　56
2.4.4　實戰(zhàn)：2.5D等距圖網(wǎng)頁制作　58

第3章　交互軟件
3.1　主流交互軟件認知　63
3.2　Adobe XD　64
3.2.1　初識Adobe XD　64
3.2.2　側(cè)邊欄滑動　67
3.2.3　上下滑動　70
3.2.4　實戰(zhàn)：藍湖團隊協(xié)作　71
3.3　Axure　75
3.3.1　Axure 基礎(chǔ)　76
3.3.2　交互文檔制作　77
3.3.3　實戰(zhàn)：彈窗效果　82
3.3.4　二級導航疊加　85
3.3.5　動態(tài)面板應用　86

第4章　視覺設(shè)計基礎(chǔ)與規(guī)范
4.1　界面層次設(shè)計　90
4.1.1　文字層級　91
4.1.2　配色原理　92
4.1.3　Logo 常用設(shè)計法　95
4.1.4　海報常用版式　99
4.2　iOS 三大設(shè)計原則　104
4.2.1　清晰原則　105
4.2.2　遵從原則　106
4.2.3　深度原則　106
4.3　iOS 界面尺寸和控件規(guī)范　107
4.3.1　界面尺寸　107
4.3.2　控件規(guī)范　109
4.4　Android 設(shè)計原則和規(guī)范　113
4.4.1　設(shè)計原則　113
4.4.2　控件規(guī)范　120
4.4.3　尺寸和布局規(guī)范　127

第5章　界面設(shè)計進階
5.1　界面設(shè)計常犯錯誤　130
5.1.1　設(shè)計得“較差”的界面：播放界面詳解　136
5.1.2　柵格系統(tǒng)應用　138
5.1.3　設(shè)計改版分析：手指投　145
5.1.4　設(shè)計改版分析：M 閱讀　148
5.2　運營插畫技法解析　153
5.2.1　Banner 排版布局　153
5.2.2　實戰(zhàn)：“追波風”海報設(shè)計　157
5.3　標準界面輸出：適配　160
5.3.1　界面切圖和標注　162
5.3.2　切圖命名規(guī)范　166
5.3.3　Android“點九”切圖法　168

第6章　After Effects 動效專攻
6.1　After Effects 基礎(chǔ)　171
6.1.1　圖層和基礎(chǔ)工具　172
6.1.2　基礎(chǔ)屬性　173
6.1.3　素材導入和保存輸出　177
6.2　After Effects 技法進階　179
6.2.1　點擊水波反饋　179
6.2.2　實戰(zhàn)：中繼器點贊效果　181
6.2.3　實戰(zhàn)：登錄動效　183
6.2.4　旅行App 翻書動效　186
6.3　After Effects 高級動效　189
6.3.1　懸浮果凍效果　189
6.3.2　3D 卡片和表達式　191
6.3.3　實戰(zhàn)：Loading 秒表動效　193
6.3.4　實戰(zhàn)：圖標動效　195

第7章　前端開發(fā)
7.1　網(wǎng)絡運行原理　199
7.1.1　前端基礎(chǔ)　200
7.1.2　HTML 常用標簽　205
7.2　標簽進階　206
7.2.1　列表標簽　207
7.2.2　表格標簽　209
7.2.3　div 與span 標簽　210
7.3　什么是CSS　211
7.3.1　CSS 基礎(chǔ)語法　211
7.3.2　CSS 背景　213
7.3.3　CSS 字體　217
7.3.4　CSS 邊框與盒子模型　220
7.3.5　id 和class 選擇器　223
7.4　實戰(zhàn)：登錄頁面　224

第8章　項目設(shè)計
8.1　圖標設(shè)計提升　229
8.1.1　圖標精度提升：MBE 線型圖標　229
8.1.2　金剛區(qū)主題圖標　234
8.2　設(shè)計布局　237
8.2.1　Web 布局技巧　238
8.2.2　列表區(qū)布局思路　241
8.3　設(shè)計方法論　243
8.3.1　Kano 模型　243
8.3.2　雙鉆模型　249
8.4　B 端產(chǎn)品　251
8.4.1　B 端產(chǎn)品設(shè)計原則　253
8.4.2　實戰(zhàn)：B 端《納米系統(tǒng)》案例解析　255
8.4.3　實戰(zhàn)：B 端《數(shù)據(jù)挖掘》案例解析　257

第9章　知識拓展
9.1　需求梳理　262
9.1.1　產(chǎn)品需求文檔PRD　262
9.1.2　5W 需求分析法　264
9.2　競品分析　269
9.3　作品集視頻制作　278
9.3.1　After Effects 視頻開場　278
9.3.2　Premiere 剪輯輸出　281
9.4　建立作品集　283
9.4.1　面試技巧　284
9.4.2　個人作品集　286
9.4.3　個人設(shè)計師接單如何報價　292