菜单 关闭

上下文菜单:为任务提供相关工具

通过 安娜凯利3月17日,二千零一十九

总结:上下文菜单按需显示,并包含一小部分相关操作,与控制有关,一段内容,应用程序中的视图,或者用户界面的一个区域。如果设计正manbetx官方网站手机版确,它们提供了完成任务的相关工具,而不会给接口增加混乱。


在任何特定的情况下,拥有合适的工具都会带来很大的不同,尤其是在正确有效地完成任务的时候。没有相关工具,我们浪费时间并感到沮丧,迷路的,困惑。同样糟糕的是:当周围工具太多时,我们浪费时间去寻找合适的或是最后满意度用次优工具,相反。

数字空间没有什么不同;在任何给定的应用中,有很多工具可以使用,要完成的任务,要浏览的菜单选项,以及要执行的命令。像这样的,一个重要的用户界面元素变窄一组可用的命令和联系他们的相关任务是上下文菜单。

什么是上下文菜单?

定义:A上下文菜单是一种按需显示的菜单,其中包含一组与控件相关的相关操作,界面的一个区域,应用程序中的一段数据,或应用程序的视图。通常,此上下文由当前选择提供,或者在调用上下文菜单之前由用户指定。

Word中文本的上下文菜单
在Microsoft Word中,突出显示一段文字,按住控制 钥匙,单击鼠标会显示一个上下文菜单,其中只包含与所选数据块相关的命令。
来自较低状态栏的Word上下文菜单
右键单击MicrosoftWord中的状态栏会显示一个上下文菜单,其中包含与整个文档相关的命令。上下文菜单还包含用于在状态栏中切换要显示或隐藏的特定元素视图的命令。

在上下文菜单中提供一小部分相关操作有助于用户准确地找出他们手头的任务需要什么。此菜单类型还减少了交互成本认知负荷因为用户不必通过分析主菜单项的长列表来找到他们需要的内容,他们也不必每次希望使用某些命令时都返回工具栏。

上下文菜单存在于所有操作系统中,在桌面和移动应用程序.然而,对于每种设备类型和系统,都有重要的可用性考虑。在本文中,我们将介绍几个上下文菜单的例子,并讨论在设计它们时要记住的交互和视觉因素。manbetx官方网站手机版

用于显示上下文菜单的触发器

上下文菜单通常不是由一致的UI元素触发的,手势,或互动。它们出现在用户单击的旁边,抽头,印刷机,或者擦拭,根据TAP目标,所产生的动作也会有所不同。上下文菜单中提供给用户的选项应该相同,不管用户如何与系统交互以显示这些菜单。

桌面,显示上下文菜单的主要交互包括:

  • 用鼠标右键单击两个按钮
  • 按压控制 (CTRL)按钮,然后单击
  • 用两个手指点击触摸板

可移动的,显示上下文菜单的主要交互包括:

有效上下文菜单提示

要确定应用程序中是否需要上下文菜单,问问你自己,你是否能找出一小部分与特定任务相关的选项或工具,所选元素,或应用程序屏幕.除了回答这个基本问题,以下是设计有效上下文菜单的更多提示:manbetx官方网站手机版

  • 只包括与手头任务相关的一组有重点的操作和常见选项。上下文菜单中的项目应直接与用户需要完成的任务或界面中选中或单击的元素相关。
一个注释中的上下文菜单
OneNote中选定笔记的上下文菜单包含与编辑笔记内容相关的命令。行为如粘贴 插入链接 包括在这里是有意义的,但全球行动如保存 打印 由于这些命令与整个笔记本相关,因此包含这些命令没有意义,而不是选定的注释。
  • 确保上下文菜单中的命令也可以从应用程序的主菜单中使用。喜欢键盘快捷键,上下文菜单为用户提供了另一种执行操作和选择选项的方法。因为上下文菜单的默认视图通常是隐藏的,用户可能不知道它是可用的,或者如何访问它。在主导航菜单的上下文菜单中,应该始终有一种额外的方法来查找和使用这些操作。
层中的Photoshop上下文菜单
在PS图象处理软件,通过右键单击面板(顶部)或通过选择层,然后点击主导航中的标签(底部)。这种设计为manbetx官方网站手机版用户提供了访问命令的方便选项。
  • 在UI中包含可视元素,以指示上下文菜单可用。高级用户可能理解右键单击,控件单击,刷牙,或者长按将显示上下文菜单,但并非所有用户都知道这一点。上下文菜单的常见视觉符号包括垂直或水平省略号和向下箭头。
谷歌照片上下文菜单
谷歌照片中的水平省略号按钮帮助用户访问与其相册相关的命令。
Windows上下文菜单
Windows上的向下箭头按钮帮助用户访问与其配置文件和配置文件图片相关的命令上下文菜单。
  • 对于隐藏上下文菜单,(1)包括创建意识的提示;(2)允许用户以另一种方式执行相同的操作。例如,手机上,通常情况下,上下文菜单将通过特殊的手势访问,如3D触摸或滑动。虽然移动手势用户越来越熟悉,这些手势不能被发现,而且还没有成为标准。确保包括其他执行动作的方法,这不依赖于手势。例如,对于上下文操作,滑动并不总是可以发现的,因此,提供辅助线索来帮助用户找到您的菜单。即使你的应用程序使用一个初始提示来显示手势,比如刷卡触发的动作,人们不太可能会记得以后在应用程序中使用它。因此,上下文操作可能永远不会被发现。
Gmail上下文菜单
滑动手势在所有列表中的部署并不一致,所以人们不总是想使用它们,结果,这些手势变得不那么容易被发现。刷卡操作是加速超级用户交互的加速器,但是通过手势可用的操作也应该出现在可见的UI中。例如,iOS邮件应用程序在底部的上下文菜单栏中提供了冗余的命令电子邮件消息;这些命令也可以通过在列表视图中滑动电子邮件并单击更多 选择权。
  • 上下文菜单不应由图标可能被误认为是主导航或应用程序设置.避免使用齿轮图标或汉堡菜单表示上下文菜单的图标。用户已经认识到这些元素是触发全局菜单和设置的元素,而不是更窄,任务聚焦命令.
使用设置图标的quip上下文菜单。
quip使用齿轮图标触发上下文菜单;这个齿轮图标可能被误认为是一个整体。设置 更广泛应用程序的菜单,而不是与文档相关的上下文菜单。
  • 限制在上下文菜单中使用子菜单。如果光标离开主列表项或用户意外单击上下文菜单外部,则从上下文菜单触发的子菜单很容易消失。如果需要子菜单,确保它的任何选项都不会打开另一级别的子菜单,并且不要用模糊的命令使其过载,直到它变得混乱为止,迷惑的,而且很难使用。
谷歌工作表上下文菜单,有许多重复的命令。
在谷歌表单中,当用户将鼠标悬停在特殊粘贴 上下文菜单中的命令。尽管子菜单只包含一个附加的选项层,它显示了许多类似的难以破译或扫描的命令。
苹果的3D触摸显示了Safari应用程序的上下文菜单。
苹果的3D触摸功能允许用户按住应用程序的图标,显示与应用程序关联的最常见操作的单一级别上下文菜单。此菜单帮助用户快速访问简单的工具和命令,而无需启动应用程序,然后,找到那些命令。
  • 按使用频率顺序列出命令。不要让用户扫描一长串杂乱无章的命令。为了帮助用户专注于最相关的选项,将最常用的选项放在顶部。因为人们从上到下扫描列表,将seldomly使用的命令放低到菜单中。让用户决定哪个选项最能满足他们的需求,如果所有可用选项都不适合,当菜单关闭时,不应执行任何结果操作。
YouTube上下文菜单,按使用频率排列命令。
YouTube推荐视频的上下文菜单在长时间按下后出现;如果用户单击操作溢出图标,同样的菜单也会出现。菜单选项按重要性顺序排列,如果用户决定不采取行动,他们很容易取消 任务,因此,隐藏上下文菜单而不更改其视图。
  • 在上下文菜单中显示键盘快捷键。帮助用户节省时间和学习键盘快捷键,在上下文菜单中包含它们。反复查看这些快捷方式将帮助用户记忆特定于任务的命令并提高效率。
文本的PowerPoint菜单
PowerPoint在其上下文菜单中包含键盘快捷键;这些快捷方式帮助用户学习导航和完成任务的省时替代方法。
  • 限制上下文菜单中的项目数。不要用上下文菜单中的大量选项列表压倒用户。通过包含少于10-12个项目来管理列表长度,避免选择过载确保所有上下文选项都可见,不用滚动。
Zillow上下文菜单,具有适当数量的列表项。
Zillow的移动应用程序在屏幕上提供了一个上下文菜单,显示房地产上市的统计数据。菜单中有9项与屏幕上下文相关。菜单的长度使您很容易理解可用的选项,并且无需滚动即可选择一个。
  • 禁用与用户上下文无关的项。与其隐藏不相关的行为,禁用它们,这样用户就不必尝试查找菜单项消失的位置,他们也不必决定如何将系统恢复到适当的上下文中以显示特定的命令。也,确保在一系列相关命令中包含所有选项(而不是一个)。例如,如果有背部,也应该有一个福沃德.如果有切割,也应该有拷贝粘贴.
Evernote上下文菜单
Evernote中的上下文菜单允许用户自定义显示在应用程序边栏中的元素。因为所有音符 无法从边栏中删除,此选项显示为禁用。如果从菜单中删除了它,用户可能想知道为什么或在哪里找到它,以便隐藏或显示它。

结论

虽然有很多方法可以触发和显示上下文菜单,在他们的核心,这些UI元素旨在为用户提供在给定上下文中轻松完成任务所需的最重要的命令和相关工具。有关设计有效上下文菜单的manbetx官方网站手机版更多信息,参加我们的全天课程,Web和桌面应用程序设计manbetx官方网站手机版移动用户体验.