`

Android菜单设计指南【转】

阅读更多

原英文版出自Android开发者论坛:http://androidappdocs.appspot.com/index.html

菜单设计快速预览

• 任何指令的选项菜单只适用于当前进程.
• 任何指令的关联菜单只适用于当前被选中项.
• 优先安放最频繁使用的操作.
• 仅将最重要的指令固定在屏幕上.
• 长按(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项时会让人困惑,因此我们用同样的方式(变灰而不隐藏)来处理”更多”菜单.

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

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

相关推荐

    Android圆形旋转菜单CircleMenu.zip

    《Android圆形旋转菜单——CircleMenu.zip深度解析》 在Android应用开发中,用户界面的设计是至关重要的,一个吸引人的、易用的界面可以极大地提升用户体验。"CircleMenu"是一款独特的UI组件,它以圆形的方式展示...

    Android UI设计指南

    2. 应用程序图标类型及用途:Android平台中,图标分为启动图标、菜单图标、状态栏图标、Tab图标、对话框图标和列表视图图标等多种类型,每种类型都有其特定的用途和设计指南。 3. Android图标模板包:为了方便设计...

    仿iPhone的android圆环旋转按钮菜单

    7. UI设计原则:设计菜单时,应遵循Android的设计指南,确保图标、文字清晰易懂,同时保持整体风格的一致性,提升用户体验。 8. 可扩展性:为了适应未来的需求变化,代码应设计得模块化,方便添加、修改或删除菜单...

    android开发中常用的3中菜单

    在Android应用开发中,菜单是用户交互的重要组成部分,它提供了丰富的功能入口,使得用户能够...在实际项目中,我们还需要考虑菜单的可访问性、设计风格和触摸反馈等方面,以确保菜单符合Android的设计指南和最佳实践。

    Android系统菜单与自定义菜单

    系统菜单的使用遵循Android设计指南,确保用户在各个应用之间有一致的操作体验。开发者可以通过在Activity中重写`onCreateOptionsMenu(Menu menu)`方法来添加和定制系统菜单项。然后,在`onOptionsItemSelected...

    Android_UI设计指南.pdf

    #### 二、菜单设计指南 菜单是Android应用中提供一系列隐藏命令的方式,这些命令可能是操作也可能是导航指令。菜单的设计应遵循以下指南: - **属性菜单**:通常包含应用的全局或主要功能,例如,用户按下物理键盘...

    android菜单图标 UC菜单图标

    "android菜单图标 UC菜单图标"这个主题涉及到的是为Android应用设计的精美菜单图标,它们与UC浏览器(UC Browser)的菜单图标保持一致,旨在提供一致且直观的用户体验。 菜单图标在Android中通常用于表示各种功能或...

    Android底部菜单栏

    这个“Android底部菜单栏”教程是为初学者设计的,旨在帮助他们理解如何在Android应用中实现这一功能。我们将主要探讨TabHost组件,它是Android早期版本中用来实现标签页式导航的一种方式。 首先,我们需要了解底部...

    android activitygroup底部菜单

    随着Android版本的更新,Android设计指南推荐使用Fragment替代ActivityGroup来实现复杂的页面导航。Fragment可以在同一个Activity中动态添加、移除和替换,且提供了更好的回退栈管理。然而,对于某些老版本的Android...

    Android_UI设计指南

    ### Android UI设计指南详解 #### 一、图标设计的重要性与原则 在移动应用开发中,良好的用户界面(UI)设计是提升用户体验的关键因素之一。图标作为UI设计的重要组成部分,在整个应用的设计风格统一性和视觉吸引...

    Android 底部菜单.zip

    下面我们将深入探讨Android底部菜单的设计原则、实现方式以及可能涉及的关键技术。 1. **设计规范**: - 底部菜单通常包含3到5个主要操作,每个图标和对应的标签清晰地表示了其功能。 - 图标应简洁且易于识别,...

    android菜单icon图标

    本文将深入探讨Android菜单icon图标的相关知识点,包括其设计原则、类型、尺寸规范以及如何在应用中实现。 首先,我们要明白菜单icon图标的设计原则。一个好的Android菜单icon应该具有以下特点: 1. 易于识别:图标...

    android底部菜单栏

    在Android设计指南中,这种设计模式被称为“Bottom Navigation”。下面将详细探讨如何在Android中实现底部菜单栏。 首先,我们需要了解Android的布局系统。底部菜单栏通常会作为Activity或Fragment布局的一部分,...

    android抽屉菜单 android panel

    这种设计通常遵循Material Design指南,是Google推荐的Android应用界面布局之一。抽屉菜单常用于放置应用的主要功能或二级导航选项,使得用户能够轻松地在不同部分之间切换。 抽屉菜单在Android中通常通过`...

    android左右滑动菜单架包slidelibrary

    不过,需要注意的是,随着Android设计指南的更新和Material Design的推广,开发者可能需要考虑是否使用如`BottomNavigationView`这样的现代组件来替代传统的侧滑菜单,以保持应用的现代感和一致性。

    Android滑动菜单框架完全解析

    在Android应用开发中,滑动菜单(Slide Menu)是一种常见的设计模式,用于提供侧边栏导航,用户可以向左或向右滑动主界面来显示或隐藏菜单。本篇文章将全面解析Android滑动菜单框架的实现原理、常用库以及如何在实际...

Global site tag (gtag.js) - Google Analytics