移動端UI設(shè)計

第1章 初識移動端界面設(shè)計 1
1．1 移動端界面設(shè)計的特點(diǎn) 1
1．1．1 手機(jī)移動端界面設(shè)計的原則 3
1．1．2 PDA及車載移動設(shè)備界面的設(shè)計特點(diǎn) 4
1．1．3 移動端界面設(shè)計應(yīng)注意的問題 5
1．2 三大主流平臺與設(shè)計規(guī)范 6
1．2．1 iOS平臺與設(shè)計的基本規(guī)范 6
1．2．2 Android平臺與設(shè)計的基本規(guī)范 7
1．2．3 Windows平臺與設(shè)計的基本規(guī)范 10
1．2．4 常用移動端界面優(yōu)秀案例 13
思考與練習(xí) 13
第2章 色彩在移動的界面中的應(yīng)用 14
2．1 色彩的基本知識 15
2．2 色彩的組成 16
2．3 色彩對比 18
2．3．1 色相對比 18
2．3．2 明度對比 19
2．3．3 純度對比 20
2．3．4 補(bǔ)色對比 20
2．3．5 冷暖對比 21
2．3．6 面積對比 21
2．4 色彩的調(diào)和 22
2．4．1 同類色的調(diào)和 22
2．4．2 近似色的調(diào)和 23
2．4．3 對比色的調(diào)和 24
2．4．4 漸變色的調(diào)和 24
2．5 色調(diào)的變化 25
2．6 移動端界面色彩搭配的原則 28
2．6．1 UI三色搭配原則 29
2．6．2 色彩搭配應(yīng)注意的問題 31
2．7 界面設(shè)計的配色技巧 33
思考與練習(xí) 37
第3章 移動端界面版式設(shè)計的原則 38
3．1 紙上布局法 38
3．2 軟件布局法 39
3．3 確定整體風(fēng)格 40
3．4 移動端界面常用的布局形式 49
3．5 界面構(gòu)圖的方法 54
思考與練習(xí) 56
第4章 移動端界面設(shè)計的基礎(chǔ) 57
4．1 基礎(chǔ)圖形的繪制 57
4．1．1 認(rèn)識圖標(biāo) 57
4．1．2 基礎(chǔ)圖形在移動端界面的應(yīng)用 59
4．2 常見控件的設(shè)計 63
4．2．1 繪制立體開關(guān)控件 64
4．2．2 圖標(biāo)的設(shè)計 69
4．3 導(dǎo)航的設(shè)計模式 73
思考與練習(xí) 76
第5章 不同的界面風(fēng)格 77
5．1 扁平化風(fēng)格界面的設(shè)計制作 77
5．1．1 正確認(rèn)識扁平化風(fēng)格 77
5．1．2 移動端扁平化風(fēng)格界面的制作 78
5．2 寫實(shí)化風(fēng)格界面的設(shè)計制作 86
5．3 卡通繪畫風(fēng)格界面的設(shè)計制作 98
思考與練習(xí) 103
第6章 綜合案例 104
6．1 輸入法皮膚的設(shè)計制作 104
6．1．1 輸入法皮膚設(shè)計的原則 104
6．1．2 輸入法設(shè)計案例解析 106
6．2 移動手機(jī)端應(yīng)用界面的設(shè)計制作 109
6．2．1 移動手機(jī)端界面設(shè)計的基本原則 109
6．2．2 iPhone端App界面設(shè)計解析 110
6．3 移動端平板游戲界面的設(shè)計制作 119
6．3．1 平板界面的設(shè)計規(guī)范 119
6．3．2 iPad端的游戲界面設(shè)計解析 122
6．3．3 音樂播放器App 128
綜合練習(xí) 140