GUI 常用元素中英对照表 / 4. Menu 附彩蛋

  • macOS 把一般菜单栏叫作 Hierarchical Menu,主要是为了和另一种 Contextual Menu 呼应。

  • Windows 或者说 Office 的基础元素里有一种特殊案例 Ribbon,主要面向操作特别繁复的办公应用。

  • 和一般菜单的操作范围指向整个应用不同,Contextual Menu 只指向特定元素,比如 macOS 的右键选中后弹出菜单,再比如 Material 的点击 Overflow 图标弹出对应菜单。

  • iOS 中有一类特殊 Contextual Menu,针对文本编辑的Edit Menu。

  • 对应译名:
    Menu Bar —— 菜单栏
    Contextual Menu —— 语境菜单
    Edit Menu —— 编辑菜单

GUI 常用元素中英对照表 / 4. Menu 附彩蛋_第1张图片
Menu

*彩蛋: Hamburger Menu 的前生今世

大多数情况,用户不理解 Hamburger Menu 是什么,剩下的情况,用户不喜欢这个设计。对他们来说,看不到的基本就等于不存在。默认隐藏在「更多」、「展开」里的内容就是薛定谔那只亦生亦死的猫,在没点开之前,一切皆有可能。Hamburger Menu / 汉堡菜单被诟病的根本原因在于,1、被隐藏的选项、操作是否应该被隐藏;2、如果是,那么可以被隐藏的选项、操作是否有必要存在。

GUI 常用元素中英对照表 / 4. Menu 附彩蛋_第2张图片
Photo Courtesy of Vanessa Grass

现下的汉堡菜单多见于移动端应用,点击图标后呼出侧边栏。但设计者 Norm Cox 最开始对它的定义是语境菜单——在有限空间里作为一个「容器」收纳其他操作——而非导航。

I designed that symbol many years ago as a "container" for contextual menu choices. It would be somewhat equivalent to the context menu we use today when clicking over objects with the right mouse button.

GUI 常用元素中英对照表 / 4. Menu 附彩蛋_第3张图片
Xerox Star

Xerox Star 的录像即证明了这一点。点击 Hamburger Icon 后左侧出现针对文档的菜单列表。

GUI 常用元素中英对照表 / 4. Menu 附彩蛋_第4张图片
Hamburger + Overflow

最早出现在 Android 系统上的「纵向三点」 (Action) Overflow ,也被昵称为 Dango,其实就是原始 Hamburger Menu 的简化形式。也许是为了避免语义上的冲突,Material 在定义规范中把普遍理解的 Hamburger Menu 改作了定义更为清晰直观的 Navigation Drawer。

References:

  1. Menus. (n.d.). Retrieved Feb 6, 2017, from https://developer.apple.com/library/prerelease/content/documentation/UserExperience/Conceptual/OSXHIGuidelines/MenuAppearanceBehavior.html
  2. Menus. (n.d.). Retrieved Feb 6, 2017, from https://material.io/guidelines/components/menus.html
  3. Menus and context menus. (n.d.). Retrieved Feb 6, 2017, from https://msdn.microsoft.com/en-us/windows/uwp/controls-and-patterns/menus
  4. ContextualMenu. (n.d.). Retrieved Feb 6, 2017, from https://dev.office.com/fabric#/components/contextualmenu
  5. Who Designed the Hamburger Icon? Retrieved Feb 6, 2017, from http://gizmodo.com/who-designed-the-iconic-hamburger-icon-1555438787

你可能感兴趣的:(GUI 常用元素中英对照表 / 4. Menu 附彩蛋)