移动UI 的界面，就犹如人的脸面一样，是最直观，也是给用户最初的印象，甚至可以传递特定的情节，进行有效的视觉暗示，由此可见，移动UI 视觉设计的重要性。当今很多UI 视觉设计师不是不懂如何进行制作，而是不知道从何下手，以什么思路进行创作。当前的设计教育重点也从过去单一的技法向掌握系统设计思维方法的训练转变，更加追求对设计创新的系统方法和思想的应用，引导读者从宏观、整体和系统的角度去认识并进行创造。本书就是基于传授设计方法和创意思路为主要宗旨，通过大量的案例的讲解，以及设计过程的展示，试图让读者认识和了解移动UI界面设计的全新理念，学会一种新的思维方式。
本书一共包含了五章内容，即开始、风格、惊喜、创意和爆发，循序渐进的讲述移动UI 的基础概念、五大要素的内容、十大界面元素的设计、移动设备基础应用程序的界面设计和完整APP 客户端界面设计这五个方面的内容，利用浅显易懂的表述、精美的配图、详尽的图文搭配来对移动UI 界面设计的重点和难点进行讲解。通过大量的案例来告诉读者移动UI 视觉设计的创作技巧。本书特别适合移动设备UI 视觉设计的初学者，同时对Photoshop 使用者、平面设计师和APP 开发设计人员也有参考价值。
移动UI就犹如人的脸面，形成了用户对一款移动APP最直观的第一印象，甚至可以传递特定的情绪，进行有效的视觉暗示，由此可见APP视觉设计的重要性。当今很多UI视觉设计师不是不懂如何进行制作，而是不知道从何处入手，以什么思路进行创作。当前的设计教育重点也从过去单一的技法讲授向系统的设计思维方法训练转变，更加追求对设计创新的系统方法和思想的应用，引导读者从宏观、整体和系统的角度去认识并进行创造。本书就是以传授设计方法和创意思路为主要宗旨，通过对大量案例的讲解及设计过程的展示，试图让读者认识和了解APP视觉设计的全新理念，学会一种新的思维方式。
全书共分为开始、风格、惊喜、创意和爆发五章，循序渐进地讲述了移动UI的基础概念、五大要素的内容、十大界面元素的设计、移动设备基础应用程序的界面设计和完整APP客户端的界面设计这五个方面的内容。本书利用浅显易懂的表述、精美的配图、详尽的图文搭配讲解了APP视觉设计的重点和难点，并通过对大量案例的详细解析来帮助读者掌握APP视觉设计的创作技巧。
本书特别适合移动设备UI视觉设计的初学者阅读和学习，同时对Photoshop使用者、平面设计师和APP开发设计人员也有很高的参考价值。
随着移动设备的迅猛发展，对移动设备中的应用程序需求越来越多，而各种应用程序界面设计良莠不齐，用户通常会选择界面视觉效果良好，且具有良好体验的应用留在自己的移动设备上长期使用。移动界面不同于网页应用的界面，设计师需要挑战小尺寸屏幕，需要将众多的信息放在小尺寸屏幕里，这无疑是一个巨大的挑战。
面对用户对APP的视觉要求，UI设计师如何满足用户要求，如何使自己设计的软件盈利呢？那么多的设计要求，要怎么才能抓住用户真正在意的核心诉求？怎样才能创作出既符合系统设计规范，又满足大众视觉需要的产品？这些都是设计师们困扰的问题。本书通过讲解大量的创作思路，对移动APP的视觉设计进行有目的的引导，呈现出从无到有，从有到精的过程，帮助读者掌握APP的设计方法和思路。
本书特色
设计指南概述：通过“设计指南概述”这个模块来对移动设备界面中十大设计元素的设计规范和制作特点进行讲解，帮助读者快速掌握移动设备界面设计的细节。
创意演变大揭秘：将单个界面元素的演变记录下来，通过形状的改变、色彩的调整、特效的修饰、材质的添加等环节来呈现界面元素的设计过程和创意流程。
提取关键字：利用完整实例中的“项目任务”对界面设计提出要求，通过“提取关键字”模块让读者学会抓住设计要求中的核心字眼，也就是抓住设计的重点。
思维的扩散与爆发：详细讲解各个案例中所使用的思维方式和创意来源，以提取的关键字为中心进行发散联想，展示出设计的思路，让读者认识APP界面设计的全新方法。
内容概述
开始：主要讲述与移动UI视觉设计相关的基础概念、设计原则以及界面设计所需的Photoshop软件的常用基础知识，让读者拥有设计的敲门砖。
风格：移动UI界面设计因为尺寸、主题、布局、字体和色彩这五大要素的不同而产生影响，在此将对这五大要素进行详细的讲解和分析。
惊喜：剖析移动设备界面中十个最为常用且最基础的设计元素，详细讲解这些元素的设计规范和设计要点，通过循序渐进的方式展示出设计的思路，以及优秀作品的演变过程。
创意：以移动设备中的基础应用程序的设计为主要内容，通过案例的形式对这些应用程序的界面进行设计，并总结这些界面的特点，利用个性化的设计来表现基础应用程序的界面。
爆发：以完整的项目设计进行讲解，通过提出设计要求、提炼设计要点、分析设计思路、剖析制作步骤等环节展示出一个完整APP的创作过程和思路。
其他
本书由北京印刷学院严晨老师编写Chapter 01~Chapter 03部分内容，由北京市环境与艺术学校杨智坤老师编写Chapter 04和Chapter 05部分内容。特别感谢北京印刷学院数字媒体艺术实验室（北京市重点实验室）在本书的出版过程中提供的大力资助。尽管作者在编写过程中力求准确、完善，但是书中难免会存在疏漏之处，恳请广大读者批评指正，让我们共同对书中的内容一起进行探讨，实现共同进步。
编者
2015年2月
计算机\数字艺术\视觉设计
APP界面不同于网页应用界面，设计师需要挑战小尺寸屏幕，将众多的信息放在其中，这无疑是一个巨大的挑战。
面对用户对APP的视觉要求，UI设计师要如何满足用户要求，如何使自己设计的软件盈利呢？那么多的设计要求，要怎么才能抓住用户真正在意的核心诉求？怎样才能创作出既符合系统设计规范，又满足大众视觉需要的产品呢？这些都是困扰设计师们的问题。
本书通过大量创作思路的分析讲解，对APP的视觉设计进行有目的的引导，呈现出从无到有，从有到精的过程，帮助读者掌握APP视觉创意的思路和设计方法。
严晨 杨智坤 著：暂无简介
前言
如何获取云空间资料
多媒体视频播放说明
Chapter 01 开始 获取移动UI视觉设计的敲门砖 1
1.1 概述移动UI视觉设计2
1.2 移动UI视觉设计原则4
1.2.1 完整性原则4
1.2.2 一致性原则5
1.2.3 直观性原则6
1.2.4 习惯性原则7
1.3 设计是有规律可循的8
1.3.1 情感化设计8
1.3.2 差异化设计9
1.3.3 和谐化设计10
1.4 如何构思与创意11
1.4.1 发散思维11
1.4.2 将思考视觉化12
1.4.3 寻找切入点13
1.5 Photoshop软件基础14
1.5.1 绘图工具14
1.5.2 图层样式15
1.5.3 不透明度与填充16
Chapter 02 风格 五大要素构建界面基础印象 17
2.1 设备的尺寸18
2.1.1 设备的显示18
2.1.2 度量单位与留白19
2.2 主题的设定20
2.2.1 系统主题20
2.2.2 正确选择主题突显设计的特点21
2.3 界面布局22
2.3.1 应用结构22
2.3.2 多视图布局23
2.3.3 滚动视图24
2.3.4 合理布局促进记忆且强调个性25
2.4 字体的规范26
2.4.1 字体的规定类型26
2.4.2 默认的文字颜色27
2.4.3 字体的缩放27
2.4.4 文字的个性来自反复推敲的过程28
2.5 色彩的选择29
2.5.1 系统规定的色彩29
2.5.2 UI视觉设计中色彩使用的原则30
2.5.3 根据设计需要选择色彩32
Chapter 03 惊喜 揭秘十大界面元素设计的演变过程 33
3.1 图标34
3.1.1 设计指南概述34
3.1.2 小图标和上下文图标35
3.1.3 创意演变大揭秘37
3.2 按钮39
3.2.1 设计指南概述39
3.2.2 创意演变大揭秘40
3.3 滑块42
3.3.1 设计指南概述42
3.3.2 创意演变大揭秘43
3.4 开关45
3.4.1 设计指南概述45
3.4.2 创意演变大揭秘46
3.5 标签48
3.5.1 设计指南概述48
3.5.2 创意演变大揭秘49
3.6 下拉菜单51
3.6.1 设计指南概述51
3.6.2 创意演变大揭秘52
3.7 文本框53
3.7.1 设计指南概述53
3.7.2 创意演变大揭秘54
3.8 对话框55
3.8.1 设计指南概述55
3.8.2 创意演变大揭秘56
3.9 进度控件58
3.9.1 设计指南概述58
3.9.2 创意演变大揭秘59
3.10 选择器60
3.10.1 设计指南概述60
3.10.2 创意演变大揭秘61
Chapter 04 创意 开启灵感源泉构思个性移动UI 63
4.1 通讯录界面设计64
4.1.1 纵向思维定义主要元素：标签64
4.1.2 标签的数量决定了界面色彩的丰富程度65
4.1.3 彩色标签决定界面风格：活泼、轻快66
4.1.4 实例制作步骤解析66
4.2 短信界面设计73
4.2.1 按时间顺序定义界面主要元素：时间线73
4.2.2 用蓝绿色表现短信内容的未知性74
4.2.3 单色设计元素与繁杂背景混搭75
4.2.4 实例制作步骤解析75
4.3 拍照及相册界面设计80
4.3.1 依据功能确定界面设计要点：开放式、幻灯片81
4.3.2 根据案例素材照片搭配界面色彩82
4.3.3 照片色彩决定界面风格：清爽、柔美82
4.3.4 实例制作步骤解析83
4.4 计算器界面设计87
4.4.1 从功能入手定义界面主要元素：计算器87
4.4.2 为计算器界面进行配色88
4.4.3 确定计算器元素界面风格：真实、质朴89
4.4.4 实例制作步骤解析89
4.5 单位换算界面设计94
4.5.1 根据功能及作用定义界面主要元素：绿色、矩形94
4.5.2 使用不同明度的绿色和黑色进行配色95
4.5.3 双色搭配决定界面风格：清晰、醒目96
4.5.4 实例制作步骤解析96
4.6 录音机界面设计102
4.6.1 根据现实操作定义主要元素：磁带102
4.6.2 参照磁带素材对界面进行配色103
4.6.3 黑色磁带元素决定界面风格：冷调、质感104
4.6.4 实例制作步骤解析104
4.7 收音机界面设计113
4.7.1 通过形象思维具象化设计元素：电磁波113
4.7.2 根据收音机的颜色进行配色114
4.7.3 都市照片和矩形电磁波定义界面风格：时尚、简约115
4.7.4 实例制作步骤解析115
4.8 音乐播放界面设计120
4.8.1 发散思维寻找界面主要元素：CD光盘120
4.8.2 用复古色调的照片进行配色122
4.8.3 复杂背景决定界面元素风格：简单122
4.8.4 实例制作步骤解析123
4.9 日历界面设计126
4.9.1 根据界面内容的限制来敲定界面布局：棋盘式126
4.9.2 用多种色彩对日历信息进行分类表现127
4.9.3 棋盘式设计确定界面风格：单色、简约128
4.9.4 实例制作步骤解析128
4.10 搜索界面设计131
4.10.1 联想思维定义界面主要元素：木纹、放大镜131
4.10.2 以木纹和放大镜的颜色进行配色132
4.10.3 木纹材质决定界面风格：天然、复古133
4.10.4 实例制作步骤解析133
Chapter 05 爆发 升级创意创作完美移动UI界面 139
5.1 清爽色调的扁平化手机主题设计140
5.1.1 项目任务141
5.1.2 提取关键字：凉爽、扁平化、IOS 7141
5.1.3 根据IOS 7中的字体定义图标和文字142
5.1.4 调整主要色彩的明度以增加配色142
5.1.5 剖析案例制作步骤143
5.2 购物APP客户端UI设计150
5.2.1 项目任务151
5.2.2 提取关键字：时尚、柔美、清晰151
5.2.3 用标题栏和图标栏引导用户操作152
5.2.4 添加灰度色彩调和配色152
5.2.5 剖析案例制作步骤153
5.3 浏览器APP客户端UI设计159
5.3.1 项目任务160
5.3.2 提取关键字：大气、简约160
5.3.3 添加点缀色彩突出关键信息161
5.3.4 剖析案例制作步骤161
5.4 天气APP客户端UI设计168
5.4.1 项目任务169
5.4.2 提取关键字：清爽、简化、分区明确169
5.4.3 根据天气照片创作出天气图标169
5.4.4 利用线条进行视线引导式布局170
5.4.5 剖析案例制作步骤171
5.5 美食APP客户端UI设计178
5.5.1 项目任务179
5.5.2 提取关键字：美食、Android、功能清晰179
5.5.3 多种特效打造立体感的界面元素180
5.5.4 利用底纹使界面更精致180
5.5.5 剖析案例制作步骤181
5.6 医院APP客户端UI设计191
5.6.1 项目任务192
5.6.2 提取关键字：医院、直观、统一192
5.6.3 根据界面内容定义布局193
5.6.4 剖析案例制作步骤194
5.7 音乐APP客户端UI设计201
5.7.1 项目任务202
5.7.2 提取关键字：音乐、特点、Android202
5.7.3 以主色调进行配色扩展203
5.7.4 根据LOGO风格定义界面按钮外观203
5.7.5 剖析案例制作步骤204
5.8 游戏APP客户端UI设计210
5.8.1 项目任务211
5.8.2 提取关键字：抢球、打地鼠、猫咪211
5.8.3 参考“打地鼠”游戏进行界面布局212
5.8.4 统一风格保持界面一致性213
5.8.5 剖析案例制作步骤213
