android设计规范

android 人机界面指南

1Android 设计的依据 1.1框架结构及流程

是什么使得android 有着独特的用户体验?

后台处理支持多任务功能 正在进行和事件驱动的提示信息

通过Widgets 和live folders来实现实时信息的预览 用户想用时,任一应用程序都可以挑选和选择

android 不是关于程序的,它是关于活动,把任务分层,

1.2架构基础

硬件平台

当菜单没有开启,要把屏幕最大化时,菜单按钮可以在屏幕上提供更多的内容。返回按钮允许使用返回堆(back stack)。 竖屏与横屏

一般来说,用户界面开发竖屏与横屏。在新横屏也仍存在于新的Android 手机中。99%的android 布局支持横屏。 焦点和菜单

在触摸模式里没有焦点,只有轨迹球。Android平台里没有鼠标焦点。确定你从未显示焦点。主菜单应该包括全部功能;它们与活动联系一起形成整体。菜单上的图标按重要性排序。如果有多于5个图标,使用点击more menu菜单来查看那些不太重要的菜单项。上下文菜单(长按)集中在一个特定对象。总是把那些与所选项最相关的行为放在长按菜单的顶部。 需要记住的几点:

设计时要考虑速度和简洁

尽量分层来分等级 屏幕上的活动尽量最小

使用下载进度条,下载数据时,而不是让用户等待去看一个加载完全的页面。 考虑活动流而不是线性行为

android设备代表的是硬件和软件的完美组合。硬件辅助导航操作,并给android 提供更多更好的功能。

1.3屏幕上的行为

android设计了特定的行为方式。在你的应用程序里利用好这一点。应该坚持android 行为的标准,避免

混淆用户。

1.4表达

细节使得产品集中在细节。程序的美学会帮助你集中注意在那些应用体验核心的关键任务上。API DEMO是开始你的工具包的好地方。

2用户界面原则

这部分试图讲述创造一个好的用户界面的一些基本的交互设计原则。这些原则是基本的,不止能应用

于android 的用户界面设计,也可以应用于其他。苹果建议开发者花费60%的开发时间来进行设计工作。下面的用户界面原则将为好的设计提供一个基础。

2.1隐喻

隐喻是构建一个基于操作任务心智模型的模块;用它们来传递应用程序的概念和功能。基于真实世界的应用对象可以帮助用户很快的理解该应用程序。当你设计你的应用程序时,要注意andriod 中存在的隐喻,不要重新定义它们。同时,检查你的应用程序执行的任务,看是否有些自然隐喻你可以使用。

2.2反映用户的心智模型

用户已经有了一个来描述你的程序正在进行的任务的心智模型。这个心智模型产生于真实世界经验、其它软件和一般电脑基本知识的结合。比如说,用户在真实世界里有写字、寄信的经验,也会产生特定的期待,像写一封新的信,选一个接受者,然后寄出信。一个忽略用户心智模型的电子邮件程序用起来会很困难和不舒服。这是因为程序强加给用户一个不熟悉的概念模型,而不是建立一个用户已有的知识经验模式。

在设计程序用户界面之前,试着去发现你的用户的心智模型,这样帮助用户去执行任务。心智模型中内在的隐喻,它代表了任务的概念组成。在写信这个例子中,隐喻包括信件、邮包和信封。在涉及到照片的任务的思考模式中,隐喻包括照片、照相机和专辑。我们要努力地发现用户的期望,包括任务组成、组织、窗口布局的工作流、菜单和工具栏组织、控制面板的使用。 要通过努力地何必把个下面的特征与用户心智模型相融合: 熟悉性

用户的心智模型主要是建立在经验的基础上 简单化

一项任务的心智模型通常是流线型,关注任务的基本组成部分。尽管对于一个给定的任务有很多可选的细节,但是基本的组成部分占大部分,并且不会占用用户的注意。 可利用性Availability

避免components 在子菜单中过深的隐藏或者只在上下文菜单中可用。 发现性

通过提供怎样使用用户界面控件的线索来鼓励你的用户区发现一些功能。要鼓励通过做一些难以逆转或恢复的动作来发现。

2.3直接操作

直接操作意味着人们感觉他们正在控制一些可触的事情而不是抽象的。直接操作的好处是当用户可以直接操作对象时,他们能更好的明白自己操作的结果。iPhone 利用多点触控来提供给用户一种深刻的直接操作的感觉。android 可以通过合理的使用单点触控来提供给用户大部分直接操作的体验。为了在你的程序里加强直接操作的感觉,要确保:

当用户在屏幕上操作对象时,那些对象仍是可见的。 用户操作的结果要立即可见

2.4动画效果(Animation  )

在支持直接操作中,动画效果是很重要的。因为界面会像真实世界的物体那样予以反映,所以它会增加用户与设备的使用感。通过使用“狗耳朵”原则,可以给用户一种“突然感”。当一个狗停止跑动时会发生什么呢?它的耳朵会继续运行然后被反弹回来。要使你的用户界面有这种生动的感觉。比如说,当iPhone 切换到另一个程序或者接一个电话时,会停止播放音乐。 另一个例子是iphone 的table views和android 的list views的不同。当用户使用滚动条到达列表的底端时,滚动条会突然停在android 上,但是, 在iphone 上,如果这时继续向下拖动滚动条,滚动条会有反弹的效果。iphone 提供真实世界的感受,但android 没有,只是撞到墙上并立即停止。看起来是一件很小的事情,但在联系用户方面,却有很大不同。严肃的讲,使用iphone 一会,你就会喜欢上动画效果。

2.5看和点击

android应用程序比人优胜的地方在于,它能更好的记住列表选项、命令、数据等等。使用列表格式中

陈现选项,可以充分利用它的优势,使得用户可以很容易的浏览这些选项并进行选择。尽量减少文本输入。

2.6用户控制

让用户(而不是程序)来触发和控制动作. 要使动作简单直接,使用户可以容易的理解和记住。不论什么时候,只要有可能,就使用用户已经熟悉的标准控制和行为。它们的关键在于提供给用户他们需要的功能,同时帮助他们避免危险和不可逆转的动作. 比如说,如果用户可能会突然损坏数据,那么你就要提示一个警告,但是如果用户他们选择继续,那他们就可以继续操作。

2.7反馈和交流

在长时操作中,当用户操作时,他们需要及时的反馈和状态报告。你的程序应该提供一些可见的变化,这些变化根据每个用户的动作而变化。比如说,在列表中,当用户按下时,应该要高亮显示这个选项,使用户知道他们的触摸已被触发。动画效果是提供用户反馈的一种很好的方式。

2.8容错性(Forgiveness )

要通过建立容错性来鼓励用户探索你的应用程序,就是说,使每个动作很容易可逆。当用户操作一项任务,当一项任务会引起不可逆操作而丢失数据时,要出现一个警告来提示用户。要能预期常规的问题,然后警告用户那些潜在的负面影响。

2.9整体审美效果

整体美观是指信息被很好的组织,要根据视觉设计原则保持一致。也是关于整合了功能的应用程序的外观。外观对功能有很大影响。一个混乱或不合理的程序很难理解和使用。整体布局和用户界面元素

的设计都应该反映了用户使用应用程序任务时的心智模型。

2.10控制你程序的复杂性

开发易用软件的最好的方法就是使设计尽量简单。你的程序任务越复杂,保持用户界面简单和被注意到就越重要。

3 Android 的交互设计

Google Android OS 是一个拥有很多有趣功能的独特平台。如果开发者们想让他们的应用程序与android 体验融为一体,那么他们就应该尽量多使用这些功能。这部分将帮助开发者们更好的了解android 平台的交互设计。

3.1行为与任务

程序

一个android 应用程序主要由包括一个或多个行为流成,这些行为是相关的,但没有严格的界限。 行为

行为是android 程序主要组块. 你可以从你创造的行为 和其它android OS可用行为中装配一个应用程序。你创建的每个行为都应该被设计成只有一个用途,例如照相,查找通讯录,或读邮件。 显示用户界面的程序包括一个或多个行为。

当使用android 设备时,随着用户在用户界面移动,就会一个接一个的触发这些行为,对他们来说应该是一个无缝的体验、一个行为接一个行为,一个任务接一个任务。这就像前面提过的行为流一样。 要记住到任应该连在一起来形成一个整体并且是联系的用户界面。如果你的行为不遵循基本的交互设计原则,与系统行为流关联时,那么用户可能会因为缺少连续性而感到困惑和沮丧。 一个行为处理一个特定的内容(数据)类型,并且接受一系列相关的用户行为。 行为流Activity Stack

当用户从一个行为到另一个行为,通过程序,android 系统会以线性导航历史的形式记录用户已经访问过的行为。这就是行为流,也叫做返回流(back stack)。

总的来说,当用户开始一个新行为时,它就被加在行为流上,所以按返回键就会显示以前的行为. 然而,用户使用返回键只能返回到上一次行为直至首页,到首页后不能继续返回。

行为只是可以加到行为流 上的那些行为,但views, windows, menus, dialogs 这些都不能添加到行为流。 任务

一个任务是一系列行为组成,使用这些行为来实现用户的使用目标,不论这些行为属于哪个应用程序的。

直到一个新任务被明确的定义,所有的用户开始的行为都被认为是目前任务的一部分。

启动任务的行为称之为根行为(root activity),一般来说,任务通常从应用程序启动、桌面快捷方式或切换到“最近的任务”

用户可以和启动任务时一样,通过从root activity选择一个icon 来返回到任务。 中断任务

任务的一个很重要的功能是用户可以中断他们正在进行的任务,来进行另一个任务,同时,可以返回原来的任务,继续完成它。这就说,用户可以相继进行多个任务,然后在他们之间转换。

菜单设计

看菜单设计指南

icon  设计

看icon 设计指南

app  widget  design

看此部分指南

4 用户界面的设计

应该尽可能的使用android 提供的标准界面元素,并且遵循建议的用法。用户习惯了标准视图和控制的外观和行为。如果你使用标准界面元素,当用户学习使用你的程序时,他们就可以依靠他们以前的经验来帮助他们学习。

4.1状态栏

用法和行为Usage and Behavior

状态栏包含了重要的信息,包括电池状态、时间、网络和信号强弱等. 它也会对用户显示提示图标。尽

管你的程序可以隐藏状态栏 , 但是你应该认真考虑这种设计的结果。用户会期待可以在状态栏里看到信息。在iphone 里,程序可以使状态栏变得透明, 允许用户可以看到状态栏后的应用程序的窗口。在建议

除非有充分的理由,否则不要隐藏状态栏。 利用提示系统,并在状态栏里显示提示的图标。 工具栏(toolbar )

android中,你可以自定义状态栏的颜色。

4.2Tab  Widget

用法和行为Usage and Behavior

Tab Widget 会提供一个界面来导航不同视图。在程序里,tab 是可用的。它们可以作为应用程序除了菜

单之外的另一种导航方式。在同一数据源中,或整个应用程序所有功能的不同子任务,每一个tab 都应着不同的内容。在Iphone 中,此功能不叫tab widget ,而是叫tab bar, tab bar看起来要更友好,放在屏幕底部。 建议

bar widget不同于iphone 的Toolbar ,但这不意味着在列表页面必须要有bar widget。 在你的tab 里要用容易理解的灰阶图片。比如,android 的通讯录app 。

要文本结合图片,使得tab 的功能更容易理解。要确保文本很小,可以合适于tab. 是tab 数量最好是4个,多于4个会使得读和点击变得不容易。如果程序只是在横屏下使用,那么就要多加几个tabs.

如果你使用tab ,那么它们最大程度上对用户是可用的。如果在你的程序里移动它们,那么就会使界面变得不连续,用户会感到困惑。

例子

Code: HelloTabWidget

Application: Contacts

通讯录 app 充分利用了Tab Widget. 每个tab 都有一个简单的灰阶图片 和 t 文字, 使得用户可以很快

理解它们的功能。

注意这些tabs 使用 dialer, call log, contacts ,favorites 这些暗喻与用户心智模型连接非常匹配。

Sample: Too Many Tabs

除非这个程序只在横屏模式里用,否则tab 太多了。用户很难点击tab 或明白tab 的作用。

Sample: Tabs with List Views ???

4.3列表视图

用法和行为Usage and Behavior

Mainstay of Android programming. Can be used for drill down interfaces. Hook up to?

一个列表视图以单列多行的方式显示数据。每一列都包含了文本、图像和Controls 。列可以被分成几组。列表视图很有用,因为它们可以组织大量的数据。当用户选择了一个项目时,就会提供反馈。列表中的选项以短暂的高亮显示来显示已被选中,然后所选中的功能被触发. 你也可以注意到在上面显示的列表中,它的顶部使用了边缘的淡化效果(fading edges). android使用这项技术来显示当前页面是可以滚动的。列表视图是多功能的,可以被很多不同的用户界面使用。 选择项

列表视图可以显示一列选项,以供用户选择。一个选中标记图像可以显示目前列表中被选中的项。 导航的分层 信息

列表视图也可以被用来显示分层次信息,每一列都包含自己的子信息。Apple 把这项功能作为一个drill down 界面,经常在iphone 里使用。遗憾的是android 没有像iphone 那样的导航,可以在列表图顶端,分层drill down使导航变得容易。 查找索引信息

列表视图可以用来根据一个标准来按顺序显示信息(比如根据字母) 按概念把信息分组

我们可以把信息分组(例如工作、家庭、学校等)

建议

当选中信息时,用标识图片(checkmark image)来表示,而不是把整列都强调。 记住在竖屏模式下,list view widget显示更多列。

在触摸模式里,没有当前选中的项目(current item selection) 如果每一列都需要显示综合信息项,就要考虑用三栏布局。 示例

Code: HelloListView

Application: Email

google 在list view widget方面做得很好。一个三列的布局用来提升程序的可用性,而没有使用

零乱摆放的设计。在第一栏中可以激活一个多任务模型,会弹出一个三个按钮的工具栏。这个工具栏只有当列表视图里一个或多个选项背选中时才会出现。它可以允许用户在邮件箱里很快执行一个动作。用户也会发现推(push )菜单按钮会提供跟多邮件相关的选项。对于那些通过点击checkbox 而发现它的用户来说,这些功能是很好的。第二栏显示标题和邮件的发送者。你会注意到已读和未读的信息,它们的颜色是不一样的。颜色是一种很好的方式来显示更多的信息,而不用使用任何屏幕的硬件 . 第三栏允许用户提供一个更重要的邮件选项。它也会显示邮件信息收到的时间。

Application: Browser

History

浏览器中的历史标签时有可能的历史数量非常多。Google 用一个可扩展的列表来精简页面和帮助用户更容易的导航。你也可以注意到他们使用和Gmail 程序里相同的三栏布局。

4.4网格视图(Grid  view )

用法和行为Usage and Behavior 表格视图是用二维滚动网格来显示项目。这些的菜单选项从列表适应器(ListAdapter )中获得。 建议

In development…

4.5 Spinner

用法和行为Usage & Behavior 中的任意地方。列表视图格式里就会显示列表值。在使用spiner 时,会将用度怕注意从原来页面吸引过来。为了帮助用户意识到他们还没有离开UI ,spinner 会在屏幕上显示列表栩栩如生,悬浮在UI 的顶端。用户可以通过点击列中的任意位置来选中他们想要的值。然后spinner 列表会返回到原来页面,被选中的值就会在spinner 中显示。 建议

如果列表值不明显,就加一个题目来提醒用户。

不要多于16个值,这个用户就可以只用手指来滚动三次或少于三次。 Spinner 是支持下拉列表最理想的widget 。当用户想在spinner 中设置值时,他们可以点击spinner widget

Examples

Code: HelloSpinner

程序:日历 当在日历上加一个新项目时,用户点击Reminders Spinner,会出现一列可能的值。因为某种原因,在填充标题空间。所有spinner 都有标题或没有标题,这是保存标题一致性的好方法。

Calendar UI 里的下一个spinner 没有主题。在android 里,如果没有标题的话,那列表值就不会扩展区

Auto Complete

5 开发过程

STEP 0 – 阅读设计规范

STEP 1 – 决定开发什么

创建一个应用定位说明

描述成一个解决体系,而不是功能的罗列

总结应用的设计目标

定义主要的用户群

用来指导发展和筛选功能

示例:iphoto 的应用定位说明

Desktop: 对那些业余的摄影者来说,方便数码照片进行编辑、组织和分享

Iphone: 对iphone 用户来说,方便使用,易使用数码照片进行分享

了解你的用户

这个应用是为哪些用户设计的?

选一个小的用户群(或单个用户)

创建一个带有目标用户细节的人物角色,这个人物角色就像你自己一样。(例如:这个人是谁、典型的一天是怎么样的、他们是怎么操作任务的)

开发你的程序要以用户和他们的能力为依据,而不是电脑。

与你的用户交流这个非常重要

让用户参与你的设计每个过程

进行用户观察

设计一个成功的程序的最好方法就是为自己建一个程序。

提炼基本功能

每个功能的基本描述

选择尽量少数量的功能

使用应用定位说明进行过滤。

选择数量尽量少、但大多数用户频繁使用的功能,并且是适当移动状态下使用的。

STEP 2 – 访问APP Store或 Android Market

分析类似市场上相似产品的目标用户

那些是否竞争产品,或与你的应用功能是否有交叉?

那些竞争产品是否有或高或低转移成本?

确定已经确立的使用规范

移动用户的注意与学习跨度小

开发的应用要容易学习,支持已经学习的使用方法

学习好的应用

STEP 3 – 探索可能的解决方案

分析和定义用户的心智模型

发现用户使用应用相关任务时的心智模型或概念模型

在电脑上用户怎么操作相似任务?

用户在操作任务时,会有哪些概念、目标和手势?

应用human interface design principles

列出已经扩展功能的列表

给每个功能一个具体的描述

尽量少,好的设计是一个解决方案,而不是一些功能。

为你的80%用户设计,而其它用户可以进行自定义

使用应用定位说明和人物角色过滤功能

使用用户测试来获得反馈,发现哪些是功能是缺失的,哪些功能是多余的。

好的应用是:各个功能相互融合,是提供了一个解决方案

不以迷恋第一个设计

第一个设计绝不是一个最好的设计,尤其当你对这个平台是一个新手的时候。

STEP 4 – 绘草图

为你的应用设计10不同的方案草图

最后两三个是比较难想得出的,但最有创意的想法往往来自于哪几个

使用那些草图来获得目标用户或朋友的反馈

这样可以帮助你从10设计方案中选择出几个好的方案

质量来自于数量

通过多个设计方案,帮你更快速的获得更好的设计方案

STEP 5 –使用Omnigraffle 画原型图

使用最佳的尺寸大小(像素)进行页面布局\

开发者会精确地知道要创建多大

纸面原型,一个张纸呈现一张页面

用户可以在使用纸面上的应用

使用纸面原型进行观察性用户测试

原则:Fail early to succeed sooner

注意:Omnigraffle 只支持MAC 系统的软件,也可选择使用Fireworks 、Photoshop 、Visio 等相似软件。

STEP 6 –Do it all again

将“好的”扔到一边,重新开始(Its ok to throw it away and start again )

重新设计,这样可以避免重新写代码

投入整个开发时间的60%到设计工作,目前Apples 是这样做的

原则:Remember that nothing is precious

STEP 7 –代码开发

STEP 8 –beta测试

提交应用前进行测试

你的应用只会在最新应用中出现一次

如果因为小的Bug 导致用户对你的应用评分较低,这个情况是很难去改变的

哪些人参与Beta 测试?

朋友

Amazon Mechanical Turk (https://www.mturk.com)

原则:提交前进行测试

STEP 9 –发布

准备进行维护与Bug 修复

提炼应用的差异点

根据用户反馈进行迭代设计(必须准备好做这个事)

android 人机界面指南

1Android 设计的依据 1.1框架结构及流程

是什么使得android 有着独特的用户体验?

后台处理支持多任务功能 正在进行和事件驱动的提示信息

通过Widgets 和live folders来实现实时信息的预览 用户想用时,任一应用程序都可以挑选和选择

android 不是关于程序的,它是关于活动,把任务分层,

1.2架构基础

硬件平台

当菜单没有开启,要把屏幕最大化时,菜单按钮可以在屏幕上提供更多的内容。返回按钮允许使用返回堆(back stack)。 竖屏与横屏

一般来说,用户界面开发竖屏与横屏。在新横屏也仍存在于新的Android 手机中。99%的android 布局支持横屏。 焦点和菜单

在触摸模式里没有焦点,只有轨迹球。Android平台里没有鼠标焦点。确定你从未显示焦点。主菜单应该包括全部功能;它们与活动联系一起形成整体。菜单上的图标按重要性排序。如果有多于5个图标,使用点击more menu菜单来查看那些不太重要的菜单项。上下文菜单(长按)集中在一个特定对象。总是把那些与所选项最相关的行为放在长按菜单的顶部。 需要记住的几点:

设计时要考虑速度和简洁

尽量分层来分等级 屏幕上的活动尽量最小

使用下载进度条,下载数据时,而不是让用户等待去看一个加载完全的页面。 考虑活动流而不是线性行为

android设备代表的是硬件和软件的完美组合。硬件辅助导航操作,并给android 提供更多更好的功能。

1.3屏幕上的行为

android设计了特定的行为方式。在你的应用程序里利用好这一点。应该坚持android 行为的标准,避免

混淆用户。

1.4表达

细节使得产品集中在细节。程序的美学会帮助你集中注意在那些应用体验核心的关键任务上。API DEMO是开始你的工具包的好地方。

2用户界面原则

这部分试图讲述创造一个好的用户界面的一些基本的交互设计原则。这些原则是基本的,不止能应用

于android 的用户界面设计,也可以应用于其他。苹果建议开发者花费60%的开发时间来进行设计工作。下面的用户界面原则将为好的设计提供一个基础。

2.1隐喻

隐喻是构建一个基于操作任务心智模型的模块;用它们来传递应用程序的概念和功能。基于真实世界的应用对象可以帮助用户很快的理解该应用程序。当你设计你的应用程序时,要注意andriod 中存在的隐喻,不要重新定义它们。同时,检查你的应用程序执行的任务,看是否有些自然隐喻你可以使用。

2.2反映用户的心智模型

用户已经有了一个来描述你的程序正在进行的任务的心智模型。这个心智模型产生于真实世界经验、其它软件和一般电脑基本知识的结合。比如说,用户在真实世界里有写字、寄信的经验,也会产生特定的期待,像写一封新的信,选一个接受者,然后寄出信。一个忽略用户心智模型的电子邮件程序用起来会很困难和不舒服。这是因为程序强加给用户一个不熟悉的概念模型,而不是建立一个用户已有的知识经验模式。

在设计程序用户界面之前,试着去发现你的用户的心智模型,这样帮助用户去执行任务。心智模型中内在的隐喻,它代表了任务的概念组成。在写信这个例子中,隐喻包括信件、邮包和信封。在涉及到照片的任务的思考模式中,隐喻包括照片、照相机和专辑。我们要努力地发现用户的期望,包括任务组成、组织、窗口布局的工作流、菜单和工具栏组织、控制面板的使用。 要通过努力地何必把个下面的特征与用户心智模型相融合: 熟悉性

用户的心智模型主要是建立在经验的基础上 简单化

一项任务的心智模型通常是流线型,关注任务的基本组成部分。尽管对于一个给定的任务有很多可选的细节,但是基本的组成部分占大部分,并且不会占用用户的注意。 可利用性Availability

避免components 在子菜单中过深的隐藏或者只在上下文菜单中可用。 发现性

通过提供怎样使用用户界面控件的线索来鼓励你的用户区发现一些功能。要鼓励通过做一些难以逆转或恢复的动作来发现。

2.3直接操作

直接操作意味着人们感觉他们正在控制一些可触的事情而不是抽象的。直接操作的好处是当用户可以直接操作对象时,他们能更好的明白自己操作的结果。iPhone 利用多点触控来提供给用户一种深刻的直接操作的感觉。android 可以通过合理的使用单点触控来提供给用户大部分直接操作的体验。为了在你的程序里加强直接操作的感觉,要确保:

当用户在屏幕上操作对象时,那些对象仍是可见的。 用户操作的结果要立即可见

2.4动画效果(Animation  )

在支持直接操作中,动画效果是很重要的。因为界面会像真实世界的物体那样予以反映,所以它会增加用户与设备的使用感。通过使用“狗耳朵”原则,可以给用户一种“突然感”。当一个狗停止跑动时会发生什么呢?它的耳朵会继续运行然后被反弹回来。要使你的用户界面有这种生动的感觉。比如说,当iPhone 切换到另一个程序或者接一个电话时,会停止播放音乐。 另一个例子是iphone 的table views和android 的list views的不同。当用户使用滚动条到达列表的底端时,滚动条会突然停在android 上,但是, 在iphone 上,如果这时继续向下拖动滚动条,滚动条会有反弹的效果。iphone 提供真实世界的感受,但android 没有,只是撞到墙上并立即停止。看起来是一件很小的事情,但在联系用户方面,却有很大不同。严肃的讲,使用iphone 一会,你就会喜欢上动画效果。

2.5看和点击

android应用程序比人优胜的地方在于,它能更好的记住列表选项、命令、数据等等。使用列表格式中

陈现选项,可以充分利用它的优势,使得用户可以很容易的浏览这些选项并进行选择。尽量减少文本输入。

2.6用户控制

让用户(而不是程序)来触发和控制动作. 要使动作简单直接,使用户可以容易的理解和记住。不论什么时候,只要有可能,就使用用户已经熟悉的标准控制和行为。它们的关键在于提供给用户他们需要的功能,同时帮助他们避免危险和不可逆转的动作. 比如说,如果用户可能会突然损坏数据,那么你就要提示一个警告,但是如果用户他们选择继续,那他们就可以继续操作。

2.7反馈和交流

在长时操作中,当用户操作时,他们需要及时的反馈和状态报告。你的程序应该提供一些可见的变化,这些变化根据每个用户的动作而变化。比如说,在列表中,当用户按下时,应该要高亮显示这个选项,使用户知道他们的触摸已被触发。动画效果是提供用户反馈的一种很好的方式。

2.8容错性(Forgiveness )

要通过建立容错性来鼓励用户探索你的应用程序,就是说,使每个动作很容易可逆。当用户操作一项任务,当一项任务会引起不可逆操作而丢失数据时,要出现一个警告来提示用户。要能预期常规的问题,然后警告用户那些潜在的负面影响。

2.9整体审美效果

整体美观是指信息被很好的组织,要根据视觉设计原则保持一致。也是关于整合了功能的应用程序的外观。外观对功能有很大影响。一个混乱或不合理的程序很难理解和使用。整体布局和用户界面元素

的设计都应该反映了用户使用应用程序任务时的心智模型。

2.10控制你程序的复杂性

开发易用软件的最好的方法就是使设计尽量简单。你的程序任务越复杂,保持用户界面简单和被注意到就越重要。

3 Android 的交互设计

Google Android OS 是一个拥有很多有趣功能的独特平台。如果开发者们想让他们的应用程序与android 体验融为一体,那么他们就应该尽量多使用这些功能。这部分将帮助开发者们更好的了解android 平台的交互设计。

3.1行为与任务

程序

一个android 应用程序主要由包括一个或多个行为流成,这些行为是相关的,但没有严格的界限。 行为

行为是android 程序主要组块. 你可以从你创造的行为 和其它android OS可用行为中装配一个应用程序。你创建的每个行为都应该被设计成只有一个用途,例如照相,查找通讯录,或读邮件。 显示用户界面的程序包括一个或多个行为。

当使用android 设备时,随着用户在用户界面移动,就会一个接一个的触发这些行为,对他们来说应该是一个无缝的体验、一个行为接一个行为,一个任务接一个任务。这就像前面提过的行为流一样。 要记住到任应该连在一起来形成一个整体并且是联系的用户界面。如果你的行为不遵循基本的交互设计原则,与系统行为流关联时,那么用户可能会因为缺少连续性而感到困惑和沮丧。 一个行为处理一个特定的内容(数据)类型,并且接受一系列相关的用户行为。 行为流Activity Stack

当用户从一个行为到另一个行为,通过程序,android 系统会以线性导航历史的形式记录用户已经访问过的行为。这就是行为流,也叫做返回流(back stack)。

总的来说,当用户开始一个新行为时,它就被加在行为流上,所以按返回键就会显示以前的行为. 然而,用户使用返回键只能返回到上一次行为直至首页,到首页后不能继续返回。

行为只是可以加到行为流 上的那些行为,但views, windows, menus, dialogs 这些都不能添加到行为流。 任务

一个任务是一系列行为组成,使用这些行为来实现用户的使用目标,不论这些行为属于哪个应用程序的。

直到一个新任务被明确的定义,所有的用户开始的行为都被认为是目前任务的一部分。

启动任务的行为称之为根行为(root activity),一般来说,任务通常从应用程序启动、桌面快捷方式或切换到“最近的任务”

用户可以和启动任务时一样,通过从root activity选择一个icon 来返回到任务。 中断任务

任务的一个很重要的功能是用户可以中断他们正在进行的任务,来进行另一个任务,同时,可以返回原来的任务,继续完成它。这就说,用户可以相继进行多个任务,然后在他们之间转换。

菜单设计

看菜单设计指南

icon  设计

看icon 设计指南

app  widget  design

看此部分指南

4 用户界面的设计

应该尽可能的使用android 提供的标准界面元素,并且遵循建议的用法。用户习惯了标准视图和控制的外观和行为。如果你使用标准界面元素,当用户学习使用你的程序时,他们就可以依靠他们以前的经验来帮助他们学习。

4.1状态栏

用法和行为Usage and Behavior

状态栏包含了重要的信息,包括电池状态、时间、网络和信号强弱等. 它也会对用户显示提示图标。尽

管你的程序可以隐藏状态栏 , 但是你应该认真考虑这种设计的结果。用户会期待可以在状态栏里看到信息。在iphone 里,程序可以使状态栏变得透明, 允许用户可以看到状态栏后的应用程序的窗口。在建议

除非有充分的理由,否则不要隐藏状态栏。 利用提示系统,并在状态栏里显示提示的图标。 工具栏(toolbar )

android中,你可以自定义状态栏的颜色。

4.2Tab  Widget

用法和行为Usage and Behavior

Tab Widget 会提供一个界面来导航不同视图。在程序里,tab 是可用的。它们可以作为应用程序除了菜

单之外的另一种导航方式。在同一数据源中,或整个应用程序所有功能的不同子任务,每一个tab 都应着不同的内容。在Iphone 中,此功能不叫tab widget ,而是叫tab bar, tab bar看起来要更友好,放在屏幕底部。 建议

bar widget不同于iphone 的Toolbar ,但这不意味着在列表页面必须要有bar widget。 在你的tab 里要用容易理解的灰阶图片。比如,android 的通讯录app 。

要文本结合图片,使得tab 的功能更容易理解。要确保文本很小,可以合适于tab. 是tab 数量最好是4个,多于4个会使得读和点击变得不容易。如果程序只是在横屏下使用,那么就要多加几个tabs.

如果你使用tab ,那么它们最大程度上对用户是可用的。如果在你的程序里移动它们,那么就会使界面变得不连续,用户会感到困惑。

例子

Code: HelloTabWidget

Application: Contacts

通讯录 app 充分利用了Tab Widget. 每个tab 都有一个简单的灰阶图片 和 t 文字, 使得用户可以很快

理解它们的功能。

注意这些tabs 使用 dialer, call log, contacts ,favorites 这些暗喻与用户心智模型连接非常匹配。

Sample: Too Many Tabs

除非这个程序只在横屏模式里用,否则tab 太多了。用户很难点击tab 或明白tab 的作用。

Sample: Tabs with List Views ???

4.3列表视图

用法和行为Usage and Behavior

Mainstay of Android programming. Can be used for drill down interfaces. Hook up to?

一个列表视图以单列多行的方式显示数据。每一列都包含了文本、图像和Controls 。列可以被分成几组。列表视图很有用,因为它们可以组织大量的数据。当用户选择了一个项目时,就会提供反馈。列表中的选项以短暂的高亮显示来显示已被选中,然后所选中的功能被触发. 你也可以注意到在上面显示的列表中,它的顶部使用了边缘的淡化效果(fading edges). android使用这项技术来显示当前页面是可以滚动的。列表视图是多功能的,可以被很多不同的用户界面使用。 选择项

列表视图可以显示一列选项,以供用户选择。一个选中标记图像可以显示目前列表中被选中的项。 导航的分层 信息

列表视图也可以被用来显示分层次信息,每一列都包含自己的子信息。Apple 把这项功能作为一个drill down 界面,经常在iphone 里使用。遗憾的是android 没有像iphone 那样的导航,可以在列表图顶端,分层drill down使导航变得容易。 查找索引信息

列表视图可以用来根据一个标准来按顺序显示信息(比如根据字母) 按概念把信息分组

我们可以把信息分组(例如工作、家庭、学校等)

建议

当选中信息时,用标识图片(checkmark image)来表示,而不是把整列都强调。 记住在竖屏模式下,list view widget显示更多列。

在触摸模式里,没有当前选中的项目(current item selection) 如果每一列都需要显示综合信息项,就要考虑用三栏布局。 示例

Code: HelloListView

Application: Email

google 在list view widget方面做得很好。一个三列的布局用来提升程序的可用性,而没有使用

零乱摆放的设计。在第一栏中可以激活一个多任务模型,会弹出一个三个按钮的工具栏。这个工具栏只有当列表视图里一个或多个选项背选中时才会出现。它可以允许用户在邮件箱里很快执行一个动作。用户也会发现推(push )菜单按钮会提供跟多邮件相关的选项。对于那些通过点击checkbox 而发现它的用户来说,这些功能是很好的。第二栏显示标题和邮件的发送者。你会注意到已读和未读的信息,它们的颜色是不一样的。颜色是一种很好的方式来显示更多的信息,而不用使用任何屏幕的硬件 . 第三栏允许用户提供一个更重要的邮件选项。它也会显示邮件信息收到的时间。

Application: Browser

History

浏览器中的历史标签时有可能的历史数量非常多。Google 用一个可扩展的列表来精简页面和帮助用户更容易的导航。你也可以注意到他们使用和Gmail 程序里相同的三栏布局。

4.4网格视图(Grid  view )

用法和行为Usage and Behavior 表格视图是用二维滚动网格来显示项目。这些的菜单选项从列表适应器(ListAdapter )中获得。 建议

In development…

4.5 Spinner

用法和行为Usage & Behavior 中的任意地方。列表视图格式里就会显示列表值。在使用spiner 时,会将用度怕注意从原来页面吸引过来。为了帮助用户意识到他们还没有离开UI ,spinner 会在屏幕上显示列表栩栩如生,悬浮在UI 的顶端。用户可以通过点击列中的任意位置来选中他们想要的值。然后spinner 列表会返回到原来页面,被选中的值就会在spinner 中显示。 建议

如果列表值不明显,就加一个题目来提醒用户。

不要多于16个值,这个用户就可以只用手指来滚动三次或少于三次。 Spinner 是支持下拉列表最理想的widget 。当用户想在spinner 中设置值时,他们可以点击spinner widget

Examples

Code: HelloSpinner

程序:日历 当在日历上加一个新项目时,用户点击Reminders Spinner,会出现一列可能的值。因为某种原因,在填充标题空间。所有spinner 都有标题或没有标题,这是保存标题一致性的好方法。

Calendar UI 里的下一个spinner 没有主题。在android 里,如果没有标题的话,那列表值就不会扩展区

Auto Complete

5 开发过程

STEP 0 – 阅读设计规范

STEP 1 – 决定开发什么

创建一个应用定位说明

描述成一个解决体系,而不是功能的罗列

总结应用的设计目标

定义主要的用户群

用来指导发展和筛选功能

示例:iphoto 的应用定位说明

Desktop: 对那些业余的摄影者来说,方便数码照片进行编辑、组织和分享

Iphone: 对iphone 用户来说,方便使用,易使用数码照片进行分享

了解你的用户

这个应用是为哪些用户设计的?

选一个小的用户群(或单个用户)

创建一个带有目标用户细节的人物角色,这个人物角色就像你自己一样。(例如:这个人是谁、典型的一天是怎么样的、他们是怎么操作任务的)

开发你的程序要以用户和他们的能力为依据,而不是电脑。

与你的用户交流这个非常重要

让用户参与你的设计每个过程

进行用户观察

设计一个成功的程序的最好方法就是为自己建一个程序。

提炼基本功能

每个功能的基本描述

选择尽量少数量的功能

使用应用定位说明进行过滤。

选择数量尽量少、但大多数用户频繁使用的功能,并且是适当移动状态下使用的。

STEP 2 – 访问APP Store或 Android Market

分析类似市场上相似产品的目标用户

那些是否竞争产品,或与你的应用功能是否有交叉?

那些竞争产品是否有或高或低转移成本?

确定已经确立的使用规范

移动用户的注意与学习跨度小

开发的应用要容易学习,支持已经学习的使用方法

学习好的应用

STEP 3 – 探索可能的解决方案

分析和定义用户的心智模型

发现用户使用应用相关任务时的心智模型或概念模型

在电脑上用户怎么操作相似任务?

用户在操作任务时,会有哪些概念、目标和手势?

应用human interface design principles

列出已经扩展功能的列表

给每个功能一个具体的描述

尽量少,好的设计是一个解决方案,而不是一些功能。

为你的80%用户设计,而其它用户可以进行自定义

使用应用定位说明和人物角色过滤功能

使用用户测试来获得反馈,发现哪些是功能是缺失的,哪些功能是多余的。

好的应用是:各个功能相互融合,是提供了一个解决方案

不以迷恋第一个设计

第一个设计绝不是一个最好的设计,尤其当你对这个平台是一个新手的时候。

STEP 4 – 绘草图

为你的应用设计10不同的方案草图

最后两三个是比较难想得出的,但最有创意的想法往往来自于哪几个

使用那些草图来获得目标用户或朋友的反馈

这样可以帮助你从10设计方案中选择出几个好的方案

质量来自于数量

通过多个设计方案,帮你更快速的获得更好的设计方案

STEP 5 –使用Omnigraffle 画原型图

使用最佳的尺寸大小(像素)进行页面布局\

开发者会精确地知道要创建多大

纸面原型,一个张纸呈现一张页面

用户可以在使用纸面上的应用

使用纸面原型进行观察性用户测试

原则:Fail early to succeed sooner

注意:Omnigraffle 只支持MAC 系统的软件,也可选择使用Fireworks 、Photoshop 、Visio 等相似软件。

STEP 6 –Do it all again

将“好的”扔到一边,重新开始(Its ok to throw it away and start again )

重新设计,这样可以避免重新写代码

投入整个开发时间的60%到设计工作,目前Apples 是这样做的

原则:Remember that nothing is precious

STEP 7 –代码开发

STEP 8 –beta测试

提交应用前进行测试

你的应用只会在最新应用中出现一次

如果因为小的Bug 导致用户对你的应用评分较低,这个情况是很难去改变的

哪些人参与Beta 测试?

朋友

Amazon Mechanical Turk (https://www.mturk.com)

原则:提交前进行测试

STEP 9 –发布

准备进行维护与Bug 修复

提炼应用的差异点

根据用户反馈进行迭代设计(必须准备好做这个事)


相关文章

  • 挑剔的iOS,还是快速增长的Android
  • 收费与免费.封闭和开放,筛选后更有消费潜质的忠诚用户还是参差不齐而汇集的大众用户群,如果从用户数量上看,Android平台更有优势,但如果想拥有更优质的用户,iOS平台无疑是最佳选择. 根据Juraptap一份移动数据报告表明,2012年1 ...查看


  • 移动办公系统建设方案
  • 无锡市北塘区政府移动办公系统 建设方案 2014年11月 目 录 一. 项目概述 . ............................................................................. ...查看


  • 基于安卓系统的游戏开发与实现
  • XX大学 毕业设计(论文) 院 系: 信息工程学院 专 业: 计算机科学与技术 班 级: 学生姓名: XX 学 号: XXXXXXX 导师姓名: XXXX 职称: 讲师 起止时间: 2014 年 3月 1 日至 2014年 5月31日 XX ...查看


  • Nexus系列手机发展历程
  • 网易手机原创稿件,转载请注明出处. 投票 投票加载中... 北京时间10月16日凌晨,谷歌发布了全新Nexus 6智能手机以及Android 5.0系统正式版,以及Nexus 9平板/Nexus Player两款硬件设备,此次Google的 ...查看


  • 中国移动游戏基地Android游戏SDK使用说明
  • 游戏基地Android游戏SDK 使用说明 中国移动游戏基地 2013年10月31日 版本历史 目录 1 引言................................................................. ...查看


  • 软件综合课程设计报告
  • 用软件综合课程设计报告 题目名称: 出行管家 班 级: 学生学号: 学生姓名: 同组学生学号: 同组学生姓名: 同组学生学号: 同组学生姓名: 指导老师: 程序成绩: 报告成绩: 总 成 绩: 优 良 中 及格 不及格 2014年 12 月 ...查看


  • 新浪微博毕业论文
  • 2015届本科毕业论文(设计) 新浪微博客户端部分功能的实现 姓 名: xxxxxxxx 系 别: 计算机与信息技术学院 专 业: 网络安全 学 号: xxxxxxxx 指导教师: xxxxxxx 2015 年 04 月 16 日 目 录 ...查看


  • 基于安卓的安全卫士本科毕业设计论文
  • 摘 要 在移动互联网飞速发展的今天,智能手机成了人们沟通交流.了解外部信息的重要工具.从某种程度上说,智能手机相当于小型PC,其中有71.6%为Android手机用户.Android平台的的开源性使得市场上各种手机智能软件日益增多并且混乱, ...查看


  • Android实训报告
  • Android 学院:****** 班级:****** 学号:****** 姓名:****** 实训报告 目录 一.实训背景及目的要求 .................................................... ...查看


热门内容