本书内容包括：移动APP设计基础、移动APP图标设计、Android系统图标常用尺寸、移动APP界面基本元素设计等。

　　随着移动互联网的迅速发展和智能手机的普及，移动APP应用也随之高速发展，直接拉动了市场对移动交互设计人才的需求。
　　未来，市场上会有更多的APP应用，这些APP应用都需要设计师来设计，包括图标设计、界面设计、体验设计等。市场需要的APP应用越多，对交互界面设计的需求自然也会越多，需要的相关设计人员也就越多。本书希望能够帮助广大初学者掌握移动APP界面设计的方法和技巧，能够真正理解APP界面设计，从而进入APP界面设计行业，这也是作者编写本书的目的。
　　内容安排本书使用Photoshop作为工具，采用理论知识与实用案例相结合的方式，全面讲解了移动APP界面设计各个方面的知识，让读者在学习的过程中丰富自己的设计创意并提高动手制作能力。全书共7章，每章的内容安排如下。
　　第1章　移动APP设计基础。本章主要向读者介绍了UI设计与移动APP设计相关的理论基础，包括什么是UI设计、什么是APP设计、移动APP设计的流程和移动设备的尺寸标准等相关内容，使读者对移动APP设计有更深入的认识。
　　第2章　移动APP图标设计。向读者介绍了有关APP图标设计的相关知识，包括拟物化图标与扁平化图标，iOS系统和Android系统图标的常用尺寸等，并结合案例的制作讲解，使读者掌握APP图标的设计方法。
　　第3章　移动APP界面基本元素设计。移动APP界面都是由各种基本图形元素与组件构成的，本章详细介绍了APP界面中各种基本组件和图形的绘制和表现方法。
　　第4章　iOS系统界面设计。本章详细介绍了iOS系统的相关知识及iOS系统的UI设计规范，从而使读者能够设计出符合iOS系统要求的APP界面。本章还通过多个iOS系统APP界面的制作讲解，使读者掌握iOS系统APP界面的设计方法。
　　第5章　Android系统界面设计。本章详细介绍了Android系统的相关知识及Android系统的UI设计规范、Android与iOS系统界面设计的区别等内容，使读者能够清楚Android与iOS系统界面的异同。本章通过多个Android系统APP界面的制作讲解，使读者掌握Android系统APP界面的设计方法。
　　第6章　Windows Phone系统界面设计。本章详细介绍了Windows Phone系统的相关知识及Windows Phone系统的UI设计规范，并且还介绍了Windwos Phone系统中特有的Tile（磁贴）、Pivot（枢轴视图）和Panorama（全景视图），使读者对Windows Phone系统有全面的认识。
　　第7章　APP界面设计。本章介绍了有关APP界面设计的原则、要求和技巧等内容，并通过多个不同风格的APP界面的设计制作讲解，使读者能够轻松掌握APP界面的设计。
　　本书特点全书内容丰富、条理清晰，为读者全面、系统地介绍了移动APP界面设计知识，以及使用Photoshop进行移动APP界面设计的方法和技巧，采用理论知识和案例相结合的方法，使知识融会贯通。
　　? 语言通俗易懂，精美案例图文同步，涉及大量移动APP界面设计的丰富知识讲解，帮助读者深入了解APP界面设计。
　　? 实例涉及面广，几乎涵盖了移动APP设计中所在的各个领域，每个领域下通过大量的设计讲解和案例制作帮助读者掌握领域中的专业知识点。
　　? 注重设计知识点和案例制作技巧的归纳总结，知识点和案例的讲解过程中穿插了大量的软件操作技巧提示等，使读者更好地对知识点进行归纳吸收。
　　? 每一个案例的制作过程，都配有相关视频教程和素材，步骤详细，使读者轻松 掌握。
　　本书读者对象本书适合有一定Photoshop软件操作基础的UI设计初学者及设计爱好者阅读，也可以为一些UI设计人员及相关专业的学习者提供参考。本书配套的光盘中提供了本书所有案例的源文件及素材，方便读者借鉴和使用。
　　本书由高鹏编写，另外高金山、周宝平、单子娟、夏志丽、王俊萍、冯海、林学远、衣波、冯红娟、张伟、杜秋磊、高杰、郭莉、何经伟、董亮、金昊、李政、刘刚、卢斌、林秋、毛颖等也参与了本书的编写。书中难免有错误和疏漏之处，希望广大读者朋友批评、指正。
　　编者
机工授权书
收起全部↑

前言 
第1章 移动APP设计基础 1 
1.1 移动UI设计概述 2 
1.1.1　什么是UI设计 2 
1.1.2　移动UI设计的特点 3 
1.1.3　移动UI与网站UI的区别 5 
1.2 了解UI设计师 7 
1.2.1　研究界面—图形设计师（Graphic UI Designer） 7 
1.2.2　研究人与界面的关系—交互设计师（Interaction Designer） 7 
1.2.3　研究人—用户测试/研究工程师（User Experience Engineer） 7 
1.3 了解移动APP 7 
1.3.1　什么是APP 8 
1.3.2　APP视觉设计的奥秘 8 
1.3.3　APP视觉效果的个性化 10 
1.4 移动APP设计流程及视觉设计 11 
1.4.1　移动APP设计流程 11 
1.4.2　视觉设计 12 
1.5 移动APP设计中的色彩搭配 14 
1.5.1　认识色彩 14 
1.5.2　色彩在APP界面设计中的作用 15 
1.5.3　APP界面配色原则 17 
1.5.4　使用Kuler配色 19 
1.6 常见移动设备尺寸标准 19 
1.6.1　屏幕尺寸 19 
1.6.2　屏幕分辨率 20 
1.6.3　屏幕密度 21 
1.7 本章小结 21 
第2章 移动APP图标设计 22 
2.1 了解APP图标 23 
2.1.1　什么是图标 23 
2.1.2　图标设计的作用 24 
2.1.3　iOS系统图标常用尺寸 26 
2.1.4　Android系统图标常用尺寸 28 
2.1.5　图标常用格式 28 
2.2 拟物化图标 30 
2.2.1　什么是拟物化图标 30 
2.2.2　拟物化图标的特点 31 
实战案例——设计拟物化时钟图标 32 
2.3 扁平化图标 40 
2.3.1　什么是扁平化图标 40 
2.3.2　扁平化图标的特点 40 
2.3.3　基础风格扁平化图标 41 
实战案例——设计基础风格购物图标 42 
2.3.4　阴影风格扁平化图标 47 
实战案例——设计阴影风格设置图标 47 
2.3.5　长阴影风格扁平化图标 53 
实战案例——设计长阴影风格日期图标 54 
2.3.6　微渐变风格扁平化图标 62 
实战案例——设计微渐变风格天气图标 62 
2.4 APP图标设计原则 68 
2.4.1　辨识性 68 
2.4.2　实用性 68 
2.4.3　差异性 69 
2.4.4　创意性 69 
2.4.5　视觉性 70 
2.4.6　协调性 70 
实战案例——设计音乐APP启动图标 70 
2.5 本章小结 77 
第3章 移动APP界面基本元素设计 78 
3.1 认识APP界面基本图形 79 
3.1.1　直线 79 
3.1.2　矩形 79 
3.1.3　圆角矩形 80 
3.1.4　圆形 80 
3.1.5　其他图形 81 
实战案例——设计APP登录界面 81 
3.2 按钮设计 86 
3.2.1　按钮设计注意事项 86 
3.2.2　游戏APP界面按钮 87 
实战案例——设计游戏APP界面按钮 87 
3.3 开关与滚动条设计 91 
3.3.1　开关 91 
3.3.2　滚动条 92 
实战案例——设计APP设置界面 92 
3.3.3　进度条 97 
实战案例——设计游戏进度条 98 
3.4 搜索栏设计 102 
3.4.1　了解APP界面中的搜索栏 102 
3.4.2　扁平化搜索栏 103 
实战案例——设计APP搜索栏 103 
3.5 菜单和工具栏设计 106 
3.5.1　菜单的重要性 106 
实战案例——设计APP菜单界面 107 
3.5.2　菜单的设计要点 111 
实战案例——设计弹出下拉菜单 111 
3.5.3　工具栏的作用 116 
实战案例——设计圆形快捷工具栏 116 
3.6 本章小结 122 
第4章 iOS系统界面设计 123 
4.1 iOS系统 124 
4.1.1 iOS系统概述 124 
4.1.2　iOS系统的发展 124 
4.1.3　iOS系统的基本组件 126 
4.2 iOS系统UI设计规范 127 
4.2.1　iPhone界面尺寸 127 
4.2.2　iPad界面尺寸 128 
4.2.3　iOS系统APP布局 129 
实战案例——设计iOS系统待机界面 129 
4.3 了解全新的iOS 9 135 
4.3.1　iOS 8与iOS 9的区别 135 
4.3.2　iOS 9的特点 138 
4.3.3　iOS 9界面设计遵循的原则 140 
实战案例——设计iOS 9风格日历界面 141 
4.4 iOS系统界面设计规范 146 
4.4.1　iOS系统应用特点 146 
4.4.2　确保在iPhone和iPad上通用 146 
4.4.3　重新考虑基于Web的设计 147 
实战案例——设计iOS系统主界面 147 
4.5 如何设计出色的iOS系统应用界面 154 
4.5.1　内容决定设计 154 
4.5.2　保证清晰的视觉效果 155 
4.5.3　使用深度层次进行交流 156 
实战案例——设计iOS系统天气界面 158 
实战案例——设计iOS系统通话界面 162 
4.6 iOS系统界面的设计原则 166 
4.6.1　美观性 167 
4.6.2　一致性 167 
4.6.3　操作便捷 168 
4.6.4　及时反馈 168 
4.6.5　暗喻 169 
4.6.6　用户控制 170 
实战案例——设计iOS系统音乐播放界面 170 
4.7 本章小结 176 
第5章 Android系统界面设计 177 
5.1　了解Android系统 178 
5.1.1　Android系统概述 178 
5.1.2　Android系统的发展 178 
5.1.3　Android系统的基本组件 179 
5.1.4　了解深度定制Android系统 179 
5.2 Android系统UI设计规范 181 
5.2.1　Android系统的设计尺寸 181 
5.2.2　字体的使用标准 182 
5.2.3　色彩的应用标准 184 
实战案例——设计Android系统锁屏界面 188 
5.3 了解全新的Android L系统 192 
5.3.1　全新的UI设计风格 192 
5.3.2　优化用户体验 193 
5.3.3　增强的通知中心 194 
5.3.4　增强的多任务功能 194 
5.3.5　性能升级 194 
5.3.6　增强电池续航能力 194 
实战案例——设计Android L风格手机主界面 194 
5.4 认识Android系统APP布局 202 
5.4.1　Android系统APP布局 202 
5.4.2　Android与iOS系统界面设计区别 203 
实战案例——设计Android系统待机界面 206 
5.5 Android系统界面的特点 211 
5.5.1　简约大方 212 
5.5.2　操作便捷 212 
5.5.3　通用性强 212 
5.5.4　布局合理 213 
实战案例——设计Android系统主界面 213 
5.6 Android系统的设计原则 218 
5.6.1　美观大方的界面 218 
5.6.2　使用户操作更加简单 219 
5.6.3　完善的操作流程 222 
实战案例——设计Android系统音乐APP界面 223 
5.7　本章小结 233 
第6章 Windows Phone系统界面设计 234 
6.1　了解Windows Phone系统 235 
6.1.1　Windows Phone系统概述 235 
6.1.2　Windows Phone系统的发展 236 
6.1.3　Windows Phone系统的特点 237 
6.1.4　Windows Phone系统的基本组件 239 
实战案例——设计Windows Phone系统待机界面 239 
6.2 认识Windows Phone手机UI界面 243 
6.2.1　Windows Phone 7手机界面 244 
6.2.2　Windows Phone 8手机界面 245 
6.2.3　Windows Phone 8系统的新功能 246 
6.2.4　Windows Phone界面的设计理念 247 
实战案例——设计Windows Phone系统主界面 249 
6.3 Windows Phone系统UI设计规范 254 
6.3.1　Windows Phone系统手机屏幕尺寸 254 
6.3.2　主界面 254 
6.3.3　状态栏 255 
6.3.4　应用程序栏 256 
6.3.5　图标 256 
6.3.6　屏幕方向 257 
6.3.7　字体 257 
6.3.8　推送通知 258 
实战案例——设计Windows Phone系统音乐播放界面 259 
6.4 Tile（磁贴）与Pivot（枢轴视图）设计 264 
6.4.1　Tile（磁贴）简介 264 
6.4.2　Tile（磁贴）的类型 265 
6.4.3　Tile（磁贴）的大小 266 
6.4.4　Pivot（枢轴视图）简介 266 
实战案例——设计Windows Phone平板界面 267 
6.5 独特的Panorama（全景视图） 273 
6.5.1　Panorama（全景视图）简介 273 
6.5.2　全景视图设计注意事项 274 
实战案例——设计全景视图界面 275 
实战案例——设计桌球手机游戏界面 283 
6.6　本章小结 291 
第7章 APP界面设计 292 
7.1　常见的APP应用类型 293 
7.1.1　实用功能类APP应用 293 
7.1.2　社交类APP应用 293 
7.1.3　娱乐、游戏类APP应用 294 
7.2　APP界面设计视觉效果 294 
7.2.1　简洁型的APP界面 294 
7.2.2　趣味与个性的APP界面 295 
7.2.3　华丽的APP界面 295 
实战案例——设计iPad影视APP界面 296 
7.3 APP引导界面 303 
7.3.1　功能介绍类 304 
7.3.2　使用说明类 304 
7.3.3　推广类 304 
7.3.4　问题解决类 305 
实战案例——设计APP引导界面 305 
7.4 APP界面设计要求 311 
7.4.1　APP界面的特点 311 
7.4.2　APP界面的设计流程 312 
7.4.3　APP界面的色彩搭配 313 
7.4.4　平板电脑界面的特点 314 
实战案例——设计音乐APP界面 314 
实战案例——设计iPad游戏登录界面 322 
7.5 APP界面设计原则 331 
7.5.1　实用性 331 
7.5.2　统一的色彩与风格 331 
7.5.3　合理的配色 332 
7.5.4　规范的操作流程 332 
7.5.5　视觉元素规范 332 
实战案例——设计购物APP界面 333 
7.6 APP界面设计注意事项 340 
7.6.1　APP界面视觉设计 341 
7.6.2　APP界面设计的用户体验 341 
实战案例——设计照片分享APP界面 342 
7.7　本章小结 351