APP UI设计手册PDF电子书下载

第1章 APP UI设计的原理 1

1.1 APP UI设计的概念 2

1.2 APP UI与用户体验 2

1.3 APP UI设计的点、线、面 3

1.3.1点 3

1.3.2线 4

1.3.3面 4

1.4尺寸与规则 5

1.4.1 IO S 5

1.4.2 Android 6

1.5 APP UI设计的原则 7

1.5.1突出性原则 7

1.5.2商业性原则 7

1.5.3趣味性原则 8

1.5.4艺术性原则 8

1.6 APP UI设计的法则 9

1.6.1形式美法则 9

1.6.2平衡法则 9

1.6.3视觉法则 10

1.6.4联想法则 10

1.6.5直接展示法则 10

第2章 APP UI设计的基础知识 11

2.1 UI与色彩 12

2.1.1色相、明度、纯度 13

2.1.2主色、辅助色、点缀色 13

2.1.3令邻近色、对比色 15

2.2 APP UI设计的布局 15

2.2.1对称式 16

2.2.2曲线式 16

2.2.3倾斜式 17

2.2.4中轴式 17

2.2.5文字式 17

2.2.6图片式 18

2.2.7自由式 18

2.2.8背景式 19

2.2.9水平式 19

2.2.10引导式 19

第3章 APP UI 设计的基础色 20

3.1红 21

3.1.1认识红色 21

3.1.2洋红＆胭脂红 22

3.1.3玫瑰红＆朱红 22

3.1.4鲜红＆山茶红 23

3.1.5浅玫瑰红＆火鹤红 23

3.1.6硅红＆壳黄红 24

3.1.7浅粉红＆勃艮第酒红 24

3.1.8威尼斯红＆宝石红 25

3.1.9灰玫红＆优品紫红 25

3.2橙 26

3.2.1认识橙色 26

3.2.2橘色＆橘红 27

3.2.3柿子橙＆热带橙 27

3.2.4橙色＆阳橙 28

3.2.5橙黄＆杏黄 28

3.2.6蜂蜜色＆米色 29

3.2.7沙棕色＆琥珀色 29

3.2.8驼色＆咖啡色 30

3.2.9巧克力色＆重褐色 30

3.3黄 31

3.3.1认识黄色 31

3.3.2黄＆铬黄 32

3.3.3金＆香蕉黄 32

3.3.4鲜黄＆月光黄 33

3.3.5柠檬黄＆万寿菊黄 33

3.3.6香槟黄＆奶黄 34

3.3.7土著黄＆黄褐 34

3.3.8卡其黄＆含羞草黄 35

3.3.9芥末黄＆灰菊色 35

3.4绿 36

3.4.1认识绿色 36

3.4.2黄绿＆苹果绿 37

3.4.3墨绿＆叶绿 37

3.4.4草绿＆苔藓绿 38

3.4.5芥末绿＆橄榄绿 38

3.4.6枯叶绿＆碧绿 39

3.4.7绿松石绿＆青瓷绿 39

3.4.8孔雀石绿＆铬绿 40

3.4.9孔雀绿＆钴绿 40

3.5青 41

3.5.1认识青色 41

3.5.2青＆铁青 42

3.5.3深青＆天青色 42

3.5.4群青＆石青色 43

3.5.5青绿色＆青蓝色 43

3.5.6瓷青＆淡青色 44

3.5.7白青色＆青灰色 44

3.5.8水青色＆藏青 45

3.5.9清漾青＆浅葱色 45

3.6蓝 46

3.6.1认识蓝色 46

3.6.2蓝色＆天蓝色 47

3.6.3蔚蓝色＆普鲁士蓝 47

3.6.4矢车菊蓝＆深蓝 48

3.6.5道奇蓝＆宝石蓝 48

3.6.6午夜蓝＆皇室蓝 49

3.6.7浓蓝色＆蓝黑色 49

3.6.8爱丽丝蓝＆水晶蓝 50

3.6.9孔雀蓝＆水墨蓝 50

3.7紫 51

3.7.1认识紫色 51

3.7.2紫＆淡紫色 52

3.7.3靛青色＆紫藤 52

3.7.4木槿紫＆藕荷色 53

3.7.5丁香紫＆水晶紫 53

3.7.6矿紫＆三色堇紫 54

3.7.7锦葵紫＆淡丁香紫 54

3.7.8浅灰紫＆江户紫 55

3.7.9蝴蝶花紫＆蔷薇紫 55

3.8黑、白、灰 56

3.8.1认识黑、白、灰 56

3.8.2白＆月光白 57

3.8.3雪白＆象牙白 57

3.8.4 10％亮灰＆50％灰 58

3.8.5 80％炭灰＆黑 58

第4章 APP UI设计的元素 59

4.1标志 60

4.1.1简约素雅的标志设计 61

4.1.2趣味多彩的标志设计 62

4.1.3标志设计技巧——图文结合的设计方法 63

4.1.4标志设计欣赏 63

4.2图案 64

4.2.1风格多变的图标设计 64

4.2.2应用界面的图案设计 66

4.2.3图案设计技巧——造型独特的图案 67

4.2.4图案设计赏析 67

4.3色彩 68

4.3.1缤纷多彩的色彩设计 69

4.3.2单一色调的色彩设计 70

4.3.3色彩设计技巧——统计图的应用 71

4.3.4色彩设计欣赏 71

4.4字体 72

4.4.1应用中的字体设计 73

4.4.2图标中的字体设计 74

4.4.3字体设计技巧——文字样式的修改 75

4.4.4字体设计赏析 75

4.5导航栏 76

4.5.1顶部与底部的导航栏设计 77

4.5.2“汉堡包菜单”的导航栏设计 78

4.5.3导航栏设计技巧——适用屏幕旋转的设计 79

4.5.4导航栏设计赏析 79

4.6主视图 80

4.6.1骨骼型的主视图设计 81

4.6.2重心型的主视图设计 82

4.6.3主视图设计技巧——采用不同的设计版式 83

4.6.4主视图设计赏析 83

4.7工具栏 84

4.7.1固定工具栏设计 85

4.7.2浮动工具栏设计 86

4.7.3工具栏设计技巧——带搜索功能的工具栏 87

4.7.4工具栏设计赏析 87

4.8设计实战：社交软件用户信息界面设计 88

4.8.1设计思路 88

4.8.2配色方案 88

4.8.3版面构图 90

4.8.4色彩 90

4.8.5字体 91

4.8.6导航栏 91

第5章 APP UI设计的行业分类 92

5.1游戏类APP UI设计 93

5.1.1游戏类APP UI设计——休闲类游戏 94

5.1.2游戏类APP UI设计——动作冒险类游戏 95

5.2社交类APP UI设计 97

5.2.1社交类APP UI设计——电话短信 98

5.2.2社交类APP UI设计——聊天交友 99

5.3购物类APP UI设计 101

5.3.1购物类APP UI设计——服装类 102

5.3.2购物类APP UI设计——产品类 103

5.4工具类APP UI设计 105

5.4.1工具类APP UI设计——地图导航 106

5.4.2工具类APP UI设计——天气预报 107

5.5生活类APP UI设计 109

5.5.1生活类APP UI设计——旅游 110

5.5.2生活类APP UI设计——外卖 111

5.6娱乐类APP UI设计 113

5.6.1娱乐类APP UI设计——音乐播放器 114

5.6.2娱乐类APP UI设计——视频播放器 115

5.7阅读类APP UI设计 117

5.7.1阅读类APP UI设计——小说阅读器 118

5.7.2阅读类APP UI设计——漫画阅读器 119

5.8拍摄美化类APP UI设计 121

5.8.1拍摄美化类APP UI设计——相机 122

5.8.2拍摄美化类APP UI设计——美化图片 123

5.9新闻类APP UI设计 125

5.9.1新闻类APP UI设计——新闻资讯 126

5.9.2新闻类APP UI设计——报纸杂志 127

5.10设计实战：办公类APP UI设计流程详解 129

5.10.1设计思路 129

5.10.2配色方案 129

5.10.3版面构图 130

5.10.4 首页 131

5.10.5收件箱 132

5.10.6编写邮件 132

第6章 APP UI设计的风格 133

6.1安全 134

6.1.1安全——登录页面的UI设计 135

6.1.2安全——页面提示弹窗的UI设计 136

6.2清新 138

6.2.1清新——明亮色彩的UI界面设计 139

6.2.2清新——形象可爱的UI设计 140

6.3科技 142

6.3.1科技——指纹识别UI界面设计 143

6.3.2科技——天气预报UI界面设计 144

6.4凉爽 146

6.4.1凉爽——颜色 147

6.4.2凉爽——干净简洁的UI界面设计 148

6.5美味 150

6.5.1美味——烹饪类应用的UI界面设计 151

6.5.2美味——订餐类应用的UI界面设计 152

6.6热情 154

6.6.1热情——色彩明快的UI界面设计 155

6.6.2热情——活力四射的运动类UI界面设计 156

6.7高端 158

6.7.1高端——奢侈品应用的UI设计 159

6.7.2高端——个人定制的UI设计 160

6.8浪漫 162

6.8.1浪漫——粉色系桌面的UI界面设计 163

6.8.2浪漫——应用花朵元素的UI界面设计 164

6.9硬朗 166

6.9.1硬朗——游戏页面中坚硬感UI设计 167

6.9.2硬朗——稳定沉稳的UI设计 168

6.10纯净 170

6.10.1纯净——简约纯洁的UI界面设计 171

6.10.2纯净——线条感十足的UI图标设计 172

6.11复古 174

6.11.1复古——像素游戏的UI界面设计 175

6.11.2复古——使用传统物品进行UI图标设计 176

6.12扁平化与拟物化 178

6.12.1扁平化风格 179

6.12.2拟物化风格 180

6.13设计实战：手机游戏启动界面设计 182

6.13.1设计思路 182

6.13.2配色方案 182

6.13.3版面构图 184

6.13.4凉爽 184

6.13.5 硬朗 185

6.13.6清新 185

第7章 APP UI设计秘籍 186

7.1 UI设计中的版式布局 187

7.2通过实例来了解UI界面 188

7.3颜色的合理搭配 189

7.4图标的物理尺寸与实际尺寸 190

7.5常用的集中设计尺寸 191

7.6 MBE风格的设计 192

7.7开放式路径图标的妙用 193

7.8列表的设计方式 194

7.9字体的使用 195

7.10页面空间的节省 196

7.11贴近场景的显示切换 197

7.12欢迎页面的设计 198

7.13交互方式的设计 199

7.14视觉风格的设计 200