Photoshop CC移動UI界面設計與實戰

Photoshop CC移動UI界面設計與實戰

《Photoshop CC移動UI界面設計與實戰(含DVD光碟1張)(全彩)》是2015年6月電子工業出版社出版的圖書,作者是創銳設計。

內容簡介

《Photoshop CC移動UI界面設計與實戰(含DVD光碟1張)(全彩)》包含了大量精美的界面元素、App應用程式界面視覺設計的案例,利用較詳細的布局規劃、創意思維、配色方案、組件分析等部分來對案例的創作思路進行闡述,告訴讀者移動UI視覺設計的創作技巧。

內容提要

《Photoshop CC移動UI界面設計與實戰(含DVD光碟1張)(全彩)》一共包含三部分,共14個Part的內容。第1部分基礎篇(Part1~Part3):介紹移動UI視覺設計的基礎知識,Photoshop軟體的常用操作功能,以及介紹移動UI界面中基礎元素的設計規範;第2部分三大主流系統(Part4~Part6):分別對三大系統進行有針對性的講解,利用相關的案例介紹移動UI視覺設計的製作方法和技巧;第3部分App套用實例(Part7~Part14):以完整的App界面設計為主要內容,展示不同風格移動UI界面設計的特點和製作方法。

《Photoshop CC移動UI界面設計與實戰(含DVD光碟1張)(全彩)》包含了大量精美的界面元素、App應用程式界面視覺設計的案例,利用較詳細的布局規劃、創意思維、配色方案、組件分析等部分來對案例的創作思路進行闡述,告訴讀者移動UI視覺設計的創作技巧。

《Photoshop CC移動UI界面設計與實戰(含DVD光碟1張)(全彩)》特別適合移動設備UI視覺設計的初學者,同時對Photoshop使用者、平面設計師和App開發設計人員也有參考價值。

作者簡介

創銳設計,由一支優秀的平面設計師與圖形圖像資深編輯隊伍組成。出版過眾多優秀的圖形圖像方面的專業書籍,不僅在國內處於領先地位,還有大量作品輸出過海外著作權,備受讀者青睞。在課程教材方面,由於他們擁有多年教育培訓的經驗,因此十分了解初學讀者的心理需求,從而研究出了一套行之有效的教學方法;此外,他們又參加過多個商業項目的設計工作,熟悉行業規範、了解客戶需求,擁有較高的設計水平,積累了豐富的製作經驗、為專業進階讀者指出了技術進階的明路;在他們的圖書中,選擇的實例不僅融會貫通了軟體技法,更能通過分享圖像處理經驗,激發讀者的靈感、迸發發創意火花,達到事半功倍的效果。

目錄

Part 1 移動UI設計基礎 / 1

1.1 UI設計存在的意義 / 2

1.1.1 人機互動的橋樑 / 2

1.1.2 操作邏輯系統的展現 / 3

1.1.3 展現系統的整體風格 / 3

1.2 移動UI設計的原則 / 4

1.2.1 視覺一致性原則 / 4

1.2.2 視覺簡易性原則 / 5

1.2.3 從用戶的習慣考慮 / 6

1.2.4 操作的靈活性及人性化 / 8

1.3 三大主流作業系統的特點對比 / 9

1.4 不同系統UI視覺的主要組成要素及特徵 / 10

1.4.1 iOS系統中的組成要素及特徵 / 10

1.4.2 Android系統中的組成要素及特徵 / 12

1.4.3 WP系統中的組成要素及特徵 / 13

1.5 認識移動終端的解析度和像素 / 14

1.6 移動UI的創意與靈感收集 / 16

1.6.1 各種經驗和靈感的記錄 / 16

1.6.2 將對象抽象化 / 17

1.6.3 設計靈感的轉移 / 18

1.7 移動UI的視覺設計流程 / 20

Part 2 PS在移動UI設計中的常用功能簡介 / 23

2.1 繪圖工具的介紹 / 24

2.1.1 規則形狀的繪製 / 24

2.1.2 自定義形狀的繪製 / 25

2.1.3 繪製任意所需的形狀 / 27

2.2 圖層樣式的運用 / 28

2.2.1 增強立體感的圖層樣式 / 28

2.2.2 發光效果的圖層樣式 / 30

2.2.3 更改色彩的圖層樣式 / 31

2.3 蒙版的編輯 / 33

2.3.1 圖層蒙版 / 33

2.3.2 剪貼蒙版 / 34

2.4 文字的添加 / 36

2.4.1 文字的添加與設定 / 36

2.4.2 文字的高級編輯 / 37

Part 3 移動UI界面中基本元素的製作 / 39

3.1 按鈕 / 40

3.1.1 按鈕設計的基礎知識 / 40

3.1.2 扁平化按鈕的設計 / 41

3.2 開關 / 45

3.2.1 開關設計的基礎知識 / 45

3.2.2 簡易色塊開關的設計 / 47

3.3 進度條 / 49

3.3.1 進度條設計的基礎知識 / 49

3.3.2 扁平化進度條的設計 / 49

3.3.3 層次感強烈的進度條設計 / 52

3.4 搜尋欄 / 56

3.4.1 搜尋欄設計的基礎知識 / 56

3.4.2 扁平化搜尋欄的設計 / 58

3.5 列表框 / 63

3.5.1 列表框設計的基礎知識 / 63

3.5.2 簡易列表框的設計 / 64

3.5.3 立體化列表框的設計 / 68

3.6 標籤欄 / 70

3.6.1 標籤欄設計的基礎知識 / 70

3.6.2 線性化標籤欄設計 / 71

3.6.3 木紋質感的標籤欄設計 / 72

3.7 圖示欄 / 75

3.7.1 圖示欄設計的基礎知識 / 75

3.7.2 線性化圖示欄設計 / 76

3.7.3 紙箱紋理的圖示欄設計 / 79

Part 4 iOS系統及其組件的設計 / 83

4.1 iOS系統的發展及其特點 / 84

4.1.1 iOS系統的發展 / 84

4.1.2 iOS 8系統的設計特點 / 86

4.2 iOS系統設計的規範 / 89

4.2.1 設計原則 / 89

4.2.2 色彩和字型 / 92

4.2.3 圖示的設計 / 96

4.3 iOS系統界面設計實訓 / 100

4.3.1 扁平化圖示的設計 / 100

4.3.2 半透明效果的界面設計 / 108

Part 5 Android系統及其組件的設計 / 115

5.1 Android系統的特點 / 116

5.2 Android系統的設計規範 / 118

5.2.1 度量單位 / 118

5.2.2 字型的使用標準 / 118

5.2.3 色彩的套用規範 / 121

5.2.4 四種類型的圖示 / 124

5.3 六種標準的Widget規範 / 126

5.3.1 Widget框架簡介 / 126

5.3.2 Widget框架的標準尺寸 / 128

5.3.3 4×1的Widget框架設計 / 129

5.3.4 3×3的Widget框架設計 / 133

5.3.5 2×2的Widget框架設計 / 137

5.3.6 4×1的加長Widget框架設計 / 140

5.3.7 3×3的橫向Widget框架設計 / 144

5.3.8 2×2的橫向Widget框架設計 / 149

5.4 Android系統界面設計實訓 / 154

5.4.1 立體化的圖示設計 / 154

5.4.2 超強立體感的界面設計 / 163

Part 6 WP系統及其組件的設計 / 175

6.1 WP系統的特點 / 176

6.2 高自由度的Live Tiles / 178

6.2.1 Live Tiles簡介 / 178

6.2.2 Live Tiles常見表現形式 / 180

6.2.3 Live Tiles設計的十大要點 / 181

6.2.4 Live Tiles設計 / 185

6.3 獨特的Panorama / 183

6.3.1 Panorama(全景視圖)簡介 / 187

6.3.2 Panorama設計注意事項 / 188

6.3.3 Panorama設計 / 193

6.4 WP系統界面設計實訓 / 196

6.4.1 線性圖示的設計 / 196

6.4.2 極簡風格的界面設計 / 200

Part 7 孕媽幫手App設計 / 207

界面布局規劃 / 208

創意思路剖析 / 208

確定配色方案 / 209

定義組件風格 / 210

製作步驟詳解 / 210

Part 8 新聞網站App設計 / 221

界面布局規劃 / 222

創意思路剖析 / 222

確定配色方案 / 223

定義組件風格 / 224

製作步驟詳解 / 224

Part 9 美食網站App設計 / 237

界面布局規劃 / 238

創意思路剖析 / 238

確定配色方案 / 239

定義組件風格 / 240

製作步驟詳解 / 240

Part 10 籃球運動App設計 / 253

界面布局規劃 / 254

創意思路剖析 / 254

確定配色方案 / 255

定義組件風格 / 255

製作步驟詳解 / 256

Part 11 流量銀行App設計 / 269

界面布局規劃 / 270

創意思路剖析 / 270

確定配色方案 / 271

定義組件風格 / 271

製作步驟詳解 / 272

Part 12 藏寶遊戲App設計 / 283

界面布局規劃 / 284

創意思路剖析 / 284

確定配色方案 / 285

定義組件風格 / 286

製作步驟詳解 / 286

Part 13 音樂播放App設計 / 209

界面布局規劃 / 300

創意思路剖析 / 300

確定配色方案 / 301

定義組件風格 / 302

製作步驟詳解 / 302

Part 14 旅遊資訊App設計 / 319

界面布局規劃 / 320

創意思路剖析 / 320

確定配色方案 / 321

定義組件風格 / 322

製作步驟詳解 / 322

相關詞條

熱門詞條

聯絡我們