【凯子哥带你夯实应用层】Android的Google官方设计指南（上）

Android 设计规范

• 时间 2015.3.2
• 版本 V1.0
• 翻译 杨鹏
• 整理 赵凯强

1.设计原则

本页对android design需要牢记的3个目标:

• Enchant me(使我愉悦)
• Simplify my life(简化我的生活)
• Make me amazing(让我感到惊喜)

详细阐述了其内涵。

1.1 Enchant me

• 通过令人惊讶的方式使人愉悦 —— 漂亮的界面，仔细安排的动画或者合适的声音效果
• 真实的对象比菜单和按钮更有趣
• 用户喜欢个性化的印记，这样使他们有归属感，觉得一切尽在掌握。除了提供一个合理而漂亮的默认设置，还应该在不干扰主要任务的前提下，为趣味性而给可选的个性化留有空间。
• 手机应对用户的操作有自学习能力，以输入法的自动联想为例，不要每次都给相同的选项，应该让用户优先选择上次输入的。

1.2 Simplify my life

• 保持简洁 —— 使用简单的短语。如果句子很长，人们总是会忽略它们。
• 图片比文字更容易理解——尽量使用图片去解释想法。图片可以吸引人们注意并且更容易理解。
• 帮我做决定，但让我来拍板。首先尝试猜测用户的选择并直接切入正题，而不是询问用户。太多的选择和决定使人们感到不爽。但是万一猜错了，允许“撤销”操作。
• 只在我需要时，展示我所需要的。人们在同时看到许多选择时就会手足无措。把任务和信息分拆成细小、容易理解的步骤。将当前并非必要的选项隐藏起来，并让人们慢慢学习。
• 让我知道现在在哪儿。在应中很明显的地方（如返回键图标），屏幕切换时候使用过渡画面来表明各屏幕页面之间的关系。提供任务进度反馈（比如进度条）。
• 不要弄丢我的东西。将人们花时间做出来的东西保存起来，并且可以随时随地获取。记住设置、个人风格、用户创建的东西，在手机、平板和各个电脑间同步。使升级变成地球上最容易的事情。
• 如果界面看起来一样的话，行为也要一样。通过独特而不是微妙的视觉设计，帮助人们识别功能上的不同。不要使看起来相同的页面在相同的输入下却得到不同的结果。
• 只在重要的时候打断客户操作。好的应用就像一个好的个人助理，帮助人们摆脱各种琐事。用户想要保持专注，除非是紧急或者有时效性的事情，才能打断他们。中断用户正常操作很消耗精力而且令人沮丧。

1.3 Make me amazing

• 支持通用的小技巧。当用户人们自己搞明白什么事情的时候，会感觉很好。通过使用其它Android应用已有的视觉模式和通用的方法，让您的应用更容易上手。例如，滑动手势就是一种很好的页面导航快捷方式。
• 错不在用户。当您提示人们做出改正时，要保持和蔼和耐心。当使用您的应用时，用户希望觉得到自己的聪明，而不是一个笨蛋。如果哪里错了，提示清晰的恢复方法，但不要让他们去处理技术上的细节。如果应用能悄悄的搞定问题，那最好不过了。
• 给予鼓励。将复杂的任务分解一个个很容易地完成的小步骤。在操作上给予反馈，哪怕仅仅是个微小的光晕。
• 帮我做复杂的事情。通过完成自己原本无法完成的任务，让新手觉得自己像个专家一样。例如，通过几个简单步骤，加入几种照片特效，就能使得摄影新手的照片也很出色。
• 分清主次——对重要的事情要能够快速完成（有更大的优化价值） 不是所有的操作都一样重要。事先决定好您的应用中什么是最重要的，让这个功能找起来容易，用起来顺手，例如相机的快门和音乐播放器的暂停按钮。

2.UI概述

Android的system UI为构建您自己的应用提供了基础的框架。主要包括主屏幕 (Home Screen)、全局设备导航和通知系统(Notifications)。您的应用对于保持统一和美观的 Android 使用体验将起到重要的作用。本章的最后，我们将介绍在您的应用中应具有的基本元素。通过阅读本章，您将会对 Android 用户界面里最重要的部分有一个大体的认识。

2.1主屏幕，所有应用，最近应用

• 主屏幕 (Home) 是一个可以自定义的放置应用图标、目录和小工具 (widget) 的地方。通过左右滑动切换不同的主屏幕面板。收藏栏在屏幕的底部，无论怎么切换面板，它都会一直显示对您最重要的图标和目录。通过点击收藏栏中间的“所有应用”按钮打开所有的应用和小工具展示界面。
• “所有应用”界面可以浏览所有安装在您设备上的应用和小工具。用户可以在“所有应用”中通过拖动图标，把应用或小工具放置在主屏幕的空白区域。
• “最近的应用”提供了一个高效的方式去切换最近使用的应用。它能为正在运行的任务提供清晰的导航。“最近应用”按钮放置在导航栏的右边，点击后将会显示最近用户使用的应用。它们按照时间顺序排列，最近的放在最下面。点击将切换到该应用，左右滑动则可以将其移除。

2.2系统栏

UI 栏是屏幕上专门用于显示通知、设备通信状态和设备导航的区域。通常 UI 栏会一直和您的应用一起显示。而当应用需要全屏显示，例如播放电影和浏览图片的时候，可以临时隐藏 UI 栏，免去不必要的干扰。

1. 状态栏：左边显示等待操作的通知，右边显示时间、电量以及信 强度等。向下滑动状态栏滑将显示通知的细节。
2. 导航栏：Android 4.0 新为手机而设计的导航栏，当设备没有传统的物理按键时才会显示。这里显示返回、主屏幕和最近应用按钮，当运行为 Android 2.3 或更早的系统所设计的应用时，还会显示菜单按钮。
3. 组合栏：在平板上可以将状态栏和导航栏结合在一起。

2.4通用APP组件

典型的Android应用由操作栏（Action Bar）和应用内容区域组成。

1. 主操作栏：您应用的命令和控制中心。操作栏包括您应用内的导航和最主要的操作。
2. 视图控制按钮：使用户可以在您的应用提供的视图之间切换。视图通常由不同的数据和您应用中不同的功能组成。
3. 内容区域：您的应用主要内容的显示区域。
4. 副操作栏：提供了放置更多操作的空间，它可以放在主操作栏下面或者屏幕的底部。这个例子中，副操作栏将一些不适合放在主操作栏的功能放置在屏幕底部。

那么您应当如何开始为多种屏幕设计呢种方法是以一个基本的标准 (中等尺寸，MDPI) 开始，之后将其缩放到不同的尺寸。另一种方法是从最大的屏幕尺寸开始，之后为小屏幕去掉一些 UI 元素。

4.主题

主题是一种使得 Android 应用保持统一风格的机制。风格样式定义了各种构建用户界面所需要的视觉元素，包括颜色、高度、边界填充和字体大小。为了提升各种应用的统一性，Android 为您在冰淇淋三明治 (Ice Cream Sandwich) 上设计的应用提供了三种系统主题:

• Holo Light
• Holo Dark
• Holo Light with dark action bars

将这些主题应用于您的设计中将使得您的应用很好的和 Android 设计语言融合起来。

为您应用选择一款适合的其功能和设计美学的系统主题。如果您希望使您的应用看起来更加与众不同，那么从某一款系统主题开始您自己的定制设计比较好。系统主题为您实现自己的视觉效果提供了一个坚实的基础。
直接修改系统的这3个主题，可能是会引起很大争议的处理方式。一方面她保证了安装的高质量第三方软件（遵循本指南设计的应用）有着和本地应用一致的外观，另一方面，她修改了android原有的统一性，很可能会提供一个不完整的独特style。

5.2交流

当界面上的操作对象需要对复杂的手势做出响应时，应当能够帮助用户了解该操作的结果将会是什么。例如，在最近应用（Recents）界面，当用户开始按住一个应用缩略图并左右滑动的时候，该条目就开始变得暗淡。这样做可以使得用户明白滑动可以移除该应用条目。

6.度量单位和 格

设备之间除了屏幕物理尺寸不同，屏幕的像素密度 (DPI) 也不一样。为了简化您为不同的屏幕而设计的复杂度，可以将不同的设备按照大小和像素密度分类。按设备大小的两个类别分别是手持设备 (小于 600 dp) 和 平板 (大于等于 600dp)。按像素密度分类的类别有 LDPI、MDPI、HDPI 和 XHDPI。为不同的设备优化您的应用界面，为不同的像素密度提供不同的位图。

600dp大致对应3.75英寸的物理尺寸（约95mm，160dp为1英寸，按照下图应为屏幕宽度），公司T958（4.5吋）屏幕宽约 56mm，Samsung Notes屏幕宽约71mm；公司370 pad宽约90mm，470宽约95mm。从上述数据看，pad和手机的区别还是挺大的。

空间方面的考虑,不同的设备可显示的 dp (density-independent pixels) 数量（对应可显示空间）也不相同。

注意留白,界面元素之间的留白应当是 8dp。

上图信息非常丰富，列表前面的图片应设计为32dp的，该图片上下左右都应该是8dp的留白，而目前代码中充斥着5、10、15之类随意的边界留白值。

字体大小上的不同可以创造出有序和容易理解的布局。不过在同一个界面中使用过多的字体大小则会造成混乱。Android 设计框架建议您使用以下几种字体大小:

9.图标

图标就是屏幕上一个真正的小图片，它直观的为一个操作、一种状态或一个应用提供了第一印象。

本页详细描述了launcher、action bar、contextual、notification这4类图标的整体及真正有图区域的大小、设计风格、颜色等信息，新设计的图标应尽可能遵循这些要求——当前我们的手机设计感觉上基本无视这些规则。

9.1 Launcher

启动图标在“主屏幕”和“所有应用”中代表您的应用。因为用户可以设置“主屏幕”的壁纸，所以要确保您的启动图标在任何背景上都清晰可见。

• 大小和缩放。移动设备上的启动图标大小必须是 48×48 dp。在 Google 市场 (Market) 中显示的启动图标必须是 512×512 像素。
• 内容。不要留白，48x48dp
• 样式。如下图所示，使用一个独特的剪影——三维的正面视图，看起来稍微有点从上往下的透视效果，使用户能看到一些景深。