網(wǎng)頁(yè)圖片與移動(dòng)界面(Web/App)的UI設(shè)計(jì)(高等職業(yè)教育藝術(shù)設(shè)計(jì)專業(yè)精品系列教材、“互聯(lián)網(wǎng)+”新形態(tài)立體化
定 價(jià):49.8 元
- 作者:張婭,黃欣彬
- 出版時(shí)間:2020/10/1
- ISBN:9787518430680
- 出 版 社:中國(guó)輕工業(yè)出版社
- 中圖法分類:TP311.1
- 頁(yè)碼:208
- 紙張:
- 版次:1
- 開(kāi)本:
本書(shū)從基礎(chǔ)的 Photoshop CC界面布局開(kāi)始講起,以循序漸進(jìn)的方式詳細(xì)講解了圖像基本操作、選區(qū)、圖層、繪畫(huà)、顏色調(diào)整、照片修飾、路徑、文字、濾鏡等功能,內(nèi)容基本涵蓋了 Photoshop CC相關(guān)工具和命令,同時(shí)在進(jìn)一步學(xué)習(xí)網(wǎng)頁(yè)UI以、手機(jī)UI設(shè)計(jì)以及手機(jī)系統(tǒng)功能界面。本書(shū)既有基本理論,又有實(shí)踐操作的指導(dǎo)書(shū)。書(shū)中精心安排了具有針對(duì)性的實(shí)例,不僅可以幫動(dòng)讀者輕松掌握軟件使用方法,更能應(yīng)對(duì)數(shù)碼照片處理、平面設(shè)計(jì)、UI等實(shí)際工作。還能幫助讀者掌握從產(chǎn)生設(shè)計(jì)理念到實(shí)現(xiàn)制作設(shè)計(jì)的全過(guò)程。
全書(shū)按照 Photos hop CC的不同應(yīng)用領(lǐng)域劃分知識(shí)點(diǎn),每個(gè)項(xiàng)目先進(jìn)行知識(shí)引入闡述,再引入多個(gè)任行,以及進(jìn)行任務(wù)分析,最后完成任務(wù)的實(shí)現(xiàn)。讀者需要多上機(jī)實(shí)踐,掌握多種設(shè)計(jì)技巧。教師在使用本書(shū)時(shí),可以結(jié)合數(shù)學(xué)設(shè)計(jì),采用任務(wù)式的教學(xué)模式,通過(guò)不同類型的任務(wù)案例,提升讀者軟件操作的熟練程度和對(duì)知識(shí)點(diǎn)的掌握與理解。
張婭,宜賓職業(yè)技術(shù)學(xué)院,宜賓技術(shù)技能培訓(xùn)中心主任。黃欣彬,宜賓職業(yè)技術(shù)學(xué)院,教師,任教于藝術(shù)設(shè)計(jì)專業(yè)。
目 錄
項(xiàng)目一 PhototShop CC的基礎(chǔ)知識(shí) 1
1.1 Photoshop CC的基本知識(shí) 1
1.1.1 Photoshop的發(fā)展 1
1.1.2平面設(shè)計(jì) 1
1.2 圖像處理基礎(chǔ)知識(shí) 2
1.2.1 位圖與矢量圖 2
1.2.2 像素與分辨率 4
1.2.3 圖像的色彩模式 4
1.2.4 常用的圖像格式 5
1.3 Photoshop界面及基本操作 6
1.3.1 任務(wù)引入 6
1.3.2 知識(shí)引入 6
1.Photoshop菜單欄與工具箱 6
2.控制面板 7
3.圖像畫(huà)板編輯區(qū) 8
4.Photoshop的文件基本操作 8
5.常用工具操作 10
1.3.3 任務(wù)實(shí)現(xiàn)---圖像的繪制 12
1. 任務(wù)分析 12
2. 任務(wù)操作 12
項(xiàng)目二 圖層與圖層樣式 14
2.1 圖層 14
2.1.1任務(wù)引入 14
2.1.2知識(shí)引入 14
1.圖層及類型 14
2.圖層的基本操作 15
2.1.3 任務(wù)實(shí)現(xiàn) ---網(wǎng)頁(yè)頁(yè)面及導(dǎo)航條設(shè)計(jì) 17
1.任務(wù)分析 17
2.任務(wù)操作 18
2.2圖層模式 21
2.2.1任務(wù)引入 21
2.2.2知識(shí)引入 21
1.概述 21
2.圖層樣式操作 21
3.圖層模式類型 21
2.2.3 任務(wù)實(shí)現(xiàn) ---卡通圖標(biāo) 25
1.任務(wù)分析 25
2. 任務(wù)操作 25
2.3圖層樣式的應(yīng)用---異型邊框的設(shè)計(jì) 29
1.任務(wù)引入 29
2.任務(wù)知識(shí)分析 29
3.任務(wù)操作 29
項(xiàng)目三 繪制與修飾工具的使用 32
3.1 繪圖工具 32
3.1.1任務(wù)引入 32
3.1.2知識(shí)引入 32
1. 畫(huà)筆工具 32
2. 鉛筆工具 34
3. 顏色替換工具 35
4. 橡皮擦的使用 36
5. 修圖工具的使用 37
6. 修補(bǔ)工具的使用 38
3.1.3 任務(wù)實(shí)現(xiàn) ---漂亮畫(huà)筆的創(chuàng)建及應(yīng)用 40
1.任務(wù)分析 40
2.任務(wù)操作 40
3.2 修飾工具 41
3.2.1任務(wù)引入 41
3.2.2知識(shí)引入 41
1.漸變工具的使用 41
2.油漆桶工具的使用 43
3. 減淡/加深和海綿工具的使用 43
4.填充命令的使用 44
3.2.3 任務(wù)實(shí)現(xiàn) --- QQ卡通圖案的繪制 45
1.任務(wù)分析 45
2.任務(wù)實(shí)現(xiàn) 46
項(xiàng)目四 Photoshop CC的選區(qū)與路徑 52
4.1 選區(qū) 52
4.1.1任務(wù)引入 52
4.1.2知識(shí)引入 52
1. 選區(qū)的概念與作用 52
2. 幾何選區(qū)的創(chuàng)建 52
3. 不規(guī)則選區(qū)的創(chuàng)建 53
4. 創(chuàng)建顏色選區(qū) 54
5. 隨意選區(qū)的創(chuàng)建 54
6. 選區(qū)的編輯 54
4.1.3 任務(wù)實(shí)現(xiàn) ---機(jī)器人模型的制作 55
1. 任務(wù)分析 55
2. 任務(wù)操作 55
4.2 路徑的使用 56
4.2.1任務(wù)引入 56
4.2.2 知識(shí)引入 56
1.路徑的概念 56
2.基本元素 57
3.鋼筆工具的使用 57
4. 路徑的編輯工具 58
4.2.3 任務(wù)實(shí)現(xiàn) ---“音樂(lè)”網(wǎng)站標(biāo)志的制作 59
1. 任務(wù)分析 59
2. 任務(wù)操作 59
4.3 選區(qū)與路徑的應(yīng)用 60
4.3.1任務(wù)引入 60
4.3.2 知識(shí)引入” 60
1. 路徑的編輯操作 60
2. 選區(qū)與路徑的互轉(zhuǎn)操作 61
4.3.3 任務(wù)實(shí)現(xiàn) ---流線字的制作 62
1.任務(wù)分析 62
2.任務(wù)操作 62
項(xiàng)目五 Photoshop CC色彩及圖像調(diào)整 64
5.1色彩調(diào)整 64
5.1.1任務(wù)引入 64
5.1.2知識(shí)引入 64
1.色彩的元素組成 64
2.色彩模式 64
3.網(wǎng)頁(yè)配色 65
4.圖像“調(diào)整”命令 66
5.1.3 任務(wù)實(shí)現(xiàn) ---色彩調(diào)整命令的使用 69
1. 任務(wù)分析 69
2. 任務(wù)操作 69
5.2 圖片色階及曲線 71
5.2.1任務(wù)引入 71
5.2.2 知識(shí)引入 72
1.解析“色階” 72
2.解析“曲線” 73
5.2.3 任務(wù)實(shí)現(xiàn) ---綠水青山及撥云見(jiàn)日的制作 75
1. 任務(wù)分析 75
2. 任務(wù)操作 75
5.3調(diào)整命令的?用---相冊(cè)圖像的設(shè)計(jì) 77
1.任務(wù)引入 77
2.任務(wù)分析 77
3.任務(wù)實(shí)現(xiàn) 78
項(xiàng)目六 通道的應(yīng)用 81
6.1通道 81
6.1.1任務(wù)引入 81
6.1.2知識(shí)引入 81
1. 通道的概念 81
2. 通道的分類及功能 81
3. 選擇與編輯通道 82
4.復(fù)制和刪除通道 83
5.分離和合并通道 84
6.1.3 任務(wù)實(shí)現(xiàn) ---利用通道實(shí)現(xiàn)頭發(fā)的摳圖 84
1.任務(wù)分析 84
2.任務(wù)操作 84
6.2 通道計(jì)算 89
6.2.1任務(wù)引入 89
6.2.2 知識(shí)引入 89
1.計(jì)算”命令的使用 89
2.“應(yīng)用圖像”命令的使用 90
6.2.3 任務(wù)實(shí)現(xiàn) ---計(jì)算命令摳圖換背景 90
1.任務(wù)分析 90
2.任務(wù)操作 91
6.3 通道的使用 --- 化妝品廣告的設(shè)計(jì) 96
1.任務(wù)引入 96
2.任務(wù)分析 96
3.任務(wù)實(shí)現(xiàn) 97
項(xiàng)目七 蒙版的使用 107
7.1蒙版及蒙版的分類 107
7.1.1任務(wù)引入 107
7.1.2知識(shí)引入 107
1.蒙版的概念 107
2.蒙版的作用 107
3. 蒙版的類型 107
7.1.3 任務(wù)實(shí)現(xiàn)--人樹(shù)合體 110
1.任務(wù)分析 110
2.任務(wù)操作 110
7.2圖層蒙版的使用 ---燈泡的創(chuàng)意合成 112
7.2.1任務(wù)引入 112
7.2.2 任務(wù)分析 112
7.2.3 任務(wù)實(shí)現(xiàn) 112
7.3 蒙版的使用--茶葉包裝盒的制作 115
7.3.1任務(wù)引入 115
7.3.2 任務(wù)分析 116
7.3.3 任務(wù)實(shí)現(xiàn) 116
項(xiàng)目八 濾鏡的操作 121
8.1濾鏡的概述 121
8.1.1任務(wù)引入 121
8.1.2知識(shí)引入 121
1.濾鏡的概念及作用 121
2.濾鏡的特點(diǎn)? 121
3.濾鏡的使用方法及規(guī)則 122
8.1.3任務(wù)實(shí)現(xiàn) ------汽車飛馳效果 122
1.任務(wù)分析 122
2.任務(wù)操作 122
8.2濾鏡的類型 123
8.2.1任務(wù)引入 123
8.2.2 知識(shí)引入 124
1.獨(dú)立濾鏡 124
2.濾鏡庫(kù) 124
2. 特效濾鏡 127
8.2.3 任務(wù)實(shí)現(xiàn)------大理石效果 130
1.任務(wù)分析 130
2.任務(wù)操作 130
8.3濾鏡的操作 132
8.3.1任務(wù)引入 132
8.3.2 任務(wù)分析 132
8.3.3 任務(wù)實(shí)現(xiàn)---星空效果制作 132
1.任務(wù)分析 132
2.任務(wù)操作 132
項(xiàng)目九 網(wǎng)頁(yè)UI的規(guī)劃與設(shè)計(jì) 135
9.1 網(wǎng)頁(yè)UI基礎(chǔ)知識(shí) 135
9.1.1 虛擬界面 135
9.1.2 網(wǎng)頁(yè)界面的設(shè)計(jì)要求 135
9.1.3網(wǎng)頁(yè)版面典型風(fēng)格 136
9.1.4網(wǎng)頁(yè)結(jié)構(gòu)布局 136
1.“國(guó)”字型 136
2.拐角型 136
3.上下框架型 136
4.左右框架型 136
5.封面型 137
9.1.5網(wǎng)頁(yè)設(shè)計(jì)的組成元素 137
1. Logo 137
2.導(dǎo)航條 137
3. Banner 137
4.內(nèi)容版塊 138
5.版尾版塊 138
9.2網(wǎng)站UI的制作 138
9.2.1任務(wù)引入 138
9.2.2知識(shí)引入 138
1.餐飲門(mén)戶網(wǎng)站 138
2.餐飲網(wǎng)站分類 139
9.2.3 任務(wù)實(shí)現(xiàn)---美食網(wǎng)站設(shè)計(jì) 140
1. 任務(wù)知識(shí)分析 140
2. 任務(wù)操作 140
項(xiàng)目十 手機(jī)UI的質(zhì)感表現(xiàn) 153
10.1 金屬 153
10.1.1任務(wù)引入 153
10.1.2知識(shí)引入 153
1. UI設(shè)計(jì)的概念 153
2. UI設(shè)計(jì)原則 153
10.1.3 任務(wù)實(shí)現(xiàn) ---金屬按鈕的制作 154
1. 任務(wù)分析 154
2. 任務(wù)操作 154
10.2 玻璃 162
10.2.1任務(wù)引入 162
10.2.2 知識(shí)引入 162
1.內(nèi)發(fā)光圖層樣式 162
2.內(nèi)陰影圖層樣式 162
10.2.3 任務(wù)實(shí)現(xiàn) ---玻離質(zhì)感的制作 162
1. 任務(wù)分析 162
2. 任務(wù)操作 162
10.3 手機(jī)光滑表面 172
10.3.1任務(wù)引入 172
10.3.2 知識(shí)引入 172
1. 圖層面板 172
2. 漸變工具 172
10.3.3 任務(wù)實(shí)現(xiàn) ---手機(jī)表面的制作 173
1.任務(wù)分析 173
2.任務(wù)操作 173
項(xiàng)目十一 手機(jī)APP界面元素設(shè)計(jì) 183
11.1 按鈕 183
11.1.1任務(wù)引入 183
11.1.2知識(shí)引入 183
1. 按鈕的表現(xiàn)形式 183
2. 按鈕的狀態(tài) 183
11.1.3 任務(wù)實(shí)現(xiàn) --- 立體化按鈕的設(shè)計(jì) 184
1.任務(wù)知識(shí)分析 184
2. 任務(wù)操作 184
11.2 開(kāi)關(guān) 192
11.2.1任務(wù)引入 192
11.2.2 知識(shí)引入 193
1.復(fù)選框 193
2.單選按鈕 193
3.ON/OFF開(kāi)關(guān) 193
4.2.3 任務(wù)實(shí)現(xiàn) ---立體開(kāi)關(guān)的設(shè)計(jì) 194
1.任務(wù)分析 194
2.任務(wù)實(shí)現(xiàn) 194
11.3 進(jìn)度條 199
11.3.1任務(wù)引入 199
11.3.2 知識(shí)引入 199
1. 線性進(jìn)度指示器 199
2. 圓形進(jìn)度指示器 200
11.3.3 任務(wù)實(shí)現(xiàn) ---扁平化和立體化進(jìn)度條的設(shè)計(jì) 200
1.任務(wù)分析 200
2.任務(wù)操作 201
11.4 搜索欄 208
11.4.1任務(wù)引入 208
11.4.2 知識(shí)引入 208
1.搜索欄的用途 208
2.搜索欄的組成結(jié)構(gòu) 208
11.4.3 任務(wù)實(shí)現(xiàn) ---立體化搜索框的設(shè)計(jì) 208
1.任務(wù)分析 208
2.任務(wù)操作 208
11.5 列表框 213
11.5.1任務(wù)引入 213
11.5.2 知識(shí)引入 213
1.列表框的組成結(jié)構(gòu) 213
2.列表數(shù)據(jù)規(guī)范 213
11.5.3 任務(wù)實(shí)現(xiàn) ---立體化列表框的設(shè)計(jì) 213
1.任務(wù)分析 213
2.任務(wù)操作 213
項(xiàng)目十二 手機(jī)APP整體界面UI設(shè)計(jì) 219
12.1 網(wǎng)站APP設(shè)計(jì) 219
12.1.1任務(wù)引入 219
12.1.2知識(shí)引入 219
1. 界面布局規(guī)劃 219
2. 創(chuàng)意思路剖析 220
3. 確定配色方案 220
4. 定義組件風(fēng)格 221
12.1.3 任務(wù)實(shí)現(xiàn) ---美食網(wǎng)站APP設(shè)計(jì) 221
1. 任務(wù)分析 221
2. 任務(wù)操作 221
12.2網(wǎng)站APP制作 ---流量銀行APP設(shè)計(jì) 226
12.2.1任務(wù)引入 226
12.2.2知識(shí)引入 227
1. 界面布局規(guī)劃 227
2. 創(chuàng)意思路剖析 228
3. 確定配色方案 228
4. 定義組件風(fēng)格 229
12.2.3 任務(wù)實(shí)現(xiàn) 229
1. 任務(wù)分析 229
2. 任務(wù)操作 229