术之篇

01 基础知识

学习一项技能，尤其是已经有一定沉淀并在行业有广泛应用的技能，就一定要对它先有充分的认知。

在深入学习App设计前，我们需要了解一下行业的基础知识。

1.1 什么是UI设计

1.1.1 UI的相关概念

1．UI和GUI

用户界面（User Interface）：用户界面是一个比较广泛的概念，指人和机器互动过程中的界面，以手机为例，手机上的界面都属于用户界面。我们通过这个界面向手机发出指令，手机根据指令产生相应的反馈。设计这套界面视觉的人被称为UI设计师。在设计师领域，在PC端从事网页设计的人我们称为WUI（Web User Interface）设计师或者网页设计师。在移动端从事移动设计的人，我们称为GUI（Graphics User Interface）设计师，因为移动端会有大量图形用户界面设计。在公司中，人们并不会很清楚地区分这两种职能，都统称为UI设计师，如图1-1所示。因为他们产出的都是界面，都需要对产品的界面视觉负责。

2．UE与UED

用户体验（User Experience）：用户体验指用户在使用产品过程中的个人主观感受。关注用户使用前、使用过程中和使用后的整体感受，包括行为、情感和成就等各个方面。具体到产品层面上，用户体验包含以下几点。

•性能：产品运行是否够快、是否稳定、是否占很多的系统资源等。

•内容：产品的内容是否为用户解决一定的问题，是否满足用户的需要。

•交互：产品交互是否顺畅，用户是否可以无障碍的使用界面。

•界面：产品的Logo、主题、颜色和布局等是否能带给用户统一、整齐、高质量的感觉。

用户体验是用户面对产品产生的整体使用感受，包括受品牌、用户个人使用经验的影响。所以不要狭隘地理解为只与用户界面相关，那只是其中的一部分。

用户体验设计（User Experience Design）：用户体验虽然是个人的主观感受，但是共性的体验是可以经由良好的设计提升的。所以国内大型互联网公司纷纷把体验设计提升到一个高度，组建用户体验设计团队，旨在提升用户使用产品的体验。自从2006年淘宝把设计部门称为UED后，国内很多企业也跟风组建自己的设计部门，称之为UED, UED逐渐成为互联网公司的设计部门代名词。但是很多UED团队名不符实，团队中甚至没有独立设置用户体验研究的职位，这个职位的职能可能由产品人员或者交互设计师承担了，所以可能你所称呼的UE设计师，也许是一名交互设计师。

3．UCD

以用户为中心的设计（User Centered Design）:UCD是一种设计思维模式，强调在产品设计过程中，从用户角度出发来进行设计，用户优先。产品设计有个BTU三圈图（Business、Technique、 User），如图1-2所示。即一个好的产品，应该兼顾商业盈利、技术实现和用户需求。在不同阶段需要考虑不同需求的优先级，所以UCD只是强调用户优先，并不代表在所有时候都是合适的。例如，有一个产品急需推出上线，但有部分功能缺失，因为技术问题难以在短时间内实现。这个时候从UCD的角度来说是不适合推出的，因为功能缺失，产品体验并不完整。但是从商业角度来看，早一步推出就早一步抢占市场。这个时候就需要平衡，考虑是否需要牺牲一部分体验去抢占市场，照顾商业利益。

目前国内互联网公司的设计师深感用户体验可能作为一种口号流于形式，对于日常工作并没有什么改变。从一个视觉设计师的角度来说，我认为视觉设计师在工作中不应把自己定位于一个描点、画线、上色的角色，应该在设计过程中更多地关注自己的上下游。交互上，关注界面的流程，上下逻辑，思考产出的界面是否好用；开发上，交流界面的实现，是否影响性能；产品上，关注为什么要这样设计功能，把用户体验设计的态度贯穿于整个产品设计流程中。一名优秀的用户体验设计师，需要对界面、交互和实现技术都有深入的理解。所以不要让用户体验成为一个口号，而是要作为一种思维方式，融入日常工作中。

1.1.2 UI的学习方法

了解完基础的概念后，如何开始学习UI设计呢？下面介绍一些UI设计师学习的基础方法。

1．图形基础

UI设计确实需要很好的图形基础，目前国内知名的UI设计师接触UI时大多从学习画图标开始，这样充分锻炼了设计师绘制图形的基础。手机界面就是设计师的画板，各种漂亮的界面图标就是设计师的绘画成果。

在过去一段时间内，扁平化风格比较流行，图标设计主要以线性和色块为主。很多人质疑还有没有必要去练习写实图标，我的意见是需要的。国内的设计专业都有基础课：素描、速写和色彩。这是绘画入门的三大基础课题，如图1-3所示。我们学习图形设计的过程也是以这个顺序逐步递进的。

可以理解为学习写实图标就是练习素描基本功。我们要在电脑上对现实世界的物体进行细致准确的描绘，就需要更仔细地观察事物。这个物体的透视是如何的，光照射的角度是如何的，在对应的形状中表现出怎样的明暗分布……随着写实功力的递增，你就会逐渐培养出一双洞察细节的眼睛。在设计过程中可以考虑提炼图形，对原有的写实细节进行取舍，只保留核心的抽象图形，我们可以理解为这个过程就是速写。最后通过学习一些软件使用技法对图形进行样式的渲染，这是最终的色彩课。所以我认为学习绘制写实图标是一项综合性的设计基础课，这个过程会锻炼你对设计和形体做出本能的反应，分析它们的美丑，找出核心所在。

2．设计软件

软件的掌握是一种硬技能，不管我们有多好的想法，都需要使用软件来实现。我们需要掌握软件的基础操作，如Photoshop中的形状工具、钢笔工具、文字工具和图层样式等。也需要了解曲线和色阶这部分图像调整功能。这些基础操作不在本书的讨论范围，读者可以阅读相关软件基础教程书籍。下面介绍一些在UI设计中常见的软件，如图1-4所示。

Photoshop：Photoshop是一款老牌像素处理软件。各种设计行业图形处理都会用到Photoshop，可以满足UI界面设计的日常需要。本书默认所有的设计演示都通过Photoshop完成。

Illustrator：Illustrator是矢量软件，在处理一些复杂的图形路径时，可以考虑使用Illustrator，也有设计师在Illustrator中完成所有图标的设计制作，然后连接嵌入到Photoshop中。

PS Play：这是腾讯开发的一款软件，通过Wi-Fi网络连接手机和电脑，在终端设备上实时预览电脑上Photoshop的设计稿，可同步调试及截图保存到移动终端。

After Effects：现在扁平化设计成为主流，所以动效设计成为不可或缺的一部分，可通过After Effects软件设计动效平滑切换界面。

Mark Man：一款标注软件，在移动设计中并没有前端的角色，需要设计师自己对设计图进行标注切图。

3．设计规范

我们设计的应用是基于iOS系统和Android系统运行。这两个系统都有其官方设计规范，这些规范详细罗列了一些通用性设计框架，如iOS系统下的设计图需要创建多大的尺寸，Android系统下是多大的尺寸，各自的系统状态栏、导航栏和标签栏高度是多少，手机屏上最适字号是多大，能看清的最小字号是多少，iOS系统用什么字体，Android系统用什么字体等。这些会在本书后面章节中进行详细介绍。

当然，官方设计规范可以理解成一份通用的指南，如果想做出自己的特色，必须遵守而又不拘泥于规范，那就需要根据产品特性制定出自己的一套设计规范。本书也介绍了制定设计规范的方法。

4．临摹学习

理论与实践并行，我们熟悉相应的理论知识后，还需要做大量的设计练习。把设计知识融入实际的工作中，这个过程中手要勤、眼要宽。

手勤就是多练习，业余时间多临摹成熟图标界面设计作品，再在合适的时机借鉴到实际的工作中。智慧源于心胸，心胸源于眼界，眼宽就是多去看设计网站，开拓自己的眼界，如站酷（ZCOOL）、UI中国和追波（Dribbble）等，如图1-5所示。多年以来笔者形成的一个习惯就是每天花一个小时浏览这些设计网站，看看最新的设计师作品。

5．参与项目

经历一整套完整的设计流程是最好的学习锻炼方式。从一开始讨论原型图到出效果图，再到切图以及标注给开发者。效果图要不断导出在手机上预览，核对电脑上的设计稿与手机上预览的差距，你会不断在实践中提高。当然有设计师会说，我目前正在学习阶段，还没有参与到移动设计工作中，这也不是问题，网上有大量的现成设计案例，你可以按照你的想法二次重新设计，这种方法叫Redesign（再设计）。通过假想的设计项目，思考整个项目的流程，精益求精地推翻和改变，不放过每个小图标等细节，同时能把自己的设计思路完整展示说明出来。业界有这样的案例，某设计师不满Facebook的界面，按自己的想法独立重新设计了界面，并在设计网站上展示，由于二次设计效果出色，赢得了很多网友的赞誉，也吸引了Facebook的注意，最终收到了Facebook的Offer。所以，设计师们，赶紧动起手来吧。

1.2 什么是App

了解完UI相关的基础知识后，我们来介绍一下App以及App的整个研发流程。

1.2.1 App的概念

App是Application的缩写，指运行在手机系统上的应用程序软件，也称之为App软件、App应用或App客户端等。在本书中App统一称为应用。

目前主流智能手机的操作系统有苹果系统（iOS）和安卓系统（Android）。其他的智能手机系统份额非常小，几乎可以忽略不计。因为这两套系统各自的底层代码语言不一样，所以开发团队会配备iOS程序员和Android程序员。团队领导者可能觉得界面设计是相通的，当然，更多的是出于人员成本的考虑，一般设计人员不分iOS和Android设计师。所以设计人员需要学习两种系统的应用界面设计知识。在后面的章节会详细介绍这两种系统的差别，以及相应的设计规范。

1.2.2 App的开发流程

UI设计只是整个应用开发的一个环节，开发一个应用由多个角色共同完成。为了更好地开展设计工作，我们需要了解上下游环节，如图1-6所示的App开发维护流程图演示了整个应用开发的工作流程。

1．产品经理

产品经理（PM）一般会收集需求，构想要做一个什么样的应用，会更多地考虑功能，这时的原型还是一个粗略的原型，他还要根据产品的生命周期，协调设计、研发和运营等，控制整个应用开发的进度。最终产出物是低保真的原型和原型说明文档（低保真的原型就是指粗略的线框图，主要用来简单说明产品功能；高保真是无限接近于最终产品的线框图，表达产品的流程、逻辑、布局、视觉效果和操作状态等）。

2．交互设计

交互设计师（UX）会继续深入这个低保真原型，进一步优化细节，更多地考虑用户流程、信息架构、交互细节和页面元素等。在很多公司可能舍弃了这个角色，由产品经理兼任这个角色。最终产出物是高保真原型，高保真是无限接近于最终产品的线框图，表达产品的流程、逻辑、布局、视觉效果和操作状态等。

3．视觉设计

视觉设计师（UI）需要根据高保真原型设计界面，这一步不只是“美化”的工作。视觉设计师需要对原型设计有深刻的理解，需要了解整个页面的逻辑，从全局的角度来做视觉设计，用视觉手法去完成产品的设计。最终产出物是各种图片、界面切图及界面的标注。

4．用户体验

用户体验设计（UE）是以用户为核心原则，保证功能与审美的平衡。严格来说这个过程应该贯穿整个设计过程。单独配备这个角色的团队非常少，这个角色的职能一般由团队内的产品经理、交互设计师和视觉设计师分担。

5．开发

程序员根据设计团队提供的标注切图搭建界面，根据产品提供的功能说明文档去开发功能，最终产出物是可使用的应用。

6．测试

应用开发完成后，还需要测试人员测试应用的功能，看看应用上有没有功能问题，并反馈给开发人员或者设计人员更改。测试人员一般以测试功能为主，对于界面适配的细节问题，测试人员并不能及时发现，所以界面测试工作最好还是视觉设计师配合完成。

7．运营

运营人员最终把打包的应用发布到苹果商店和各大安卓市场上。应用不是发布到市场上就不管了，可以把前期的开发过程理解为“生孩子”，而运营就是“养孩子”的过程。根据不同类型的应用，运营人员需要通过各种手段提升应用的人气。同时也可以把运营应用过程中发现的问题反馈给产品人员，由产品人员再次发起应用的版本迭代。

1.3 智能手机的屏幕

我们经常在手机介绍中看到一堆参数。例如，手机屏幕是多少英寸，手机的分辨率是多少，是否是高清视网膜屏幕，为了更好地了解显示App的手机，我们先来了解一下手机屏幕的相关概念。

1.3.1 英寸（Inch）

英寸是我们常用的长度单位。英国是工业革命的发源地，英寸虽是英制单位，但在工业领域被广泛使用，很多图纸、铭牌上都是使用英寸作为长度单位。显示设备特别是电视机使用英寸来表示大小，手机屏幕也继承了这个计量单位。在显示设备中，如描述iPhone 4s的屏幕是3.5英寸，表示屏幕斜对角线的长度。

乔布斯认为3.5英寸是人类单手持设备的最佳尺寸，如图1-7所示。随着时代的发展，手机这一智能终端的使用发生了很大的变化，它渐渐变成了内容消费和娱乐的主要平台，人们每天愿意花几个小时在上面双手操作。快速沟通和效率工具只是占用时间比例很小的一部分功能。作为内容消费和娱乐的窗口，3.5英寸的屏幕已经满足不了人们的需求了。所以现在手机屏幕都以4.7英寸以上尺寸为主流。

手机常见屏幕尺寸有3.5英寸、4.3英寸、4.7英寸和5.5英寸。为什么会选择这几个尺寸呢？因为手机屏幕使用的玻璃是一整块生产的，然后再切割成一块一块的。利用率与成本直接相关，为了获得最优的玻璃切割利用率，避免切割余料浪费，所以有了以上相应尺寸。

1.3.2 像素（Pixel）

我们用放大镜看显示屏，发现图像是由一个个小点组成的，这些小点就是像素点，如图1-8所示。像素是图像的基本采样单位，它不是一个确定的物理量，因为像素点的物理大小是不确定的。像素也不是一个具体的点或者小方块（尽管可以用点和小方块来呈现），而是一个抽象的概念。

1.3.3 分辨率（Resolution）

分辨率是屏幕像素的数量，一般用屏宽像素数乘以屏高像素数表示。描述iPhone 7的屏幕分辨率是750×1334，就是iPhone 7的屏幕是由750列和1334行的像素点排列组成的，如图1-9所示。每个像素点发出不同颜色的光，构成我们所看到的画面。在PC时代，分辨率越高，意味着屏幕越大，因为PC具有固定的PPI。但智能手机的屏幕就不是如此了，因为手机的像素密度是不一样的。

1.4 网点密度与像素密度

我们看手机屏幕的时候，会发现有的低端手机屏幕有很强的颗粒感，能看到明显的一颗颗像素点。而高端手机屏幕显示非常顺滑，凑近屏幕看，也几乎看不到屏幕的像素点。为什么屏幕会有这样的显示差别呢？下面我们介绍一下造成这种差别的原因。

1.4.1 网点密度（DPI）

在纸质媒介时代，我们常用网点密度（Dot Per Inch, DPI）来描述印刷品的打印精度。DPI常用于“设备参数”描述（如扫描仪和打印机），例如，我设置了打印分辨率为96DPI，那么打印机在打印过程中，每英寸（Inch）的长度打印了96个点（dot），打印机在每英寸内打印的墨点数越多，图片看起来越精细。这种概念也带入到PC时代的Windows系统，Windows系统的默认DPI为96。

1.4.2 像素密度（PPI）

像素密度（Pixel Per Inch, PPI）常用于“屏幕显示”的描述，用来表示每英寸像素点数量。图1-10所示的是在Photoshop中设定某图的分辨率为72PPI，那么，当图片对应到现实尺度中，屏幕将以每英寸72个像素（Pixel）的方式来显示。显示屏幕的PPI数值越高，画面看起来就越细腻。

1.4.3 DPI与PPI

当DPI的概念用在手机屏幕上时，表示手机屏幕上每英寸可以显示的像素点的数量。这时候我们用PPI来描述这个屏幕。屏幕生产工艺越高，每平方英寸就能容纳越多的像素。例如，iPhone 3GS的屏幕像素是320×480, iPhone 4s的屏幕像素是640×960。两款手机屏幕的物理尺寸都是3.5英寸，但像素密度（PPI）不一样。iPhone 4s的视网膜（Retina）屏幕把2×2个像素当1个像素使用。在同样的物理面积内填充了更多的像素，所以显示效果更加精细，如图1-11所示。

1.4.4 逻辑分辨率与像素倍率

物理分辨率是硬件所支持的分辨率，逻辑分辨率是软件可以达到的分辨率。逻辑分辨率乘以一个倍率得到物理分辨率，这个倍率叫作像素倍率。例如，苹果的视网膜（Retina）屏幕定义了2倍率（iPhone 7 Plus为3倍率，后面章节会具体分析），以iPhone 4s为例，逻辑分辨率为320×480，像素倍率为@2x，得到物理分辨率为640×960。

在iOS系统的资源图片中，同一张图通常有两个尺寸，如图1-12所示。你会看到文件名有的带@2x、@3x字样，有的不带。其中不带的用在普通屏上，带@2x、@3x的分别用在2倍率和3倍率的Retina屏幕上。

1.4.5 视网膜屏幕

手机屏幕距离你的眼睛10～12英寸（约25～30厘米）时，它的分辨率只要达到300PPI（每英寸300个像素点）以上，你的眼睛就已经无法分辨出像素点了，这样的屏幕被称为“视网膜（Retina）屏幕”。由于其具备超高的像素密度，因此屏幕显示异常清晰、锐利。一般电脑显示屏幕的分辨率为72PPI。如果想了解你的手机是否拥有“视网膜（Retina）屏幕”，就要计算手机屏幕的PPI了。

图1-13所示的是PPI的计算公式。

例如，iPhone 4s屏幕分辨率为640×960，屏幕尺寸为3.5英寸。代入公式，结果为326PPI，大于300PPI，符合“视网膜屏幕”的特征，而iPhone 3GS则不符合，如图1-14所示。

1.5 常见手机屏幕规格

了解了手机屏幕的相关概念后，我们来关注一下市面上手机的屏幕参数。市面上的手机型号种类繁多，我们只选取具有代表性的、使用人数比较多的手机型号进行研究。以下数据来源于应用统计分析平台“友盟”。

1.5.1 热门手机规格

友盟将一个独立的设备视为一个用户。例如，一部手机用户，打开了手机上的应用，这时候就被统计为一个活跃用户。通过统计活跃用户，可以很直观地看到市面上哪些手机型号是热门机型，如图1-15所示。

结论：

从图1-16所示的数据来看，目前国内绝大多数热门手机都已经使用视网膜屏幕。大部分手机屏幕都在4英寸以上。大屏幕、高分辨率的手机已经成为市场的主流。

1.5.2 热门手机分辨率

通过统计热门手机，我们进一步可以统计到热门手机分辨率的分布。然后我们可以知道哪些分辨率在设计时需要考虑。

结论：

从图1-17和图1-18所示的数据统计来看，有如下分辨率是需要考虑设计的。iOS系统：750×1334、1242×2208、640×1136、640×960。iPad的分辨率是2048×1536，不在本书的讨论范围内。Android系统：7201280、1080×1920、480×854、540×960、720×1184。这么多分辨率都需要考虑，是不是要出多套界面设计方案？答案是不用，我们只需要考虑设计适配即可。在第10章中，会介绍如何设计一套方案适用于多个分辨率。

Tips

本章节数据来源于2016年12月友盟指数榜。

1.6 iPhone 6 Plus的屏幕

为了满足用户对大屏手机的需求，苹果推出了iPhone 6/6s/7和iPhone 6/6s/7 Plus手机（以下为了书写理解方便，直接写为iPhone 6和iPhone 6 Plus），屏幕分别为4.7英寸和5.5英寸。在之前的统计数据看iPhone手机的视网膜屏幕都是2倍像素倍率，PPI是统一的326。iPhone 6依然沿用了326PPI，这样的好处是在同等物理面积上的填充像素统一，即使屏幕大小有区别，用户可见的UI元素也是保持高度统一的。而从iPhone 6 Plus开始，苹果增加了3倍像素倍率的屏幕。注定iPhone 6 Plus的屏幕是苹果手机家族里一块特别的屏幕。

下面我们通过模拟界面方案来介绍一下这个屏幕的特别之处。

通过苹果官方资料会看到iPhone 6 Plus屏幕分辨率是1080×1920，而设计分辨率为1242×2208，有点让人困惑。那么iPhone 6 Plus的分辨率到底是多少？假如我们是苹果工程师，按照苹果的适配规则来定义iPhone 6 Plus的屏幕解决方案。给出了如图1-19所示的4个解决方案。

方案A：逻辑分辨率用540x960，像素倍率为@2x，最终物理分辨率是1080x1920, PPI是401, PPI越高，单位物理面积里需要填充的像素越多，所以缺点是所有UI元素尺寸在屏幕上的实际物理面积变小了。图1-20所示为方案A与iPhone 6的对比。

方案A按钮的物理高度只有iPhone 6的326/401≈81%，单击面积就只有iPhone 6的0.81×0.81≈65%，用户操作非常困难。

方案B：逻辑分辨率用360x640，像素倍率为@3x，最终物理分辨率是1080x1920，缺点非常明显，方案B的逻辑分辨率360x640 就会比iPhone 6的逻辑分辨率375x667 还低，如图1-21所示。iPhone 6 Plus的大屏幕虽然很精细，但是可显示的实际内容比iPhone 6 还少。如相同字号的情况下，iPhone 6如果一行显示了25个字，而按方案B的逻辑一行只能显示24个字。这样的设计方案显然比较浪费屏幕。

方案C：逻辑分辨率用414×736，像素倍率为@3x，最终物理分辨率是1242×2208，缺点是为了维持iOS系统UI元素显示统一，PPI需要达到461，图1-22所示的是方案C的PPI计算方式。此时设备内存消耗较大、电池消耗较大。

方案D：逻辑分辨率用414×736，像素倍率为@3x，最终物理分辨率是1242×2208，此时PPI为401。

也许供应商的461PPI的屏幕产能不足，也许苹果在权衡屏幕与电池的矛盾时牺牲了屏幕，最终苹果选择的方案是D，软件输出1242×2208的分辨率，而硬件只支持1080×1920的分辨率，如图1-23所示。这样导致的结果是像素无法绝对对齐，如图1-24所示。iPhone 5s屏幕像素可以对齐，由于iPhone 6 Plus缩小了像素，导致产生了虚边现象，像素无法绝对对齐。由于iPhone 6 Plus的PPI非常高，这种像素不对齐的现象对普通用户视觉影响并不大。

1.7 智能手机的传感器

智能手机的屏幕技术不断提高，给广大用户带来了更加惊艳的视觉感受。现在智能手机的硬件中融入了大量传感器。这些看不见的传感器，执行着手机日常应用中的很多重要功能，如自动调节亮度和自动横屏等。同时设计师们也开始利用这些感应器发挥创意，设计了各式实用的工具，使App的体验感和用户互动性更完美。

目前智能手机常见的传感器有触摸屏幕、摄像头、GPS、电子罗盘、重力感应器、加速传感器、光线传感器、距离传感器、气压传感器和三轴陀螺仪等。

1.7.1 摄像头

手机摄像头分为前置与后置，一般前置摄像头光圈较小，以两百万到三百万像素为主，一般在用户视频通话中使用。后置摄像头光圈比较大，拍摄质量更高。

案例：各种拍照类、摄像类应用都使用摄像头。在各类图片采集和视频采集过程中都使用摄像头，图1-25所示为美拍应用的拍摄界面。

1.7.2 麦克风

麦克风中含有的声波传感器，除了在用户日常通话中使用，在其他领域也广泛使用声波采集用户信息。

案例：图1-26所示为一款吹蜡烛应用，用户对着手机可以随意吹气，根据力量大小，蜡烛的烛光会产生不同的摇曳效果。通过声波传感器达到和现实的吹蜡烛一样的体验。该应用通过声波传感器感知吹气发出声波频率的大小，来模拟蜡烛烛光晃动的效果。

1.7.3 GPS

GPS（全球定位系统）的原理是测量出已知位置的卫星到用户手机传感器之间的距离，然后综合多颗卫星的数据就可以知道目前用户的具体位置。民用级GPS误差约3米。

案例一：各种地图类应用，通过GPS传感器可以快速定位用户的位置信息。

案例二：一些拍照记录类的应用，有时候会记录用户的位置信息，也是使用了GPS传感器。

1.7.4 电子罗盘

电子罗盘也叫方位传感器，是利用地磁场来定位北极的方法。利用磁阻传感器为罗盘数字化提供了帮助。电子罗盘配合GPS和地图使用时，可以快速定位方向。

案例：各种地图类应用。用户在使用地图时，手机可以借助GPS和手机网络基站的信号快速定位用户大概的区位。但不能准确知道用户具体所在的方向。例如，你现在想从A点到B点，不知道该往哪个方向走，这时候电子罗盘可以快速定位方向。可以准确地指示你面对的方向。

1.7.5 重力感应器

重力感应器由苹果公司率先开发，通过感知手机重心变化，来获取相关数据。用户把手机拿在手里是竖的，页面显示是竖的；当手机旋转90°横过来时，由于重心的变化，页面可随之旋转90°，从而横向显示。

案例一：三星Galaxy系列手机设计了一种独特的快速静音方式。如在开会或者不适宜接电话的场合，只要把手机翻转过来，屏幕朝下时手机自动进入静音模式。

案例二：苹果手机内置的“健康”应用也使用了重力感应器。它的计步功能准确性高，通过图表的形式显示每天行走的步数，如图1-27所示。

1.7.6 加速度传感器

加速度传感器能测量手机的加速度。当手机在任何方向上运动时，加速度传感器就会有信号输出，手机静止不动时加速度传感器则没有信号输出。加速度传感器还能测量手机在3个方向上的角度。应用可利用加速度传感器的信号判断手机的状态是平放，还是有一定角度，显示屏是向上还是向下。

案例一：bump应用就是用到了加速度传感器，两个手机轻轻一碰就完成了数据交换，如图1-28所示。

案例二：微信中的“摇一摇”功能，音乐应用中的“甩一甩”切换歌曲功能也是运用了加速度传感器。

1.7.7 光线传感器

光线传感器能检测环境的亮度。软件可以利用光线传感器的数据自动调节显示屏亮度。当环境亮度高时，显示屏亮度会相应调高；当环境亮度低时，显示屏亮度也会相应降低。

案例一：三星高端Galaxy型号手机能利用先进的光线传感器，独立地测量白、红、绿和蓝光的亮度。Adapt Display（适应显示）功能利用这些数据优化显示屏的画面质量。

案例二：用在一些阅读类的应用中。可以根据光线来自动调节显示屏的亮度，如晚上光线较弱时，屏幕亮度自动降低，减少手机屏幕强光对眼睛的刺激。

1.7.8 距离传感器

由一个红外LED灯和红外辐射光线探测器构成。距离传感器位于手机的听筒附近，手机靠近耳朵时，系统借助距离传感器知道用户在通电话，然后会关闭显示屏，防止用户因误操作影响通话。距离传感器的工作原理是，红外LED灯发出的不可见红外光由附近的物体反射后，被红外辐射光线探测器探测到。

案例：我们打电话的时候，手机屏幕会自动熄灭，而脸离开屏幕时，屏幕会自动开启。这样可以减少手机的电源消耗，以及防止失误操作。

1.7.9 气压传感器

气压传感器能测量气压。气压传感器的数据能用来判断手机所处位置的海拔高度，有助于提高GPS的精度。摩托罗拉XOOM和三星Galaxy Nexus是两款首批配置气压传感器的Android手机。

案例：在一些户外运动的App中，如图1-29所示，气压传感器可以快速测试出气压和海拔的数值。

1.7.10 三轴陀螺仪

三轴陀螺仪即同时测定6个方向的位置、移动轨迹和加速度。图1-30所示的是三轴陀螺仪的结构图。单轴的只能测量1个方向的量，也就是1个系统需要3个陀螺仪，而1个三轴的陀螺仪就能替代3个单轴的。三轴的体积小、重量轻、结构简单、可靠性好，这样手机可以获取到精度更高的角度信息。借助陀螺仪，手机可以判断在哪个方向上旋转了多少度。

案例一：iPhone 6 Plus的拍照光学防抖功能。在按快门时，陀螺仪记录手的抖动动作，将手的抖动反馈给图像处理器，避免了手的抖动对拍照质量的影响，可以抓拍到更清晰、稳定的图片。

案例二：GPS的惯性导航。当汽车行驶到隧道或城市高大建筑物附近，没有GPS信号时，可以通过陀螺仪来测量汽车的偏航或直线运动位移，从而继续导航。

案例三：通过动作感应控制游戏。可以通过陀螺仪对动作检测的结果（3D范围内手机的动作），去实现对游戏的操作。例如，把你的手机当作一个方向盘，你的手机屏幕上是一架飞行中的战斗机，只要你上下左右地倾斜手机，飞机就可以做上下左右的飞行动作。

由于智能手机中加入了各种传感器，手机变得越来越智能化。传感器回应用户的互动方式，使得传统平淡无奇的人机交互，变得像玩游戏一样新奇有趣，进而提高使用者的用户体验。同时手机应用生态系统不断继承创新扩展，基于传感器也会诞生更多有意思的应用。

未来数字媒体领域进入高速发展的阶段，层出不穷的新奇传感器涌入，我们需要对硬件的发展保持热切的关注。