Photoshop UI設計完全自學手冊

《Photoshop UI設計完全自學手冊》是2021年清華大學出版社出版的圖書。

基本介紹

• 中文名：Photoshop UI設計完全自學手冊
• 作者：任桂玲
• 出版時間：2021年6月
• 出版社：清華大學出版社
• ISBN：9787302577140
• 類別：計算機/網路
• 開本：16 開
• 裝幀：平裝-膠訂

內容簡介

《Photoshop UI設計完全自學手冊》是一本全面介紹Photoshop UI設計的專業教程，涵蓋了UI設計各個領域的內容，讀者通過一本書就可以掌握Photoshop的基本操作以及各個領域中UI設計的技巧和方法。 《Photoshop UI設計完全自學手冊》共10章，分別介紹Photoshop與UI設計（設計基礎）、Photoshop的基本操作、摳圖的技巧、圖像的調色技法、圖形的繪製、圖層和蒙版的使用技巧、文字在設計中的套用、濾鏡的使用、Web和切片輸出，後一章是綜合案例。 《Photoshop UI設計完全自學手冊》配套資源包內含有所有案例的素材、源檔案和教學視頻，讀者可以結合書、練習檔案和教學視頻提升學習App UI設計的效率。

《Photoshop UI設計完全自學手冊》適合Photoshop初學者、UI設計愛好者、App UI設計從業者閱讀，也適合作為各院校相關設計專業的參考教材。

圖書目錄

第1章　Photoshop與UI設計——設計基礎001

1.1　UI設計基礎001

1.1.1　什麼是UI設計001

1.1.2　UI設計的常見類別001

1.1.3　UI設計常用的工具001

1.2　良好的UI用戶體驗003

1.2.1　用戶體驗003

1.2.2　影響用戶體驗的因素003

1.3　UI設計風格004

1.3.1　擬物化設計風格004

1.3.2　扁平化設計風格004

1.4　UI設計的構成法則005

1.4.1　什麼是構成005

1.4.2　形式美法則005

1.4.3　構成的思維方式006

1.5　圖像的分類007

1.5.1　點陣圖007

1.5.2　矢量圖008

1.6　UI設計中的色彩搭配技巧009

1.6.1　色彩的三屬性009

1.6.2　基礎配色技巧009

1.6.3　色彩的搭配法則011

1.7　UI設計的原則012

1.7.1　視覺美觀012

1.7.2　突出主題013

1.7.3　整體性013

1.7.4　為用戶考慮013

1.7.5　快速載入014

1.8　UI設計的一般流程014

1.9　PC端和移動端的UI設計規範015

1.9.1　界面不同015

1.9.2　PC端的設計規範016

1.9.3　移動端的設計規範017

第2章　Photoshop 的基本操作——製作技巧019

2.1　Photoshop 的安裝019

2.1.1　實戰——安裝Photoshop019

2.1.2　Photoshop 的啟動020

2.2　Photoshop 的工作界面021

2.2.1　選單欄021

2.2.2　工具箱022

2.2.3　選項欄023

2.2.4　面板023

2.2.5　檔案視窗023

2.2.6　狀態欄024

2.3　查看圖像024

2.3.1　螢幕模式024

2.3.2　在多視窗中查看圖像024

2.3.3　使用“縮放工具”027

2.3.4　實戰——使用“縮放工具”調整視窗比例028

2.3.5　使用“抓手工具”029

2.3.6　使用“旋轉視圖工具”029

2.3.7　使用“導航器”面板029

2.4　圖像編輯的輔助操作030

2.4.1　標尺030

2.4.2　參考線030

2.4.3　格線031

2.5　新建檔案031

2.6　打開檔案033

2.6.1　使用“打開”命令033

2.6.2　使用“打開為”命令033

2.6.3　使用“在Bridge中瀏覽”命令034

2.6.4　使用“近打開檔案”命令034

2.6.5　使用“打開為智慧型對象”命令035

2.6.6　置入檔案035

2.6.7　導入檔案035

2.7　導出、保存、關閉檔案036

2.7.1　導出檔案036

2.7.2　保存檔案036

2.7.3　實戰——打開和保存檔案037

2.7.4　關閉檔案037

2.8　修改圖像大小037

2.9　修改畫布大小038

2.9.1　修改畫布038

2.9.2　顯示全部039

2.9.3　旋轉畫布039

2.9.4　實戰——旋轉圖像039

2.10　裁剪圖像039

2.10.1　了解“裁剪工具”040

2.10.2　了解“透視裁剪工具”041

2.10.3　實戰——使用“透視裁剪工具”修正圖像042

2.10.4　使用“圖像>裁剪”命令042

2.10.5　使用“圖像>裁切”命令042

2.11　圖像的複製和貼上042

2.11.1　複製檔案043

2.11.2　複製與貼上043

2.11.3　使用“合併拷貝”命令043

2.11.4　選擇性貼上043

2.11.5　剪下圖像044

2.11.6　清除圖像045

2.12　圖像的基本操作045

2.12.1　移動圖像045

2.12.2　變換圖像046

2.12.3　縮放和旋轉圖像046

2.12.4　斜切和扭曲圖像047

2.12.5　透視和變形圖像048

2.12.6　實戰——為杯子變換樣式048

2.12.7　操控變形049

2.13　還原與恢復操作050

2.13.1　還原和重做050

2.13.2　前進一步和後退一步050

2.13.3　恢復檔案 050

2.13.4　“歷史記錄”面板050

2.13.5　實戰——使用“歷史記錄”面板還原圖像051

第3章　掌握摳圖的技巧——處理界面中的圖像053

3.1　創建規則形狀選區053

3.1.1　矩形選框工具053

3.1.2　橢圓選框工具054

3.1.3　單行和單列選框工具054

3.1.4　實戰——添加底紋效果054

3.2　創建不規則形狀選區056

3.2.1　套索工具056

3.2.2　多邊形套索工具056

3.2.3　磁性套索工具057

3.2.4　實戰——製作圖示倒影057

3.2.5　魔棒工具058

3.2.6　快速選擇工具058

3.2.7　實戰——快速摳圖059

3.3　其他創建選區的方法059

3.3.1　色彩範圍 059

3.3.2　實戰——提升人物臉部的膚色061

3.3.3　快速蒙版062

3.3.4　調整邊緣062

3.3.5　實戰——利用調整邊緣摳圖063

3.4　選區的基本操作064

3.5　修改選區065

3.5.1　移動選區 065

3.5.2　邊界065

3.5.3　平滑選區065

3.5.4　擴展與收縮選區066

3.5.5　羽化選區066

3.5.6　反向選區066

3.5.7　選取相似和擴大選取067

3.6　選區的運算067

3.6.1　新選區067

3.6.2　添加到選區067

3.6.3　從選區減去068

3.6.4　與選區交叉068

3.7　編輯選區068

3.7.1　變換選區068

3.7.2　填充選區069

3.7.3　描邊選區069

3.7.4　隱藏和顯示選區069

3.7.5　實戰——為人物打造簡易妝容069

3.8　存儲和載入選區 070

3.8.1　存儲選區 070

3.8.2　載入選區 071

3.8.3　使用通道保存和載入選區071

3.8.4　使用路徑保存和載入選區 072

3.8.5　使用圖層載入選區072

第4章　圖像的調色技法——定義不同的色彩073

4.1　顏色的基本概念073

4.1.1　色彩屬性073

4.1.2　色彩模式073

4.2　圖像色彩模式的轉換074

4.2.1　實戰——RGB和CMYK模式的轉換075

4.2.2　實戰——點陣圖模式和灰度模式的轉換075

4.2.3　實戰——點陣圖模式轉換為雙色調模式076

4.2.4　索引顏色模式轉換077

4.3　色域和溢色078

4.3.1　色域 078

4.3.2　溢色078

4.3.3　使用色域警告078

4.4　選擇顏色078

4.4.1　前景色和背景色078

4.4.2　“信息”面板079

4.4.3　實戰——“信息”面板在調節圖像時的數值信息提示079

4.4.4　使用“顏色取樣器工具”080

4.4.5　實戰——使用“顏色取樣器工具”吸取顏色080

4.4.6　使用“拾色器”對話框081

4.4.7　使用“吸管工具”選取顏色082

4.4.8　使用“顏色”面板082

4.4.9　使用“色板”面板083

4.4.10　實戰——使用“油漆桶工具”為圖示換色084

4.5　填充顏色084

4.5.1　使用“填充”命令 085

4.5.2　實戰——使用“填充”命令為圖示製作高光效果085

4.5.3　實戰——使用“內容識別”填充086

4.5.4　實戰——使用“圖案”填充086

4.5.5　實戰——使用“歷史記錄”填充087

4.5.6　使用“油漆桶工具”087

4.5.7　使用“漸變工具”088

4.5.8　實戰——載入外部漸變繪製電台播放界面090

4.6　色彩管理092

4.6.1　色彩設定092

4.6.2　指定配置檔案093

4.6.3　轉為配置檔案093

第5章　圖形的繪製——為界面添加質感094

5.1　基本繪圖工具094

5.1.1　畫筆工具094

5.1.2　鉛筆工具095

5.1.3　顏色替換工具095

5.1.4　混合器畫筆工具096

5.1.5　實戰——存儲、載入、替換和復位畫筆096

5.2　設定畫筆的基本樣式097

5.2.1　使用預設畫筆工具097

5.2.2　實戰——自定義畫筆筆刷098

5.2.3　設定繪圖模式098

5.2.4　實戰——使用“畫筆工具”繪製簡單質感按鈕101

5.3　“畫筆”面板102

5.3.1　設定繪圖模式102

5.3.2　設定畫筆筆尖103

5.3.3　形狀動態104

5.3.4　散布104

5.3.5　紋理105

5.3.6　雙重畫筆106

5.3.7　顏色動態106

5.3.8　傳遞107

5.3.9　畫筆筆勢107

5.3.10　其他畫筆選項108

5.3.11　實戰——使用“畫筆工具”為按鈕添加質感108

5.4　路徑和錨點110

5.4.1　認識路徑和錨點110

5.4.2　使用“鋼筆工具”111

5.4.3　實戰——使用“鋼筆工具”繪製App圖示112

5.4.4　自由鋼筆工具113

5.4.5　選擇和編輯路徑113

5.4.6　錨點的基本操作114

5.4.7　實戰——存儲和剪貼路徑115

5.5　路徑的操作116

5.5.1　“路徑”面板116

5.5.2　路徑的基本操作116

5.5.3　填充路徑118

5.5.4　路徑與選區的轉換118

5.5.5　實戰——描邊路徑119

5.6　形狀工具120

5.6.1　矩形工具120

5.6.2　圓角矩形工具121

5.6.3　橢圓工具121

5.6.4　多邊形工具122

5.6.5　直線工具122

5.6.6　自定形狀工具123

5.6.7　實戰——繪製播放器App界面123

5.6.8　實戰——定義自定形狀125

5.6.9　實戰——使用形狀工具繪製照相機圖示125

第6章　圖層和蒙版的使用技巧——完整結構128

6.1　圖層的概述128

6.1.1　什麼是圖層128

6.1.2　“圖層”面板128

6.1.3　圖層的類型129

6.1.4　實戰——使用調整圖層130

6.2　圖層的創建與選擇131

6.2.1　實戰——創建新圖層131

6.2.2　創建“背景”圖層131

6.2.3　圖層的選擇132

6.2.4　創建與編輯圖層組133

6.2.5　實戰——圖層編組在UI作品中的使用134

6.3　圖層的編輯135

6.3.1　實戰——移動、複製和刪除圖層135

6.3.2　調整圖層的疊放順序135

6.3.3　鎖定圖層136

6.3.4　連結圖層136

6.3.5　柵格化圖層136

6.3.6　實戰——自動對齊圖層136

6.3.7　自動混合圖層137

6.4　合併圖層和蓋印圖層137

6.4.1　實戰——合併圖層137

6.4.2　拼合圖像138

6.4.3　實戰——蓋印圖層138

6.4.4　蓋印“背景”圖層139

6.5　“圖層複合”面板139

6.6　設定圖層的混合效果140

6.6.1　設定圖層的不透明度140

6.6.2　設定“混合選項”140

6.6.3　添加圖層樣式141

6.6.4　實戰——通過添加圖層樣式為界面添加質感143

6.7　編輯圖層樣式145

6.7.1　顯示與隱藏效果145

6.7.2　修改效果145

6.7.3　複製與貼上圖層效果146

6.7.4　清除圖層樣式146

6.7.5　使用“全局光”和“等高線”147

6.7.6　實戰——套用圖層編輯功能使作品擁有完整結構147

6.8　“樣式”面板的使用148

6.8.1　認識“樣式”面板148

6.8.2　創建樣式和刪除樣式149

6.8.3　存儲樣式149

6.8.4　載入樣式150

6.9　填充和調整圖層150

6.9.1　純色填充150

6.9.2　漸變填充150

6.9.3　實戰——使用圖案填充製作圖示151

6.9.4　調整圖層152

6.10　認識蒙版152

6.10.1　蒙版的簡介及分類152

6.10.2　蒙版的“屬性”面板153

6.11　圖層蒙版153

6.11.1　認識圖層蒙版153

6.11.2　實戰——使用圖層蒙版繪製圖示154

6.12　矢量蒙版156

6.12.1　創建矢量蒙版156

6.12.2　編輯和變換矢量蒙版156

6.12.3　為矢量蒙版添加樣式157

6.13　剪貼蒙版157

6.13.1　認識剪貼蒙版157

6.13.2　剪貼蒙版的“混合樣式”157

6.13.3　釋放剪貼蒙版 158

6.13.4　實戰——繪製視頻播放界面158

第7章　文字在設計中的套用——巧用文字160

7.1　使用文字160

7.1.1　認識文字工具160

7.1.2　輸入橫排文字160

7.1.3　實戰——輸入橫排文字160

7.1.4　輸入直排文字162

7.1.5　輸入段落文字162

7.1.6　實戰——輸入段落文字162

7.1.7　點文本與段落文本的相互轉換163

7.2　選擇文本163

7.2.1　選擇全部文本163

7.2.2　選擇部分文本164

7.3　使用文字工具的選項欄164

7.3.1　切換文本取向164

7.3.2　設定字型系列164

7.3.3　設定字型樣式165

7.3.4　設定字型大小165

7.3.5　實戰——設定字型的樣式及大小165

7.3.6　消除鋸齒167

7.3.7　文本的對齊方式167

7.4　設定字元和段落屬性167

7.4.1　“字元”面板167

7.4.2　“段落”面板168

7.4.3　“字元樣式”面板和“段落樣式”面板169

7.4.4　實戰——設定“字元”和“段落”面板169

7.5　創建路徑文字171

7.5.1　創建沿路徑排列的文字171

7.5.2　移動與翻轉路徑文字171

7.5.3　編輯文字路徑171

7.5.4　實戰——編輯文字路徑172

7.6　變形文字173

7.6.1　創建變形文字173

7.6.2　變形選項的選擇173

7.6.3　重置變形與取消變形173

7.7　編輯文字174

7.7.1　載入文字選區174

7.7.2　將文字轉換為路徑174

7.7.3　將文字轉換為形狀174

7.7.4　拼寫檢查174

7.7.5　查找和替換文本175

7.8　“文字”選單175

7.8.1　OpenType176

7.8.2　凸出為3D176

7.8.3　柵格化文字圖層176

7.8.4　字型預覽大小176

7.8.5　語言選項176

7.8.6　更新所有文字圖層176

7.8.7　替換所有缺欠字型176

7.8.8　貼上Lorem Ipsum176

第8章　濾鏡的使用——界面中的特效177

8.1　認識濾鏡177

8.2　濾鏡庫177

8.3　自適應廣角178

8.3.1　“自適應廣角”命令178

8.3.2　實戰——修復“廣角視圖”照片179

8.4　鏡頭校正180

8.4.1　“鏡頭校正”命令180

8.4.2　實戰——校正歪斜圖像182

8.5　液化182

8.5.1　“液化”濾鏡183

8.5.2　實戰——使用“液化”濾鏡製作簡單圖示183

8.6　油畫185

8.7　消失點185

8.8　“風格化”濾鏡組187

8.8.1　查找邊緣187

8.8.2　等高線187

8.8.3　風187

8.8.4　浮雕效果187

8.8.5　擴散188

8.8.6　拼貼188

8.8.7　曝光過度188

8.8.8　凸出189

8.9　“模糊”濾鏡組189

8.9.1　場景模糊189

8.9.2　光圈模糊190

8.9.3　傾斜偏移190

8.9.4　其他模糊191

8.9.5　實戰——使用“高斯模糊”濾鏡製作界面背景194

8.10　“扭曲”濾鏡組197

8.10.1　波浪197

8.10.2　波紋197

8.10.3　極坐標197

8.10.4　擠壓198

8.10.5　切變198

8.10.6　實戰——使用“球面化”濾鏡製作立體按鈕198

8.10.7　水波199

8.10.8　旋轉扭曲199

8.10.9　置換199

8.11　“銳化”濾鏡組199

8.11.1　USM銳化199

8.11.2　進一步銳化199

8.11.3　銳化200

8.11.4　銳化邊緣200

8.11.5　智慧型銳化200

8.12　“視頻”濾鏡組201

8.12.1　NTSC顏色201

8.12.2　逐行201

8.13　“像素化”濾鏡組201

8.13.1　彩塊化201

8.13.2　彩色半調201

8.13.3　點狀化201

8.13.4　晶格化202

8.13.5　實戰——使用“馬賽克”濾鏡製作背景202

8.13.6　碎片202

8.13.7　銅版雕刻202

8.14　“渲染”濾鏡組203

8.14.1　分層雲彩203

8.14.2　光照效果203

8.14.3　實戰——使用“鏡頭光暈”濾鏡和“水波”濾鏡製作水波效果203

8.14.4　纖維204

8.14.5　雲彩204

8.14.6　實戰——使用“雲彩”命令製作紋理效果205

8.15　“雜色”濾鏡組206

8.15.1　減少雜色206

8.15.2　蒙塵與劃痕206

8.15.3　去斑207

8.15.4　添加雜色207

8.15.5　中間值207

8.15.6　實戰——使用“添加雜色”濾鏡製作質感圖示207

8.16　“其他”濾鏡組209

8.16.1　高反差保留209

8.16.2　位移209

8.16.3　自定210

8.16.4　值210

8.16.5　小值210

8.17　Digimarc濾鏡210

8.18　外掛濾鏡211

8.18.1　安裝外掛濾鏡211

8.18.2　實戰——安裝外掛濾鏡 211

第9章　Web和切片輸出——輸出作品213

9.1　創建切片213

9.1.1　切片的類型213

9.1.2　使用“切片工具”創建切片213

9.1.3　基於參考線創建切片213

9.1.4　基於圖層創建切片214

9.1.5　實戰——創建切片214

9.2　編輯切片215

9.2.1　選擇、移動與調整切片215

9.2.2　實戰——劃分切片215

9.2.3　組合與刪除切片217

9.2.4　轉換為用戶切片217

9.2.5　設定切片選項218

9.2.6　實戰——為切片添加超連結219

9.3　最佳化和輸出Web圖像220

9.3.1　Web安全顏色220

9.3.2　最佳化Web圖像220

9.3.3　實戰——最佳化Web圖像222

9.3.4　輸出Web圖像223

9.3.5　實戰——輸出Web圖像223

第10章　綜合案例225

10.1　逼真話筒圖示設計225

10.1.1　案例分析225

10.1.2　色彩分析225

10.1.3　製作步驟225

10.2　簡潔遊戲按鈕設計232

10.2.1　案例分析232

10.2.2　色彩分析232

10.2.3　製作步驟232

10.3　Android系統音樂App UI設計234

10.3.1　案例分析234

10.3.2　色彩分析234

10.3.3　製作步驟234

10.4　iOS系統鬧鐘App UI設計238

10.4.1　案例分析238

10.4.2　色彩分析238

10.4.3　製作步驟238

10.5　PC端天氣軟體UI設計241

10.5.1　案例分析241

10.5.2　色彩分析241

10.5.3　製作步驟241