是什么让一个原生macOS应用......看起来像一个原生macOS应用?在这篇文章中,我们将分析这个问题,并看看一些实用的方法,你可以在你自己的应用程序中采用macOS应用程序的设计惯例。你将能够做出设计决定,使你的应用程序适合,从而提供更多的无缝体验以及其他潜在的好处--请继续阅读!
尽管本文主要涉及 "原生macOS外观",但重要的是,一开始就注意到下面的许多功能和概念也适用于Windows应用程序。此外,还值得一提的是,近年来,网站和桌面应用程序之间的界限变得越来越模糊,这意味着许多这些惯例也适用于Web应用程序。
那么,现在我们对我们的目标有了共同的理解,问题是--为什么人们可能希望他们的应用程序看起来像一个原生的应用程序?嗯,除了有类似的设计惯例可以为我们的用户提供更 "无缝 "的体验这一明显的事实之外,我认为一个看起来有 "原生 "设计的应用程序所带来的外观一致性也带来了一种更 "可信 "的感觉。设计似乎考虑得更全面,总的来说,应用程序在某种程度上也感觉在性能上更稳定。
在考虑你的应用程序所提供的用户体验时,这些好处应该是一个重要的考虑因素,而且,在我看来,这也是将原生设计惯例纳入你的工作中的一些相当有说服力的理由。所以,让我们跳进去,开始看一些具体的细节吧!

使用默认的光标,而不是指针
虽然指针式光标(手指版本👆)在网络上的许多情况下无处不在,但原生桌面应用程序将其用于一个特定的目的:在浏览器中打开页面的链接。通常情况下,这些链接被设计成真正的文本链接。

但即使这个简单的规则也经常被打破。
例如,在 "关于本机"的 "资源"小节中,一些链接打开了一个网页,但它们仍然使用默认光标,以保持与其他列表项目的一致性。

所以,这取决于你如何严格遵守 "链接规则"。
使文本默认为不可选择的
用户只能选择开发者明确规定为可选择的标签中的文本。但是,我们如何决定什么是真正应该可以选择的呢?嗯,这是另一个灰色地带,需要对你的用户工作流程有深入的了解。
简单地说,所有用户可能想要选择的东西都应该是可选择的。这里有一个例子:在 "关于这台Mac"窗口中,你可以清楚地选择操作系统版本、型号名称、SN和其他 "内容",但你不能选择技术标签本身。

不要让风格化的按钮、下拉菜单或复选框在悬停时做出反应
这是一个快速提示。就它们对悬停的反应而言,有两种类型的按钮在本地应用程序中使用。简而言之,风格化的按钮、下拉菜单(关于下拉菜单项的内容稍后会有)和复选框对鼠标悬停没有反应,而幽灵按钮(纯文本或图标)有反应。

不要给菜单和表格提供悬停效果
菜单和表格项目没有悬停效果。

即使一个菜单项或表格行在悬停时有一个次要的动作按钮显示,这也是真的--项目背景没有反应。这个技术,再加上前面的技术,使界面看起来很安静,不那么啰嗦。

然而,我们要注意,下拉菜单项在悬停时是有反应的。这样做是为了键盘导航的目的--使用键盘的用户应该看到他们将要选择的是哪个选项。

此外,应用程序菜单和列表会突出显示所选项目。这为用户提供了视觉锚点,以便在界面中更快地定位和导航。
确保按下的状态是微妙的或明显的
就像下面的3D地图的例子,如果一个按钮打开或切换一个明显的模式,按钮的背景会被巧妙地突出显示。

另一方面,如果不明显的模式可能被切换或打开,那么按钮的前景就应用活动的颜色。

把人民币的上下文菜单放在任何地方
在网络上,对人民币(鼠标右键)点击的自定义处理是非常罕见的,而且,我甚至可以说是意想不到的。但在桌面世界中,有人民币处理是完全自然的。菜单和列表都有这个功能,可以快速删除或编辑一个项目。

但是,有一个问题。一旦你覆盖了标准的人民币点击处理(在浏览器或Electron中),你就必须重新实现所有的标准操作,如复制、剪切、粘贴等等。
总结一下
让我们来回顾一下。要使一个界面(包括基于网络的)看起来像一个原生的macOS应用,要考虑。
- 丢掉指针游标
- 禁止非内容的文本选择
- 减少悬停效果
- 不要过度使用重点色
- 添加人民币上下文菜单