第1章 初识移动UI设计 1
1.1移动App产品开发的基本流程 2
1.2移动UI设计的三大操作系统 4
1.2.1 Android系统 5
1.2.2 iOS系统 6
1.2.3 Windows Phone系统 6
1.3移动UI设计常用的软件 7
1.3.1 Photoshop 8
1.3.2 Illustrator 8
1.3.3 Axure RP 9
1.4移动UI设计中常用的图片存储格式 10
1.4.1 JPEG(.jpg) 10
1.4.2 GIF(.gif) 10
1.4.3 PNG(.png) 10
1.4.4点九PN(.9.png) 10
1.5与设计尺寸相关的术语 11
1.5.1屏幕尺寸 11
1.5.2分辨率 11
1.5.3屏幕像素密度 12
1.6制作Apple Watch App闹钟图标 13
1.6.1图标概述 13
1.6.2图标的分类 15
1.6.3图标的设计方法 19
1.6.4演示案例——制作Apple Watch App闹钟图标 20
本章总结 21
本章作业 21
第2章 移动UI图标设计规范 23
2.1移动UI图标设计原则 24
2.1.1可识别性 24
2.1.2一致性 25
2.1.3兼容性 27
2.2制作iOS系统口袋商城启动图标 28
2.2.1 iOS系统图标概述 29
2.2.2 iOS系统图标设计规范 29
2.2.3演示案例——制作iOS系统口袋商城启动图标 31
2.3制作Android系统电影启动图标 33
2.3.1 Android系统图标概述 33
2.3.2 Android系统图标设计规范 34
2.3.3演示案例——制作Android系统电影启动图标 37
2.4制作双系统下商场启动图标 39
2.4.1双系统下的启动图标 39
2.4.2双系统下启动图标的差异 40
2.4.3演示案例——制作双系统下商场启动图标 41
本章总结 43
本章作业 43
第3章扁平化风格图标设计 45
3.1制作扁平化风格相机图标 46
3.1.1扁平化风格概述 46
3.1.2扁平化风格的设计原则 49
3.1.3演示案例——制作扁平化风格相机图标 52
3.2制作折纸风格“设置”图标 54
3.2.1折纸风格图标概述 55
3.2.2折纸风格图标的艺术特征 55
3.2.3演示案例——制作折纸风格“设置”图标 57
3.3制作长阴影风格Safari图标 58
3.3.1长阴影风格图标的特点 59
3.3.2演示案例——制作长阴影风格Safari图标 60
本章总结 61
本章作业 61
第4章 拟物化风格图标设计 63
4.1制作拟物化风格日历启动图标 64
4.1.1拟物化风格的概念 65
4.1.2拟物化风格的特点 67
4.1.3演示案例——制作拟物化风格日历启动图标 69
4.2制作拟物化风格抽屉邮件启动图标 70
4.2.1拟物化风格图标的设计流程 71
4.2.2拟物化风格图标的设计原则 75
4.2.3演示案例——制作拟物化风格抽屉邮件启动图标 78
4.3制作拟物化风格相机图标 81
4.3.1拟物化风格图标的造型设计手法 82
4.3.2拟物化风格图标的质感表现手法 83
4.3.3演示案例——制作拟物化风格相机图标 85
本章总结 87
本章作业 88
第5章 Android系统UI设计规范 89
5.1制作Android系统手机界面模板 90
5.1.1 Android系统手机界面设计概述 90
5.1.2 Android系统手机的设计尺寸与常见术语 92
5.1.3 Android系统中的栏 93
5.1.4 Android系统中的按钮与可点击区域 95
5.1.5建立适合Android系统的网格系统 96
5.1.6 Android系统中的字体与字号 97
5.1.7演示案例——制作Android系统手机界面模板 98
5.2制作Android系统手机UI套件 99
5.2.1 Android系统的手机控件 99
5.2.2演示案例——制作Android系统手机UI套件 105
5.3制作Android系统邮箱界面 106
5.3.1 Android系统界面中的列表和网格 107
5.3.2演示案例——制作Android系统邮箱界面 109
本章总结 111
本章作业 111
第6章 iOS系统UI设计规范 113
6.1制作iOS系统手机界面模板 114
6.1.1 iOS系统手机设计概述 115
6.1.2 iOS系统手机的设计尺寸与常见术语 115
6.1.3 iOS系统中的栏 117
6.1.4 iOS系统的按钮与可点击区域 120
6.1.5 iOS系统中的字体与字号 121
6.1.6演示案例——制作iOS系统手机界面模板 121
6.2制作iOS系统手机UI套件 122
6.2.1 iOS系统的手机控件 123
6.2.2演示案例——制作iOS系统手机UI套件 131
6.3制作iOS系统控制中心界面 132
6.3.1 iOS系统界面的布局 133
6.3.2演示案例——制作iOS系统控制中心界面 135
本章总结 137
本章作业 137
第7章 “生活帮帮帮”App项目的设计与制作 139
7.1 Android系统应用程序项目案例——“生活帮帮帮”项目 140
7.1.1项目背景 140
7.1.2设计要求及主要功能 141
7.2 App类型及界面设计技巧 143
7.2.1 App的类型 143
7.2.2 App的界面设计技巧 146
7.2.3项目实现流程 148
7.3“生活帮帮帮”界面设计实现思路 148
7.3.1内容优先和布局合理 148
7.3.2界面的绘制和构建 149
7.3.3功能架构 149
7.3.4色彩运用 151
7.3.5技术要点 151
7.3.6设计前的注意事项 151
本章总结 152
本章作业 152