《Photoshop扁平化平面設計手冊》是2016年6月電子工業出版社出版的圖書,作者是高金山。
基本介紹
- 書名:Photoshop扁平化平面設計手冊
- 作者:高金山
- ISBN:9787121287954
- 頁數:336頁
- 定價:79.8元
- 出版社:電子工業出版社
- 出版時間:2016年6月
- 開本:16開
內容簡介,圖書目錄,
內容簡介
本書是一本使用Photoshop進行扁平化設計製作的案例教程,語言淺顯易懂,配合大量精美的設計案例,講解了有關扁平化設計的相關知識和使用Photoshop進行扁平化設計製作的方法和技巧。使讀者在掌握扁平化設計各方面知識的同時,能夠在軟體製作基礎上做到活學活用。本糊照凝書配套的光碟中提供了本書所有案例的源檔案、素材及視頻淚霉頌贈教程,方便讀者借鑑和使用。
圖書目錄
CHAPTER 1
認識扁平化設計 1
1.1 擬物化設計概述 2
1.1.1 認識擬物化設計 2
1.1.2 擬物化設計的優點 2
1.1.3 擬物化設計缺點 3
1.2 扁平化設計概述 3
1.2.1 認識扁平化設計 3
1.2.2 扁平化設計優點 4
1.2.3 扁平化設計缺點 5
1.3 扁平化設計所帶來的改變 5
1.3.1 全新的設計風格 5
1.3.2 設尋少立計變得簡單直接 6
1.3.3 使用更加高效 6
1.4 扁平化設計的突出特點 7
1.4.1 強調簡約 7
1.4.2 快速高效 8
1.4.3 信息催迎榆突出 8
1.4.4 簡潔清晰 8
1.4.5 修改方便 9
1.5 扁平化與類扁平化 9
1.5.1 扁平化流行的必然性 9
1.5.2 扁平化設計的局限性 10
1.5.3 類扁平化設計 11
1.6 如何設計出色的扁平化作品 12
1.6.1 去除特效 12
1.6.2 簡化提取 12
1.6.3 巧用色彩 13
1.6.4 排版很重要 13
1.7 本章小結 16
CHAPTER 2
扁平化圖示設計 17
2.1 了解圖示設計 18
2.1.1 什麼是圖示 18
2.1.2 圖示設計的重要性 18
2.1.3 圖示常用尺寸 20
2.1.4 圖示常用格式 21
2.2 4種設計風格的扁平化圖示 22
2.2.1 基礎風格 22
案例分析—簡約基礎風格圖示設計分析 22
實戰案例—設計基礎風格手機圖示 23
2.2.2 陰影風格 27
案例分析—復古陰影風格圖示設計分析 27
實戰案例—設計陰影風格日曆圖示 28
2.2.3 長陰影風格 31
案例分析—長陰影風格相機圖示設計分析 31
實戰案例—設計長陰影風格勳章圖示 32
2.2.4 微漸變風格 40
案例分析—危主朵灑微漸變風格圖示設計分析 40
實戰案例—設計微漸變手機常用圖示 41
2.3 扁平化圖示設臘漏計原則 46
2.3.1 具有驗戒狼很強的辨識性 46
2.3.2 簡約實用 47
2.3.3 圖示之間的差異性 47
2.3.4 具有很強的創意性 47
2.3.5 美觀大方的視覺表現效果 48
2.3.6 與使用環境的協調性 48
案例分析—扁平化郵件圖示設計分析 49
實戰案例—設計唱片音樂圖示 49
2.4 扁平化圖示設計技巧 54
2.4.1 什麼是好的扁平化圖示 54
2.4.2 圖示的設計表現技巧 54
2.4.3 扁平化圖示的設計過程 55
案例分析—扁平化醫療圖示設計分析 55
實戰案例—設計扁平化相機圖示 56
2.5 本章小結 64
CHAPTER 3
iOS系統扁平化設計 65
3.1 了解iOS系統 66
3.1.1 什麼是iOS系統 66
3.1.2 iOS系統的發展歷史 66
3.1.3 iOS系統手機常見螢幕尺寸
標準 67
3.2 iOS系統界面的設計原則 68
3.2.1 美觀性 69
3.2.2 一致性 69
3.2.3 操作便捷 70
3.2.4 及時反饋 70
3.2.5 暗喻 71
3.2.6 用戶控制 71
案例分析—iOS系統通話界面設計分析 72
實戰案例—設計iOS系統手機待機界面 72
3.3 iOS系統界面的設計規範 77
3.3.1 確保在iPhone和iPad上通用 78
3.3.2 重新考慮基於Web的設計 78
案例分析—iOS系統城市天氣界面設計
分析 79
實戰案例—設計iOS系統手機天氣界面 79
3.4 iOS界面基本圖形 83
3.4.1 矩形 83
3.4.2 圓角矩形 84
3.4.3 圓形 84
3.4.4 其他形狀 85
案例分析—iOS系統軟體主界面設計分析 85
實戰案例—設計iOS系統手機主界面 86
3.5 扁平化設計要點 91
3.5.1 精簡 91
3.5.2 大膽 91
3.5.3 細緻 91
3.5.4 精美 92
案例分析—iOS系統收音機界面設計分析 92
實戰案例—設計iOS系統音樂播放界面 93
3.6 本章小結 100
CHAPTER 4
了解Android系統 101
4.1 了解Android系統 102
4.1.1 什麼是Android系統 102
4.1.2 Android系統的發展歷史 102
4.1.3 Android系統手機常見螢幕
尺寸標準 103
4.2 Android系統的設計原則 104
4.2.1 美觀大方的界面 104
4.2.2 使用戶操作更加簡單 105
4.2.3 完善的操作流程 107
案例分析—Android系統手機主界面
設計分析 108
實戰案例—設計Android系統手機待
機界面 108
4.3 如何實現扁平化設計 113
4.3.1 簡化設計元素 113
4.3.2 注意字型的套用 114
4.3.3 注意色彩的搭配 114
4.3.4 簡化互動 115
4.3.5 使用類扁平化設計 115
案例分析—Android系統平板主界面
設計分析 116
實戰案例—設計Android系統手機主
界面 116
4.4 Android系統界面的特點 121
4.4.1 簡約大方 121
4.4.2 操作便捷 121
4.4.3 通用性強 122
4.4.4 布局合理 122
案例分析—Android系統手機天氣界面
設計分析 122
實戰案例—設計Android系統病毒查殺
界面 123
4.5 本章小結 128
CHAPTER 5
扁平化APP界面設計 129
5.1 了解APP 129
5.1.1 什麼是APP 129
5.1.2 APP軟體的類型 129
5.2 APP軟體界面布局 131
5.2.1 iOS系統APP軟體界面布局
說明 132
案例分析—朋友圈APP界面設計分析 132
實戰案例—設計天氣APP界面 133
5.2.2 Android系統APP軟體界面
布局說明 137
案例分析—網路設備APP軟體界面設計
分析 138
實戰案例—設計醫療APP軟體界面 139
5.3 常見APP軟體引導界面類型 146
5.3.1 功能介紹類 146
5.3.2 使用說明類 146
5.3.3 推廣類 146
5.3.4 問題解決類 147
案例分析—網路軟體APP引導界面設計
分析 147
實戰案例—設計APP引導界面 148
5.4 APP軟體界面的設計原則 155
5.4.1 實用性 155
5.4.2 統一的色彩與風格 155
5.4.3 合理的配色 156
5.4.4 規範的操作流程 156
5.4.5 視覺元素規範 156
案例分析—訂餐APP軟體界面設計分析 157
實戰案例—設計手機衛士APP界面 157
5.5 APP軟體界面的設計要求 165
5.5.1 APP軟體界面的特點 165
5.5.2 APP軟體界面設計流程 166
5.5.3 APP軟體界面的色彩搭配 166
5.5.4 平板電腦軟體界面的特點 167
案例分析—平板電腦旅遊APP界面設計
分析 167
實戰案例—設計平板電腦音樂APP界面 168
5.6 APP界面設計注意事項 176
5.6.1 APP界面視覺設計 176
5.6.2 APP界面設計的用戶體驗 177
案例分析—平板電腦訂餐APP界面設計
分析 178
實戰案例—設計平板電腦相親APP界面 178
5.7 本章小結 188
CHAPTER 6
扁平化網頁界面設計 189
6.1 了解扁平化網頁界面設計 190
6.1.1 什麼是網頁界面設計 190
6.1.2 網頁界面設計的特點 190
6.2 網頁界面構成元素 193
6.2.1 文字 193
6.2.2 圖像 193
6.2.3 多媒體 193
6.2.4 色彩 194
案例分析—餐飲類網站界面設計分析 194
實戰案例—設計汽車宣傳網頁界面 195
6.3 扁平化網頁設計元素 201
6.3.1 圖示 201
6.3.2 圓角 201
6.3.3 折角 202
6.3.4 標籤 202
6.3.5 徽章 202
6.3.6 條紋 203
6.3.7 裝飾元素 203
6.3.8 裝飾背景 203
案例分析—產品宣傳網站界面設計分析 204
實戰案例——設計企業網站界面 204
6.4 扁平化設計配色 213
6.4.1 常見的扁平化配色風格 213
6.4.2 常見扁平化設計顏色 215
案例分析—女性時尚網站界面設計分析 215
實戰案例—設計環保網站界面 216
6.5 扁平化網站界面布局 223
6.5.1 偏扁平化網站界面布局
結構標準 223
6.5.2 扁平化網站界面布局的
兩個要點 224
6.5.3 為用戶考慮原則 224
案例分析—產品專題頁設計分析 225
實戰案例—設計手機宣傳網站界面 225
6.6 本章小結 232
CHAPTER 7
扁平化軟體界面設計 233
7.1 了解軟體界面設計 234
7.1.1 什麼是軟體界面設計 234
7.1.2 網站界面設計與軟體界面
設計的區別 234
7.2 軟體界面的設計法則 235
7.2.1 以軟體功能操作為基礎 235
7.2.2 具有清晰的層次結構 235
7.2.3 一致性和標準化 238
7.2.4 良好的視覺反饋 239
案例分析—檔案分享和管理軟體界面
設計分析 240
實戰案例—設計網路雲盤軟體界面 241
7.3 軟體界面的發展 246
7.3.1 傳統軟體界面 246
7.3.2 扁平化軟體界面趨勢 247
案例分析—圖像處理軟體界面設計分析 247
實戰案例—設計視頻轉換軟體界面 247
7.4 扁平化軟體界面介紹 257
7.4.1 軟體界面分類 257
7.4.2 軟體界面設計要點 257
7.4.3 軟體界面的螢幕顯示 258
7.4.4 軟體界面的設計原則 259
案例分析—企業管理軟體界面設計分析 259
實戰案例—設計手機管理軟體界面 260
7.5 軟體界面中的色彩搭配 269
7.5.1 保持色調的一致 269
7.5.2 使用柔和的色彩 269
7.5.3 使用色彩作為功能分界的識別元素 270
7.5.4 提供可選配色方案 270
7.5.5 色彩搭配需要具有辨識度 270
7.5.6 控制色彩的使用數量 271
案例分析—視頻軟體界面設計分析 271
實戰案例—設計音樂播放器軟體界面 272
7.6 本章小結 282
CHAPTER 8
扁平化在平面設計中的套用 283
8.1 了解平面媒體設計 284
8.1.1 什麼是平面媒體設計 284
8.1.2 扁平化平面媒體設計 284
案例分析—兒童活動宣傳廣告設計分析 285
實戰案例—設計活動宣傳廣告 285
8.2 扁平化設計中的字型 291
8.2.1 字型套用的重要性 291
8.2.2 扁平化設計中常用英文字型 292
8.2.3 扁平化設計中常用中文字型 294
案例分析—電影院活動海報設計分析 295
實戰案例—設計通信宣傳DM單頁 296
8.3 扁平化平面媒體設計要求 301
8.3.1 主題鮮明突出 302
8.3.2 形式與內容統一 302
8.3.3 強化整體布局 302
案例分析—企業文化宣傳展板設計分析 303
實戰案例—設計房地產圍擋廣告 303
8.4 平面媒體設計 307
8.4.1 平面媒體設計的元素有
哪些 308
8.4.2 平面媒體設計的流程 308
案例分析——運動宣傳廣告設計分析 309
實戰案例——設計樓盤宣傳折頁 309
案例分析——宣傳折頁設計分析 318
實戰案例——設計企業宣傳畫冊 318
8.5 本章小結 326
2.3.6 與使用環境的協調性 48
案例分析—扁平化郵件圖示設計分析 49
實戰案例—設計唱片音樂圖示 49
2.4 扁平化圖示設計技巧 54
2.4.1 什麼是好的扁平化圖示 54
2.4.2 圖示的設計表現技巧 54
2.4.3 扁平化圖示的設計過程 55
案例分析—扁平化醫療圖示設計分析 55
實戰案例—設計扁平化相機圖示 56
2.5 本章小結 64
CHAPTER 3
iOS系統扁平化設計 65
3.1 了解iOS系統 66
3.1.1 什麼是iOS系統 66
3.1.2 iOS系統的發展歷史 66
3.1.3 iOS系統手機常見螢幕尺寸
標準 67
3.2 iOS系統界面的設計原則 68
3.2.1 美觀性 69
3.2.2 一致性 69
3.2.3 操作便捷 70
3.2.4 及時反饋 70
3.2.5 暗喻 71
3.2.6 用戶控制 71
案例分析—iOS系統通話界面設計分析 72
實戰案例—設計iOS系統手機待機界面 72
3.3 iOS系統界面的設計規範 77
3.3.1 確保在iPhone和iPad上通用 78
3.3.2 重新考慮基於Web的設計 78
案例分析—iOS系統城市天氣界面設計
分析 79
實戰案例—設計iOS系統手機天氣界面 79
3.4 iOS界面基本圖形 83
3.4.1 矩形 83
3.4.2 圓角矩形 84
3.4.3 圓形 84
3.4.4 其他形狀 85
案例分析—iOS系統軟體主界面設計分析 85
實戰案例—設計iOS系統手機主界面 86
3.5 扁平化設計要點 91
3.5.1 精簡 91
3.5.2 大膽 91
3.5.3 細緻 91
3.5.4 精美 92
案例分析—iOS系統收音機界面設計分析 92
實戰案例—設計iOS系統音樂播放界面 93
3.6 本章小結 100
CHAPTER 4
了解Android系統 101
4.1 了解Android系統 102
4.1.1 什麼是Android系統 102
4.1.2 Android系統的發展歷史 102
4.1.3 Android系統手機常見螢幕
尺寸標準 103
4.2 Android系統的設計原則 104
4.2.1 美觀大方的界面 104
4.2.2 使用戶操作更加簡單 105
4.2.3 完善的操作流程 107
案例分析—Android系統手機主界面
設計分析 108
實戰案例—設計Android系統手機待
機界面 108
4.3 如何實現扁平化設計 113
4.3.1 簡化設計元素 113
4.3.2 注意字型的套用 114
4.3.3 注意色彩的搭配 114
4.3.4 簡化互動 115
4.3.5 使用類扁平化設計 115
案例分析—Android系統平板主界面
設計分析 116
實戰案例—設計Android系統手機主
界面 116
4.4 Android系統界面的特點 121
4.4.1 簡約大方 121
4.4.2 操作便捷 121
4.4.3 通用性強 122
4.4.4 布局合理 122
案例分析—Android系統手機天氣界面
設計分析 122
實戰案例—設計Android系統病毒查殺
界面 123
4.5 本章小結 128
CHAPTER 5
扁平化APP界面設計 129
5.1 了解APP 129
5.1.1 什麼是APP 129
5.1.2 APP軟體的類型 129
5.2 APP軟體界面布局 131
5.2.1 iOS系統APP軟體界面布局
說明 132
案例分析—朋友圈APP界面設計分析 132
實戰案例—設計天氣APP界面 133
5.2.2 Android系統APP軟體界面
布局說明 137
案例分析—網路設備APP軟體界面設計
分析 138
實戰案例—設計醫療APP軟體界面 139
5.3 常見APP軟體引導界面類型 146
5.3.1 功能介紹類 146
5.3.2 使用說明類 146
5.3.3 推廣類 146
5.3.4 問題解決類 147
案例分析—網路軟體APP引導界面設計
分析 147
實戰案例—設計APP引導界面 148
5.4 APP軟體界面的設計原則 155
5.4.1 實用性 155
5.4.2 統一的色彩與風格 155
5.4.3 合理的配色 156
5.4.4 規範的操作流程 156
5.4.5 視覺元素規範 156
案例分析—訂餐APP軟體界面設計分析 157
實戰案例—設計手機衛士APP界面 157
5.5 APP軟體界面的設計要求 165
5.5.1 APP軟體界面的特點 165
5.5.2 APP軟體界面設計流程 166
5.5.3 APP軟體界面的色彩搭配 166
5.5.4 平板電腦軟體界面的特點 167
案例分析—平板電腦旅遊APP界面設計
分析 167
實戰案例—設計平板電腦音樂APP界面 168
5.6 APP界面設計注意事項 176
5.6.1 APP界面視覺設計 176
5.6.2 APP界面設計的用戶體驗 177
案例分析—平板電腦訂餐APP界面設計
分析 178
實戰案例—設計平板電腦相親APP界面 178
5.7 本章小結 188
CHAPTER 6
扁平化網頁界面設計 189
6.1 了解扁平化網頁界面設計 190
6.1.1 什麼是網頁界面設計 190
6.1.2 網頁界面設計的特點 190
6.2 網頁界面構成元素 193
6.2.1 文字 193
6.2.2 圖像 193
6.2.3 多媒體 193
6.2.4 色彩 194
案例分析—餐飲類網站界面設計分析 194
實戰案例—設計汽車宣傳網頁界面 195
6.3 扁平化網頁設計元素 201
6.3.1 圖示 201
6.3.2 圓角 201
6.3.3 折角 202
6.3.4 標籤 202
6.3.5 徽章 202
6.3.6 條紋 203
6.3.7 裝飾元素 203
6.3.8 裝飾背景 203
案例分析—產品宣傳網站界面設計分析 204
實戰案例——設計企業網站界面 204
6.4 扁平化設計配色 213
6.4.1 常見的扁平化配色風格 213
6.4.2 常見扁平化設計顏色 215
案例分析—女性時尚網站界面設計分析 215
實戰案例—設計環保網站界面 216
6.5 扁平化網站界面布局 223
6.5.1 偏扁平化網站界面布局
結構標準 223
6.5.2 扁平化網站界面布局的
兩個要點 224
6.5.3 為用戶考慮原則 224
案例分析—產品專題頁設計分析 225
實戰案例—設計手機宣傳網站界面 225
6.6 本章小結 232
CHAPTER 7
扁平化軟體界面設計 233
7.1 了解軟體界面設計 234
7.1.1 什麼是軟體界面設計 234
7.1.2 網站界面設計與軟體界面
設計的區別 234
7.2 軟體界面的設計法則 235
7.2.1 以軟體功能操作為基礎 235
7.2.2 具有清晰的層次結構 235
7.2.3 一致性和標準化 238
7.2.4 良好的視覺反饋 239
案例分析—檔案分享和管理軟體界面
設計分析 240
實戰案例—設計網路雲盤軟體界面 241
7.3 軟體界面的發展 246
7.3.1 傳統軟體界面 246
7.3.2 扁平化軟體界面趨勢 247
案例分析—圖像處理軟體界面設計分析 247
實戰案例—設計視頻轉換軟體界面 247
7.4 扁平化軟體界面介紹 257
7.4.1 軟體界面分類 257
7.4.2 軟體界面設計要點 257
7.4.3 軟體界面的螢幕顯示 258
7.4.4 軟體界面的設計原則 259
案例分析—企業管理軟體界面設計分析 259
實戰案例—設計手機管理軟體界面 260
7.5 軟體界面中的色彩搭配 269
7.5.1 保持色調的一致 269
7.5.2 使用柔和的色彩 269
7.5.3 使用色彩作為功能分界的識別元素 270
7.5.4 提供可選配色方案 270
7.5.5 色彩搭配需要具有辨識度 270
7.5.6 控制色彩的使用數量 271
案例分析—視頻軟體界面設計分析 271
實戰案例—設計音樂播放器軟體界面 272
7.6 本章小結 282
CHAPTER 8
扁平化在平面設計中的套用 283
8.1 了解平面媒體設計 284
8.1.1 什麼是平面媒體設計 284
8.1.2 扁平化平面媒體設計 284
案例分析—兒童活動宣傳廣告設計分析 285
實戰案例—設計活動宣傳廣告 285
8.2 扁平化設計中的字型 291
8.2.1 字型套用的重要性 291
8.2.2 扁平化設計中常用英文字型 292
8.2.3 扁平化設計中常用中文字型 294
案例分析—電影院活動海報設計分析 295
實戰案例—設計通信宣傳DM單頁 296
8.3 扁平化平面媒體設計要求 301
8.3.1 主題鮮明突出 302
8.3.2 形式與內容統一 302
8.3.3 強化整體布局 302
案例分析—企業文化宣傳展板設計分析 303
實戰案例—設計房地產圍擋廣告 303
8.4 平面媒體設計 307
8.4.1 平面媒體設計的元素有
哪些 308
8.4.2 平面媒體設計的流程 308
案例分析——運動宣傳廣告設計分析 309
實戰案例——設計樓盤宣傳折頁 309
案例分析——宣傳折頁設計分析 318
實戰案例——設計企業宣傳畫冊 318
8.5 本章小結 326