123,123

內(nèi)容簡(jiǎn)介

　　本書(shū)緊扣用戶界（UI）面設(shè)計(jì)趨勢(shì)，主要講解了什么是UI設(shè)計(jì)，UI設(shè)計(jì)的原則與理念，圖標(biāo)設(shè)計(jì)方法、移動(dòng)端界面UI設(shè)計(jì)布局和iOS規(guī)范五大方面的內(nèi)容。本書(shū)結(jié)構(gòu)清晰、內(nèi)容翔實(shí)，為廣大讀者詳細(xì)解讀了UI的設(shè)計(jì)理念與方法，是一本UI設(shè)計(jì)的入門(mén)級(jí)教材。本書(shū)能夠提高圖標(biāo)設(shè)計(jì)人員、UI設(shè)計(jì)師、平面設(shè)計(jì)師、用戶體驗(yàn)設(shè)計(jì)師等的設(shè)計(jì)技能，可以幫助他們打開(kāi)創(chuàng)意靈感之門(mén)。本書(shū)也適合想要從事UI設(shè)計(jì)相關(guān)工作的讀者學(xué)習(xí)使用；也可作為高校和培訓(xùn)機(jī)構(gòu)視覺(jué)傳達(dá)和多媒體設(shè)計(jì)等相關(guān)專業(yè)的教材和參考書(shū)。

作者簡(jiǎn)介

　　孫劍，男，慧科教育集團(tuán)產(chǎn)業(yè)學(xué)院教學(xué)研發(fā)總監(jiān)，Adobe、Autodesk、CEAC認(rèn)證講師，清華美院特聘教師。

圖書(shū)目錄

目錄
第1章走進(jìn)UI世界．．．．．．．．．．．．．．．．．．1
1．1 認(rèn)識(shí)移動(dòng)UI 設(shè)計(jì) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．2
1．1．1　認(rèn)識(shí)UI、GUI、HUI、WUI概念．．．． 2
1．1．2　UE與UED ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 4
1．1．3　UCD ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 4
1．2 UI 相關(guān)概念．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．5
1．2．1　智能手機(jī)屏幕單位．．．．．．．．．．．．．．．．．．．．．．． 5
1．2．2　色彩模式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 6
1．2．3　網(wǎng)點(diǎn)密度與像素密度．．．．．．．．．．．．．．．．．．．． 7
1．2．4　邏輯分辨率與像素倍率．．．．．．．．．．．．．．．． 7
1．2．5　視網(wǎng)膜屏幕．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 8
1．3 常見(jiàn)智能手機(jī)系統(tǒng) ．．．．．．．．．．．．．．．．．．．．．．．．．．．8
1．3．1　Android系統(tǒng) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 8
1．3．2　iOS系統(tǒng) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 13
1．3．3　Windows Phone系統(tǒng)．．．．．．．．．．．．．．．．． 16
1．4 文件存儲(chǔ)格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．18
1．4．1　GIF格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 18
1．4．2　JPEG格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 18
1．4．3　PNG格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 18
1．4．4　SVG格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 18
1．5 如何進(jìn)行手機(jī)UI設(shè)計(jì) ．．．．．．．．．．．．．．．．．．．．18
1．5．1　UI設(shè)計(jì)的流程．．．．．．．．．．．．．．．．．．．．．．．．．．．． 18
1．5．2　UI設(shè)計(jì)原則．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 22
思考與練習(xí) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 26
第2章主題圖標(biāo)設(shè)計(jì)．．．．．．．．．．．．．．．．．．27
2．1 圖標(biāo) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．28
2．1．1　圖標(biāo)概念．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 28
2．1．2　圖標(biāo)分類．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 28
2．2 主題圖標(biāo) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．30
2．2．1　主題圖標(biāo)概念．．．．．．．．．．．．．．．．．．．．．．．．．．．． 30
2．2．2　常用主題圖標(biāo)名稱．．．．．．．．．．．．．．．．．．．．． 31
2．3 圖標(biāo)設(shè)計(jì)規(guī)范及技巧．．．．．．．．．．．．．．．．．．．．．．32
2．3．1　圖標(biāo)設(shè)計(jì)規(guī)范．．．．．．．．．．．．．．．．．．．．．．．．．．．． 32
2．3．2　圖標(biāo)設(shè)計(jì)流程．．．．．．．．．．．．．．．．．．．．．．．．．．．． 36
2．3．3　圖標(biāo)設(shè)計(jì)方法．．．．．．．．．．．．．．．．．．．．．．．．．．．． 37
思考與練習(xí) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 40
第3章 Illustrator 圖標(biāo)設(shè)計(jì)．．．．．．．．．．．．．．．．．．27
3．1 Illustrator 概述．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．42
3．1．1　Illustrator 發(fā)展歷程．．．．．．．．．．．．．．．．．．．．． 42
3．1．2　Illustrator 應(yīng)用領(lǐng)域．．．．．．．．．．．．．．．．．．．．． 42
3．2 Illustrator 基礎(chǔ)操作．．．．．．．．．．．．．．．．．．．．．．．45
3．2．1　工作區(qū)概覽．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 45
3．2．2　新建Illustrator 文檔．．．．．．．．．．．．．．．．．．．． 47
3．2．3　保存Illustrator 文檔．．．．．．．．．．．．．．．．．．．． 48
3．2．4　保存文件類型．．．．．．．．．．．．．．．．．．．．．．．．．．．． 49
3．2．5　導(dǎo)出文件類型．．．．．．．．．．．．．．．．．．．．．．．．．．．． 49
3．2．6　輔助工具的使用．．．．．．．．．．．．．．．．．．．．．．．．． 50
3．2．7　選擇對(duì)象．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 52
3．2．8　對(duì)象編組．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 54
3．2．9　對(duì)象對(duì)齊和分布．．．．．．．．．．．．．．．．．．．．．．．．． 54
3．2．10　繪圖與變形工具．．．．．．．．．．．．．．．．．．．．．．． 55
3．3 組合對(duì)象．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．75
3．3．1　復(fù)合形狀．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 75
3．3．2　其他復(fù)合形狀．．．．．．．．．．．．．．．．．．．．．．．．．．．． 77
3．3．3　釋放與擴(kuò)展復(fù)合形狀．．．．．．．．．．．．．．．．．． 78
3．3．4　路徑查找器選項(xiàng) ．．．．．．．．．．．．．．．．．．．．．．．．． 80
3．4 擴(kuò)展、擴(kuò)展外觀、輪廓化描邊、文字輪廓．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．81
3．4．1　擴(kuò)展．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 81
3．4．2　擴(kuò)展外觀．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 81
3．4．3　輪廓化描邊．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 82
3．4．4　文字輪廓．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 82
3．5 圖標(biāo)設(shè)計(jì)技法．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．82
3．5．1　繪制“image”圖標(biāo) ．．．．．．．．．．．．．．．．．．． 82
3．5．2　繪制“setting”圖標(biāo) ．．．．．．．．．．．．．．．．．． 85
3．5．3　繪制“game”圖標(biāo) ．．．．．．．．．．．．．．．．．．．． 89
3．5．4　繪制“BrandColors”的Logo ．．．． 92
3．5．5　繪制“中國(guó)聯(lián)通”的Logo ．．．．．．．．． 94
3．5．6　繪制MBE 風(fēng)格“Video”圖標(biāo) ．．． 97
3．5．7　繪制可愛(ài)漸變“user”圖標(biāo) ．．．．． 100
3．5．8　繪制折疊效果“user”圖標(biāo) ．．．．． 103
3．5．9　拼湊效果“home”圖標(biāo) ．．．．．．．．．． 105
3．5．10　彩色“切片球”制作．．．．．．．．．．．．．． 110
思考與練習(xí) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 113
第4章 Photoshop圖標(biāo)設(shè)計(jì)實(shí)戰(zhàn)．．．．．．．．．．．．．．．．．．114
4．1 Photoshop概述．．．．．．．．．．．．．．．．．．．．．．．．．．115
4．2 Photoshop基本操作．．．．．．．．．．．．．．．．．．．115
4．2．1　工作區(qū)概覽．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 115
4．2．2　了解Photoshop中的工具．．．．．．．． 116
4．2．3　新建Photoshop文檔．．．．．．．．．．．．．．． 117
4．2．4　保存Photoshop文檔．．．．．．．．．．．．．．． 119
4．2．5　保存文件類型．．．．．．．．．．．．．．．．．．．．．．．．．． 120
4．3 Photoshop矢量工具．．．．．．．．．．．．．．．．．．．121
4．3．1　鋼筆工具．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 121
4．3．2　路徑選擇工具/ 直接選擇工具．． 122
4．3．3　形狀圖形工具．．．．．．．．．．．．．．．．．．．．．．．．．． 122
4．3．4　設(shè)置顏色方法．．．．．．．．．．．．．．．．．．．．．．．．．． 123
4．3．5　布爾運(yùn)算．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 124
4．3．6　對(duì)齊、排列關(guān)系．．．．．．．．．．．．．．．．．．．．．．． 126
4．4 圖層樣式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．128
4．4．1　添加圖層樣式．．．．．．．．．．．．．．．．．．．．．．．．．． 129
4．4．2　“圖層樣式”面板．．．．．．．．．．．．．．．．．．． 129
4．5 Photoshop圖標(biāo)設(shè)計(jì)實(shí)戰(zhàn) ．．．．．．．．．．．．134
4．5．1　圖標(biāo)的扁平化設(shè)計(jì) ．．．．．．．．．．．．．．．．．．． 134
4．5．2　線形圖標(biāo) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 136
4．5．3　剪影圖標(biāo) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 139
4．5．4　扁平彩色圖標(biāo) ．．．．．．．．．．．．．．．．．．．．．．．．．． 144
4．5．5　擬物圖標(biāo)的設(shè)計(jì)方法．．．．．．．．．．．．．．．． 148
思考與練習(xí) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 152
第5章 iOS規(guī)范及工具APP視覺(jué)設(shè)計(jì)．．．．．．．．．．．．．．．．．．153
5．1 App類型及特點(diǎn) ．．．．．．．．．．．．．．．．．．．．．．．．．．．154
5．1．1　App類型．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 154
5．1．2　手機(jī)App設(shè)計(jì)原則．．．．．．．．．．．．．．．．．． 156
5．2 iOS控件介紹及設(shè)計(jì)規(guī)范．．．．．．．．．．．．．164
5．2．1　iOS控件擺放規(guī)范．．．．．．．．．．．．．．．．．．．． 164
5．2．2　iOS控件的構(gòu)成與尺寸．．．．．．．．．．．．． 165
5．3 常見(jiàn)布界面布局．．．．．．．．．．．．．．．．．．．．．．．．．．．173
5．4 App界面設(shè)計(jì)實(shí)戰(zhàn) ．．．．．．．．．．．．．．．．．．．．．．．176
5．4．1　音樂(lè)App界面實(shí)戰(zhàn) ．．．．．．．．．．．．．．．．．． 176
5．4．2　社交App界面實(shí)戰(zhàn) ．．．．．．．．．．．．．．．．．． 181
5．4．3　個(gè)人中心界面實(shí)戰(zhàn) ．．．．．．．．．．．．．．．．．．． 183
思考與練習(xí) ．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． 185