第1 章初識UI 基礎   1
1.1認識UI   2
1.2UI 的分類   3
1.3UI 的色彩基礎   4
1.3.1顏色的概念   4
1.3.2色彩三要素   4
1.3.3色彩的混合   6
1.3.4色彩的分類   8
1.4不同色彩給人的心理影響   8
1.5常用UI 設計單位解析   9
1.6UI 設計常用的軟件   9
1.7UI 設計常用圖像格式   11
1.8UI 的設計原則   12
1.9優秀作品欣賞   13
第2 章使用基本形狀繪制素   14
2.1了解Photoshop 中的基本形狀   15
2.1.1通過選區創建幾何圖形   15
2.1.2繪制工具   15
2.1.3形狀工具的不同模式   16
2.2使用矩形選區制作下單按鈕   17
2.3使用橢圓選區制作圓形按鈕   19
2.4使用矩形工具制作簡潔風格導航欄   23
2.5使用圓角矩形工具和矩形工具制作提示窗口   25
2.6 使用圓角矩形工具和橢圓工具制作拖動條   30
2.7使用多邊形工具和橢圓工具制作播放按鈕   32
2.8使用自定形狀工具和橢圓工具制作供電按鈕   37
2.9使用橢圓工具結合圖層樣式制作金屬旋鈕   43
2.10使用路徑與自定形狀工具制作網頁廣告條   51
2.11優秀作品欣賞   54
第3 章扁平化設計風格   55
3.1了解扁平化設計   56
3.1.1扁平化設計是什麼   56
3.1.2扁平化風格的優缺點   56
3.1.3扁平化風格的設計原則   57
3.2扁平相機圖標制作   59
3.3扁平視頻播放圖標制作   62
3.4扁平收音機圖標制作   65
3.5扁平化郵箱界面制作   69
3.6扁平音樂播放器界面制作   73
3.7時間APP 界面制作   76
3.8天氣預報控件制作   79
3.9車載扁平UI 制作   83
3.10扁平卡通生肖圖標制作   87
3.11優秀作品欣賞   91
第4 章寫實風格圖標設計與制作   92
4.1了解寫實風格設計   93
4.1.1寫實的藝術表現   93
4.1.2寫實風格的優缺點   94
4.1.3寫實風格的設計原則   94
4.2寫實麥克風圖標制作   96
4.3寫實鋼琴圖標制作   104
4.4寫實電視圖標制作   111
4.5寫實滾動開關圖標制作   118
4.6寫實日歷圖標制作   125
4.7寫實西瓜圖標制作   129
4.8優秀作品欣賞   134
第5 章UI 素   135
5.1了解UI 設計中的控件   136
5.1.1UI 控件是什麼   136
5.1.2UI 設計中的控件   136
5.1.3UI 控件的設計原則   137
5.2重要人物電話簿控件制作   138
5.3功能性圖標控件制作   146
5.4天氣控件制作   152
5.5時間控件制作   158
5.6質感開關控件制作   165
5.7視頻播放控件制作   173
5.8音量旋鈕控件制作   175
5.9優秀作品欣賞   180
第6 章UI 導航設計與制作   181
6.1了解UI 設計中的導航   182
6.1.1導航是什麼   182
6.1.2導航的分類   182
6.1.3移動端導航設計的幾種形式   182
6.1.4網頁端導航設計的幾種形式   185
6.2水晶質感網頁導航制作   188
6.3底部導航制作   193
6.4頂部導航制作   198
6.5抽屜式導航制作   200
6.6帶搜索導航制作   204
6.7APP 頂部導航制作   208
6.8APP 網格式導航制作   211
6.9優秀作品欣賞   213
第7 章登錄框設計與制作   215
7.1了解UI 設計中的登錄框   216
7.1.1登錄框是什麼   216
7.1.2UI 中登錄框的分類   216
7.1.3登錄框的幾種形式   216
7.2傳統登錄框制作   216
7.3企業登錄框制作   221
7.4漂浮感登錄框制作   225
7.5透明登錄框制作   230
7.6純淨扁平登錄框制作   236
7.7橫幅登錄框制作   238
7.8皮質登錄框制作   243
7.9優秀作品欣賞   251
第8 章UI 設計與制作   252
8.1了解UI 設計中的界面   253
8.1.1UI 設計中的界面是什麼   253
8.1.2常見的界面   253
8.1.3屏幕尺寸   253
8.1.4設計界面時需要注意素尺寸   255
8.1.5什麼是好的界面設計   256
8.2手機開機界面制作   256
8.3鞋子銷售界面制作   259
8.4扁平下載界面制作   266
8.5手機界面制作   268
8.6汽車服務APP 界面制作   272
8.7天氣預報界面制作   274
8.8照片處理類APP 界面制作   277
8.9優秀作品欣賞   280

隨著手機等移動設備的飛速發展，以設備作為依托的APP，也得到了迅速的發展與壯大。目前，以各種APP 作為工作對像的UI 設計師也成了人纔市場上炙手可熱的職業。
本書內容
這是一本專門介紹使用Photoshop 設計與制作A素的圖書。全書共分8 章，第1 章為初識UI 基礎，幫助讀者了解UI 設計的相關知識，在進入專業的UI 設計領域之前需要掌握相關的基礎知識；第2 章為使用基本形狀繪制素，主要應用素基本形狀部分的矩形、圓形、多邊形和自定義形狀等，通過Photoshop 軟件對各種基本部分的UI 組件、按鈕和圖標進行實戰式的講解；第3 ～ 4 章介紹APP 中扁平化風格的圖標及界面和寫實風格的圖標的設計與制作，通過理論知識與案例的結合，逐一講解這些APP 中素設計；第5 章講解UI 素，主要講解UI 設計中的界素和素的設計與制作，這些素可以是按鈕、導航、拖動條、滑塊、旋鈕等；第6 章講解UI 導航設計與制作，從網頁導航、手機APP 導航等方面進行詳細的案例式講解，讓讀者能夠以快的方式掌握UI 導航的設計；第7 章為登錄框設計與制作，從網頁登錄框、移動端登錄框進行詳細的案例式講解，讓讀者能夠以快的方式掌握UI登錄框的設計。以上各章內容的安排，可使讀者由淺入深、逐步地了解使用Photoshop 設計與制作A素的設計思路和制作過程。第8 章為UI 設計與制作，介紹APP 完整界面的設計方法，不同類型的APP，其界面設計基礎和風格均有不同。第8 章還對界面設計的多個案例進行了講解，通過完整界面的制作案例來綜合前面各章內容，幫助讀者鞏固所學知識，並使其能將理論應用到實際工作中。
本書特色
1. 理論結合實際，專業知識全面
本書將APP 素設計的相關理論與實例操作相結合，不僅能使讀者學到專業知識，也能使讀者實際應用，全面掌握APP U素設計。
2. 案例全面豐富，實際操作靈活應用
書中案例涉及APP中素設計，如圖標設計、素設計、導航設計、登錄框設計等，第8 章還介紹了完整的APP 界面設計，將前面所學知識應用到實際中。
3. 視頻教學，學習輕松快速
本書配備資源包括書中所有案例的素材、源文件及視頻教學。讀者可以通過案例與素材結合視頻教學，像看電影一樣輕松掌握每個案例的制作過程，從而更加輕松地進入學習之中。
本書創作團隊
本書由王紅蕾、王建紅、時延輝編著。其中，北京市商業學校的王紅蕾老師負責編寫第1 章和第2 章，共計100 千字；牡丹江技師學院的王建紅老師負責編寫第3 章和第4 章，共計100 千字；北京市商業學校的時延輝老師負責編寫第5 章和第6 章，共計100 千字。其他參加編寫工作的成員還有陸沁、王秋燕、吳國新、劉鼕美、劉紹婕、尚肜、張叔陽、劉愛華、葛久平、殷曉鋒、谷鵬、胡渤、趙頔、張猛、齊新、王海鵬、張傑、周滎、周莉、金雨、陸鑫、劉智梅、陳美容、付強、王君赫、潘磊、曹培強、曹培軍等。
本書提供了案例所需的素材、源文件及視頻文件，讀者可掃描下面的二維碼，將其推送到自己的郵箱下載獲取。
由於作者水平有限，書中疏漏在所難免，懇請讀者予以批評、指正。
編者