Android菜单设计指南

Android菜单设计指南

菜单设计快速预览


•任何指令的选项菜单只适用于当前进程.

•任何指令的关联菜单只适用于当前被选中项.

•优先安放最频繁使用的操作.

•仅将最重要的指令固定在屏幕上.

•长按（touch&hold）屏幕可触发关联菜单,并且可正常点击关联菜单上的指令.

文档目录


菜单纵览


1.选项菜单

2.关联菜单

3.选项菜单与关联菜单的区别

4.屏幕上的固定指令
指南


1.分离全局指令的特定选项

2.优先安放最频繁使用的操作

3.不要仅在关联菜单上安放指令

4.关联菜单的首项指令应是最直观的

5.直接点选内容应执行最直观的操作

6.关联菜单和被选中项须有所联系

7.仅将最重要的指令固定在屏幕上

8.选项图标菜单多使用短名称

9.对话框不该有选项菜单

10.如果进程无选项菜单,则不要显示任何信息

11.弱化或隐藏当前内容的不可用菜单项

菜单纵览

注意: 你手机上的菜单样式和屏幕布局有可能与本文中的截图范例有所差异; 此问题是由于不同版本的Android系统或不同型号的手机而造成的.
1.选项菜单

选项菜单上的多个指令(指令,即功能指令,译者注)是全局适用的,且可并行作用于当前进程 (原文为Activity,类似PC上的进程,下同.译者注),也可启动另一个进程.却不适用(文本)内容里的被选中中项.

(程序员就容易理解这段,大意是选项菜单可针对运行中的程序启动某些功能)

在
大部分的手机上,用户按下"MENU"键就会在屏幕下方显示选项菜单.而用户再次按下"MENU"键或"返回"键就会关闭选项菜单.实际上,想要关闭任何
菜单都可统一使用"返回"键.(重复按下"MENU"键或者点击屏幕空白处也能实现同样效果.) 并需要注意在不同手机上的操作方法.
每个进程有属于它们的操作方式和选项菜单.一个程序的多个进程会有不同的选项菜单.
比如,在 Email程序的邮件列表里面,选项菜单有邮件搜索,邮件排序,刷新列表,和更改邮箱设置等的功能.在Email程序的撰写模式下,选项菜单也有差异之处,例如多出了复制副本,添加附件和删除邮件这几个功能.

为了处理数目众多的菜单项,选项菜单通常以两步来逐级呈现.
•图标选项菜单 –初次按下MENU键,屏幕底部会显示几个带图标且不可滚动的网格.(G1手机上会显示6个典型按钮.)
•扩展选项菜单 –如果这个进程的菜单项很多(超过6个),选项菜单的最后一个图标会标记"更多"–选中后会弹出一个包含多个菜单项目的列表,此列表有时还可以滚动.

(非常清晰的逻辑,很好地指导了菜单的设计技巧)



在Android的某些固件版本,用户可以长按（touch&hold,下同.译者注）"MENU"键来弹出快捷键–图标菜单上的文字,一会儿显示指令名称,一会儿显示快捷键(若有的话).
2.关联菜单


关联菜单类似于桌面操作系统(如Win7,译者注)的右键菜单.这便于在任何地方都能启动一些指令.
如下图所示,用户可以长按屏幕上的内容来打开关联菜单 (若有的话).关联菜单其实是被选中内容的一些可操作指令的列表.指令也可以成为当前进程的一部分,系统也能通过被选中内容去启动另一个进程进行操作.
例如,在邮件列表中,用户长按邮件信息会弹出一个含有阅读,归档,删除等指令的关联菜单 .
用户亦可长按屏幕某些位置来打开关联菜单.比如当用户准确地在主屏幕界面(Home screen)空白处长按,同样会显示一个关联菜单; 此处的图标菜单项也能点击.



3.关联菜单是快捷方式


综上所述,如果用户在联系人"Obi Wan Kenobi"上长按,则会打开一个关联菜单,上面提供的指令能够执行一系列(与此联系人相关的)功能.
点击关联菜单会激活最直观的指令–例如 "查看联系人".我们建议最直观的指令同样可在关联菜单的首项(菜单的第一位,译者注)列出.如这个例子,直接点击 "Obi Wan Kenobi" 这个名字,和在关联菜单中点击"查看联系人" 所实现的功能是一样的.

(某些功能有多个入口或多种触发方式,能够适合不同熟练度的用户使用)

同样要注意 ,下文中的截图,左右两副图可实现的功能都是相同的.点击"查看联系人"后,左图关联菜单上的各种指令会分离成右图的选项菜单、图标按钮和常规菜单项.(大家对比下面两个图的功能项就明白了,译者注)
所
以,使用关联菜单被认为是快速执行常规操作的一种捷径.关联菜单比起某些常显式的按钮或选项菜单,出现的机会更少.很多用户从未发现或者使用过关联菜单.
因此,关联菜单上的每个指令也应该在界面上利用多种形式(比如图标啦,按钮啦之类,译者注)直观地显示.在下一节的说明中,比如 "选择文字"
这种操作指令也许只在关联菜单出现.同样,比如浏览器之类的富互联网应用（原文为rich
applications,译者注）,或某些包含联网的应用,关联菜单上的一些些指令在其它地方也无法使用.

(慎用关联菜单这种隐性操作,因为在交互设计里面,操作分两种:显性与隐性;隐性操作无法明确被操作对象的关系和产生的结果,所以大家就明白了为何手机上的左右软键在屏幕上面有软键功能名称)



4.关联菜单上的文本指令

任何内容的文字链接与文字区域,系统都统一提供一些操作选项,并且适用于所有程序: 比如 "选择全部","选择文字","复制全部",和
"添加至字典"这几个指令.如果文字区域是可编辑的,则会有另外的操作,比如 "剪切全部" 与
"切换输入法".又或者剪贴板内有文字的话,则会显示"粘贴".系统会在文字链接与文字区域中的关联菜单自动插入适当的菜单项,就如下图所示.

(不同场景中,菜单上的项目也有相应的变化,以便于使用)



5.选项菜单与关联菜单的区别

选项菜单适用于全局性的控制,而关联菜单适用于内容项.下面的图表中,用户通过操控菜单,然后点击菜单项来执行一个动作或打开一个对话框.



6.屏幕中的固定指令


某些指令能直接固定在屏幕上,典型例子是文字按钮,图形按钮,以及列表项.这种布局方式是目前为止最易于被用户发现的–用户无需按下按钮就能够直接看到指令（名称）.这种增强可见性的方法需要衡量界面的空间和控件的占位大小,否则视觉设计上会显得凌乱.

(合理安放菜单,需要细心思考菜单的:1.出现时机;2.出现形式;3.界面外观)

指南

正确选择菜单的呈现方式,保持菜单的一致性,是设计优秀程序的关键因素.后续指南的目的是,协助用户体验设计者及程序开发者更好地了解以上内容.
分离全局指令的特定选项

选项菜单内,适合安放全局性控制当前进程的指令,或者将指令固定显示在屏幕上; 关联菜单内,适合安放针对当前被选中项的指令.(无论如何,指令也可以作为进程的一部分来运行或启动另一个进程.)
你
可以视乎功能作用来判定如何安放菜单:
如果(某个)指令对屏幕上的被选中内容（或特定位置）起效,就将指令安放到内容的关联菜单里.如果(某个)指令不是对特定的内容或位置起作用,就安放在选
项菜单里.系统会以下列方式强制执行这些特定的指令.当你按下MENU键打开选项菜单,被选中内容则变为未选,因此也不起作用.
这里举一个特定选项的例子–用户在联系人列表里长按人名.关联菜单将包含典型的指令 "查看联系人","呼叫联系人",和 "编辑联系人".
优先安放最频繁使用的操作

由于屏幕高度有限,一些菜单会滚动.设计时着重安放重要的指令在首项,而无需滚动就可查看.至于选项菜单,在图标选项菜单上优先排列最频繁使用的操作,用
户必须选择"更多"来查看其它指令.对于在相同位置安放类似指令也是非常有用的–例如,搜索图标可能一直排在选项菜单的首位,为多个进程提供搜索.
关联菜单上,最直观的指令应当优先排前,然后再按使用频度递减来排序指令,(关联菜单)底部则安放极少使用的指令.
不要仅在关联菜单上安放指令

如果用户无需使用关联菜单就能够完全使用你的程序,那么你设计得非常好!一般来说,倘若某些程序不得不使用关联菜单的话,那么你需要在其它位置也显示同样的指令.
在
打开关联菜单之前,无法从视觉上识别其是否存在(反之,选项菜单起码有个MUNE键),所以关联菜单不是特别容易发现.因此,关联菜单的指令图标同样会显
示在屏幕.例如,用户既可在联系人列表的人名上长按,从打开的关联菜单里点击拨打电话,亦可在"查看联系人细节"界面点击电话号码来拨出电话.
关联菜单的首项指令应是最直观的


如上所述, 关联菜单首项指令的功能最好与直接点击时所产生的功能一致.以上两个例子都是最直观的操作.

(我举个例子吧,例如打开链接,有2种方式:直接点击该链接,或者,长按链接然后弹出关联菜单的第一项指令"打开链接".两个方式实现的功能都是一致的)

直接点选内容应执行最直观的操作

在你的程序里,当用户点击任何可操作文本 (比如链接及列表项)或图像(比如照片图标),应当执行一个最符合用户期望的操作.

(符合期望值,的确是良好体验的基础)

一些基本操作范例:
•点选一个图片则执行"查看图片"

•点选一个多媒体的图标或文件名则执行 "播放"

•点选一个链接则执行"打开链接"

•点选一个地点则执行"定位地点" (地图程序内)

需要注意的是,在不同的情景里选择同样的项目有可能调用不同的功能:

•在联系人程序里,点选一个联系人会执行"查看详细"

•在即时聊天程序里,点选一个联系人会执行"开始聊天"

•在邮件程序里,焦点处于收件人栏,在联络簿点选一个联系人则会执行"添加至收件人列表"
关联菜单和被选中项须有所联系

当用户长按某个项,弹出的关联菜单应包含被选中项的名称.因此,创建关联菜单的时候,必须包含被选中项的标题名称,这样用户才清晰地知道关联了什么.例
如,若用户选择一个联系人叫"Joan of Arc",就把人名放在关联菜单的标题栏(利用
setHeaderTitle函数).同样地,一个编辑联系人的指令应称作"编辑联系人",而不是"编辑".
仅将最重要的指令固定在屏幕上

把一些指令放入菜单里,就能让屏幕空出位置而显示更多内容.另一方面,在进程的内容区域固定显示一些指令(如按钮/图标),让指令操作更显眼及易用.
这里有几个重要理由来解释为何要在屏幕上固定某些指令:

•凸显指令,确保指令比较明显而不被用户忽视.

如:应用商店里的"购买"按钮.

•更快捷地调用重要指令,减少打开菜单的冗长乏味感.

如: 图片浏览程序里的下一张/上一张按钮或放大/缩小按钮.

•程序运行过程中一些需确认的指令.

如:图片程序里的保存/放弃按钮.

•用于对话框及向导界面.

如:确定/取消按钮.

•操作更直接.

如:在主屏幕界面拖拽一个程序图标至垃圾桶 .
选项图标菜单多使用短名称


如
果图标选项菜单里某个文本标签过长,系统会将它拦腰截断.所以"Create
Notification"这个指令名称会被截断得像"Create…ication"一样.你无法控制系统截断指令名称,所以,
最佳的方法是保持名称简洁.于Android的某些版本,图标被选中后,相关功能描述文字会如字幕般呈现,并可滚动阅读上面的文字.
对话框不该有选项菜单


当对话框出现后,按下MENU键不应有任何反应.这也适用于某些看起来像对话框的进程.小型的对话框比全屏的对话框更易于查看,上面一般有0~3个按钮,且不可滚动,有时还可能有单选框或复选框.
基本原理是,显示对话框后就不能有选项菜单.用户在(显示对话框的)过程中无法启动另一个全局任务 (而这也是对选项菜单的规定).
如果进程无选项菜单,则不要显示任何信息

当用户按下MUNE键后,若这里没有选项菜单,系统不会有任何反应.我们建议你不要执行任何指令(比如显示信息之类),这样整个程序的菜单会非常一致,继而带来更良好的用户体验.
弱化或隐藏当前内容的不可用菜单项


有时某个菜单项的功能无法执行–例如,在浏览器里, "前进"按钮必须在你曾按过"后退"按钮之后方可使用.我们建议:
•选项菜单内–禁用无效的菜单项,让其变灰.这种方法适用于图标选项菜单以及"更多"菜单.图标选项菜单突然由6项变成5项时会让人困惑,因此我们用同样的方式(变灰而不隐藏)来处理"更多"菜单.

(这里有点啰嗦,估计大意是:没用的菜单项就变灰,而不是突然隐藏它)

•关联菜单内–隐藏无效的菜单项.这样会使菜单更短,而用户也仅能看见可使用的选项 (也能减少菜单滚动).