第1章初入U(xiǎn)I設(shè)計(jì)世界1
1.1什么是UI設(shè)計(jì)/1
1.1.1UI設(shè)計(jì)的概念/1
1.1.2UI設(shè)計(jì)的發(fā)展/1
1.1.3UI設(shè)計(jì)的分類/6
1.2UI設(shè)計(jì)的發(fā)展前景與就業(yè)空間/8
1.2.1UI設(shè)計(jì)的發(fā)展前景/8
1.2.2UI設(shè)計(jì)師的就業(yè)空間/8
1.3UI設(shè)計(jì)的流程/9
第2章零基礎(chǔ)的設(shè)計(jì)之路12
2.1軟件是實(shí)現(xiàn)創(chuàng)意的基石/12
2.1.1Photoshop的功能/12
2.1.2Illustrator的功能/12
2.2UI設(shè)計(jì)風(fēng)格的演變/13
2.2.1擬物化風(fēng)格/14
2.2.2扁平化風(fēng)格/14
2.3具有持續(xù)學(xué)習(xí)的能力/15
2.4從現(xiàn)實(shí)中汲取靈感/18
2.5以興趣愛(ài)好為內(nèi)驅(qū)動(dòng)力/19
第3章UI設(shè)計(jì)原則20
3.1簡(jiǎn)單清晰/20
3.2便捷高效/22
3.3安全可控/24
3.4無(wú)形的界面設(shè)計(jì)/26
第4章UI設(shè)計(jì)的視覺(jué)元素28
4.1字體設(shè)計(jì)/28
4.1.1字體風(fēng)格/28
4.1.2字體變形/31
4.1.3字體變形案例/33
4.1.4字體的設(shè)計(jì)原則/37
4.2圖形設(shè)計(jì)/40
4.2.1圖形樣式和使用場(chǎng)景/40
4.2.2圖形的設(shè)計(jì)原則/43
4.3圖標(biāo)設(shè)計(jì)/44
4.3.1圖標(biāo)的設(shè)計(jì)風(fēng)格/44
4.3.2圖標(biāo)制作方法/45
4.3.3圖標(biāo)的設(shè)計(jì)原則/48
4.4按鈕設(shè)計(jì)/50
4.4.1按鈕的分類/51
4.4.2網(wǎng)頁(yè)按鈕的功能/53
4.4.3按鈕的設(shè)計(jì)原則/54
第5章版式設(shè)計(jì)的方法論57
5.1版式設(shè)計(jì)的概念/57
5.2版式設(shè)計(jì)的構(gòu)成與方法/58
5.2.1構(gòu)成版面的基本圖形元素/58
5.2.2版式設(shè)計(jì)的基本方法/61
5.3版式設(shè)計(jì)的原則/69
5.3.1對(duì)稱與穩(wěn)定/69
5.3.2對(duì)比與和諧/69
5.3.3實(shí)與虛/71
5.3.4一致與變幻/71
第6章色彩搭配技巧73
6.1什么是色彩/73
6.1.1色彩兩大色系/73
6.1.2色彩三屬性/74
6.1.3色彩的設(shè)計(jì)原則/76
6.2網(wǎng)頁(yè)設(shè)計(jì)的配色技巧/79
6.2.1確定基本色調(diào)/79
6.2.2掌握基本的配色設(shè)計(jì)/80
6.2.3借助配色工具/84
6.3色彩情感的應(yīng)用/85
6.3.1色彩的心理暗示/85
6.3.2色彩的視覺(jué)空間感/88
第7章網(wǎng)站的分類90
7.1專題網(wǎng)站/90
7.1.1什么是專題/90
7.1.2常見(jiàn)的專題類型/90
7.1.3專題頁(yè)面的特點(diǎn)/96
7.1.4常見(jiàn)的版式布局/96
7.2企業(yè)網(wǎng)站/102
7.2.1什么是企業(yè)網(wǎng)站/102
7.2.2常見(jiàn)的企業(yè)網(wǎng)站類型/102
7.2.3常見(jiàn)的欄目架構(gòu)/102
7.2.4常見(jiàn)的版式布局/106
7.3門戶網(wǎng)站/107
7.3.1什么是門戶網(wǎng)站/107
7.3.2門戶網(wǎng)站的設(shè)計(jì)要點(diǎn)/107
7.4商城網(wǎng)站/108
7.4.1什么是商城網(wǎng)站/108
7.4.2商城網(wǎng)站的設(shè)計(jì)要點(diǎn)/109
7.5后臺(tái)管理系統(tǒng)/109
7.5.1什么是后臺(tái)管理系統(tǒng)/109
7.5.2后臺(tái)管理系統(tǒng)的設(shè)計(jì)要點(diǎn)/110
7.6網(wǎng)頁(yè)游戲/111
7.6.1什么是網(wǎng)頁(yè)游戲/111
7.6.2網(wǎng)頁(yè)游戲的UI設(shè)計(jì)風(fēng)格/111
7.6.3網(wǎng)頁(yè)游戲的設(shè)計(jì)要點(diǎn)/111
7.7應(yīng)用軟件/112
7.7.1什么是應(yīng)用軟件/112
7.7.2應(yīng)用軟件的設(shè)計(jì)要點(diǎn)/113
7.8WAP網(wǎng)站/113
7.8.1什么是WAP網(wǎng)站/113
7.8.2WAP網(wǎng)站與PC端網(wǎng)站的區(qū)別/113
7.8.3WAP網(wǎng)站的設(shè)計(jì)要點(diǎn)/115
7.9H5營(yíng)銷/115
7.9.1什么是H5/115
7.9.2H5頁(yè)面的版式設(shè)計(jì)/115
7.10Banner/117
第8章交互設(shè)計(jì)與用戶體驗(yàn)123
8.1關(guān)于交互設(shè)計(jì)/123
8.1.1什么是交互設(shè)計(jì)/123
8.1.2交互設(shè)計(jì)的流程/125
8.1.3交互設(shè)計(jì)的要點(diǎn)/131
8.2關(guān)于用戶體驗(yàn)/134
8.2.1什么是用戶體驗(yàn)/134
8.2.2用戶體驗(yàn)五要素/134
8.2.3用戶體驗(yàn)的分類/137
8.2.4用戶體驗(yàn)的設(shè)計(jì)原則/138
8.3情感化設(shè)計(jì)/142
8.3.1情感化設(shè)計(jì)的層次/143
8.3.2情感化設(shè)計(jì)的要點(diǎn)/144
8.4網(wǎng)站的用戶體驗(yàn)/145
8.4.1網(wǎng)站用戶體驗(yàn)的內(nèi)容/145
8.4.2網(wǎng)站用戶體驗(yàn)的優(yōu)化/148
第9章移動(dòng)平臺(tái)的UI設(shè)計(jì)152
9.1了解APP的UI設(shè)計(jì)/152
9.1.1APP的UI設(shè)計(jì)趨勢(shì)/152
9.1.2WebUI與APPUI的區(qū)別/154
9.2iOS系統(tǒng)的界面設(shè)計(jì)/156
9.2.1iOS系統(tǒng)的界面尺寸/156
9.2.2iOS系統(tǒng)的界面元素/157
9.2.3iOS系統(tǒng)的字體/159
9.3Android系統(tǒng)的界面設(shè)計(jì)/160
9.3.1Android系統(tǒng)的界面尺寸/160
9.3.2Android系統(tǒng)的字體/161
9.4WindowsPhone系統(tǒng)的界面設(shè)計(jì)/162
9.5APP的設(shè)計(jì)要點(diǎn)/163
9.5.1金融類APP/163
9.5.2購(gòu)物類APP/164
9.5.3社交類APP/166
9.5.4音樂(lè)類APP/167
第10章UI設(shè)計(jì)的升華之道168
10.1響應(yīng)式設(shè)計(jì)/168
10.1.1響應(yīng)式圖片/168
10.1.2響應(yīng)式導(dǎo)航/170
10.1.3響應(yīng)式選擇菜單/171
10.1.4響應(yīng)式登錄/171
10.1.5響應(yīng)式內(nèi)容欄目/172
10.1.6響應(yīng)式重新布局/173
10.2柵格系統(tǒng)/173
10.2.1什么是柵格系統(tǒng)/173
10.2.2柵格系統(tǒng)的應(yīng)用/176
10.3產(chǎn)品包裝展示/179
10.3.1產(chǎn)品包裝的表現(xiàn)形式/180
10.3.2產(chǎn)品包裝的設(shè)計(jì)要點(diǎn)/181