圖標(biāo)設(shè)計(jì)與制作（全彩慕課版 第2版）

第 1章　初識(shí)圖標(biāo)設(shè)計(jì)
1.1　圖標(biāo)的基本概念　2
1.2　圖標(biāo)的類(lèi)型　3
1.2.1　產(chǎn)品圖標(biāo)　3
1.2.2　功能圖標(biāo)　3
1.2.3　裝飾圖標(biāo)　4
1.3　圖標(biāo)的風(fēng)格　5
1.3.1　擬物風(fēng)格　5
1.3.2　扁平風(fēng)格　5
1.3.3　3D風(fēng)格　6
1.3.4　2.5D風(fēng)格　6
1.4　圖標(biāo)的性格表現(xiàn)　7
1.4.1　圓角的有無(wú)及大小　7
1.4.2　描邊的粗細(xì)　7
1.4.3　顏色的搭配　8
1.5　圖標(biāo)的設(shè)計(jì)軟件　9
1.6　圖標(biāo)的設(shè)計(jì)原則　9
1.6.1　可識(shí)別性　9
1.6.2　視覺(jué)統(tǒng)一　10
1.6.3　簡(jiǎn)潔美觀　11
1.6.4　愉悅友好　12
1.7　圖標(biāo)的設(shè)計(jì)流程　13
第　2章 圖標(biāo)繪制方法
2.1　圖標(biāo)標(biāo)準(zhǔn)尺寸系統(tǒng)　16
2.1.1　尺寸系統(tǒng)　16
2.1.2　圖標(biāo)尺寸　16
2.1.3　圖標(biāo)放大　16
2.1.4　圖標(biāo)布局　16
2.2　圖標(biāo)像素 　17
2.2.1　圖標(biāo)像素 的概念　17
2.2.2　實(shí)現(xiàn)圖標(biāo)像素 　17
2.2.3　課堂案例—用軟件實(shí)現(xiàn)圖標(biāo)像素 　21
2.3　圖標(biāo)的繪制思路　23
2.3.1　圖標(biāo)結(jié)構(gòu)分解　23
2.3.2　圖標(biāo)繪制工具　24
2.3.3　課堂案例—用紙、筆進(jìn)行圖標(biāo)結(jié)構(gòu)的分解　25
2.4　布爾運(yùn)算　26
2.4.1　不同軟件的使用　26
2.4.2　不同顏色的使用　26
2.4.3　課堂案例—繪制基礎(chǔ)面性圖標(biāo)　27
2.4.4　課堂案例—繪制基礎(chǔ)線(xiàn)性圖標(biāo)　30
2.5　圖標(biāo)等比例縮放　34
2.5.1　圖標(biāo)等比例縮放問(wèn)題　34
2.5.2　圖標(biāo)等比例縮放方法　34
2.5.3　課堂案例—將圖標(biāo)縮放后置入界面　34
2.6　圖標(biāo)的網(wǎng)格系統(tǒng)　35
2.6.1　網(wǎng)格系統(tǒng)的 意義　35
2.6.2　網(wǎng)格系統(tǒng)的 規(guī)范　36
2.6.3　網(wǎng)格系統(tǒng)的使用方法　36
2.6.4　課堂案例—運(yùn)用網(wǎng)格系統(tǒng)調(diào)整圖標(biāo)　36
2.7　圖標(biāo)的視覺(jué)調(diào)整　40
2.7.1　重心調(diào)整　40
2.7.2　線(xiàn)條調(diào)整　40
2.7.3　顏色調(diào)整　41
2.7.4　課堂案例—進(jìn)行圖標(biāo)的重心調(diào)整　41
2.7.5　課堂案例—進(jìn)行圖標(biāo)的線(xiàn)條調(diào)整　43
2.7.6　課堂案例—進(jìn)行圖標(biāo)的顏色調(diào)整　44
2.8　課堂練習(xí)—制作家居類(lèi)面性圖標(biāo)　45
2.9　課后習(xí)題—制作服飾類(lèi)線(xiàn)性圖標(biāo)　45
第3章　線(xiàn)性圖標(biāo)設(shè)計(jì)
3.1　線(xiàn)性圖標(biāo)的基礎(chǔ)知識(shí)　48
3.2　線(xiàn)性圖標(biāo)的基礎(chǔ)設(shè)計(jì)　48
3.2.1　描邊設(shè)置　48
3.2.2　圓角設(shè)置　50
3.2.3　比例設(shè)置　51
3.3　線(xiàn)性圖標(biāo)的創(chuàng)意設(shè)計(jì)　51
3.3.1　基礎(chǔ)線(xiàn)性　51
3.3.2　課堂案例—制作線(xiàn)性圓角 圖標(biāo)　51
3.3.3　基礎(chǔ)線(xiàn)性延伸　56
3.3.4　線(xiàn)性斷點(diǎn)　57
3.3.5　課堂案例—制作線(xiàn)性斷點(diǎn) 圖標(biāo)　58
3.3.6　課堂案例—制作線(xiàn)性疊加 圖標(biāo)　63
3.4　課堂練習(xí)—制作線(xiàn)性雙色圖標(biāo)　67
3.5　課后習(xí)題—制作線(xiàn)性漸變圖標(biāo)　68
第4章　面性圖標(biāo)設(shè)計(jì)
4.1　面性圖標(biāo)的基礎(chǔ)知識(shí)　70
4.2　面性圖標(biāo)的基礎(chǔ)設(shè)計(jì)　70
4.2.1　輪廓外形　70
4.2.2　底板　71
4.3　面性圖標(biāo)的創(chuàng)意設(shè)計(jì)　72
4.3.1　單色面性圖標(biāo)　72
4.3.2　課堂案例—制作單色面性圖標(biāo)　72
4.3.3　基礎(chǔ)面性延伸　76
4.3.4　面性多色　77
4.3.5　面性漸變　78
4.3.6　面性疊加　79
4.3.7　課堂案例—制作面性疊加圖標(biāo)　80
4.3.8　面性微質(zhì)感　86
4.3.9　課堂案例—制作面性微質(zhì)感圖標(biāo)　86
4.4　課堂練習(xí)—制作面性透明度變化圖標(biāo)　105
4.5　課后習(xí)題—制作面性漸變圖標(biāo)　105
第5章　線(xiàn)面圖標(biāo)設(shè)計(jì)
5.1　線(xiàn)面圖標(biāo)的基礎(chǔ)知識(shí)　108
5.2　線(xiàn)面圖標(biāo)的基礎(chǔ)設(shè)計(jì)　108
5.2.1　填充位置　108
5.2.2　填充比例　109
5.2.3　填充形狀　109
5.3　線(xiàn)面圖標(biāo)的創(chuàng)意設(shè)計(jì)　109
5.3.1　內(nèi)部填充　109
5.3.2　課堂案例—制作扁平插畫(huà)圖標(biāo)　111
5.3.3　錯(cuò)位填充　117
5.3.4　課堂案例—制作線(xiàn)面錯(cuò)位填充圖標(biāo)　117
5.3.5　線(xiàn)面拼接　123
5.3.6　課堂案例—制作陰陽(yáng)填充圖標(biāo)　124
5.4　課堂練習(xí)—制作線(xiàn)面雙色圖標(biāo)　128
5.5　課后習(xí)題—制作MBE線(xiàn)面圖標(biāo)　129
第6章　2.5D圖標(biāo)設(shè)計(jì)
6.1　2.5D圖標(biāo)的基礎(chǔ)知識(shí)　131
6.2　2.5D圖標(biāo)的基礎(chǔ)設(shè)計(jì)　131
6.2.1　空間結(jié)構(gòu)　131
6.2.2　確定光源　131
6.2.3　零件搭建　131
6.3　2.5D圖標(biāo)的創(chuàng)意設(shè)計(jì)　132
6.3.1　2.5D描邊變化　132
6.3.2　2.5D色彩變化　133
6.3.3　2.5D不透明度　133
6.3.4　課堂案例—制作2.5D圖標(biāo)　133
6.4　課堂練習(xí)—制作2.5D雪糕圖標(biāo)　145
6.5　課后習(xí)題—制作2.5D收音機(jī)圖標(biāo)　145
第7章　圖標(biāo)項(xiàng)目設(shè)計(jì)
7.1　認(rèn)識(shí)導(dǎo)航欄及其圖標(biāo)　147
7.1.1　導(dǎo)航欄的概念　147
7.1.2　導(dǎo)航欄的類(lèi)型　147
7.1.3　導(dǎo)航欄的規(guī)范　149
7.1.4　課堂案例—制作電商類(lèi)導(dǎo)航欄圖標(biāo)　152
7.2　認(rèn)識(shí)標(biāo)簽欄及其圖標(biāo)　160
7.2.1　標(biāo)簽欄的概念　160
7.2.2　標(biāo)簽欄的類(lèi)型　160
7.2.3　標(biāo)簽欄的規(guī)范　162
7.2.4　課堂案例—制作旅游類(lèi)標(biāo)簽欄圖標(biāo)　167
7.3　認(rèn)識(shí)金剛區(qū)及其圖標(biāo)　176
7.3.1　金剛區(qū)的概念　176
7.3.2　金剛區(qū)的類(lèi)型　176
7.3.3　金剛區(qū)的規(guī)范　177
7.3.4　課堂案例—制作旅游類(lèi)金剛區(qū)圖標(biāo)　180
7.4　認(rèn)識(shí)應(yīng)用圖標(biāo)　190
7.4.1　應(yīng)用圖標(biāo)的概念　190
7.4.2　應(yīng)用圖標(biāo)的類(lèi)型　190
7.4.3　應(yīng)用圖標(biāo)的規(guī)范　191
7.4.4　課堂案例—制作娛樂(lè)類(lèi)應(yīng)用圖標(biāo)　191
7.5　課堂練習(xí)—制作美食類(lèi)導(dǎo)航欄圖標(biāo)　216
7.6　課后習(xí)題—制作美食類(lèi)標(biāo)簽欄圖標(biāo)　216
第8章　圖標(biāo)驗(yàn)證輸出
8.1　圖標(biāo)驗(yàn)證方法　218
8.1.1　含義識(shí)別　218
8.1.2　顏色識(shí)別　218
8.1.3　風(fēng)格識(shí)別　218
8.1.4　色彩驗(yàn)證　219
8.2　圖標(biāo)切圖格式　219
8.3　PNG圖標(biāo)切圖　219
8.3.1　切圖規(guī)范　219
8.3.2　切圖尺寸　220
8.3.3　輸出尺寸　220
8.3.4　切圖方法　221
8.3.5　大小優(yōu)化　224
8.4　SVG圖標(biāo)切圖　224
8.4.1　上傳規(guī)范　224
8.4.2　上傳流程　225
8.5　圖標(biāo)命名規(guī)范　225
8.5.1　制定規(guī)范的原因　225
8.5.2　命名規(guī)則　225
8.5.3　常用命名　226
8.5.4　課堂案例—為服飾類(lèi)App圖標(biāo)命名　226
8.6　課堂練習(xí)—為社交類(lèi)App圖標(biāo)命名　228
8.7　課后習(xí)題—為家居類(lèi)App圖標(biāo)命名　229