如何在用户界面上指示暗模式/亮模式选项?

平面设计 图标 界面设计 设计原则 用户体验
2022-02-11 01:47:25

要在界面上指示切换到暗模式或亮模式的按钮,通常会有几个太阳/月亮图标:

🌞 亮模式 🌙 暗模式

但至少我的一部分大脑在说“如果你的屏幕太亮,请点击太阳图标”,我必须弄清楚月亮是否只在夜间可见,所以“我是否希望屏幕更亮,因为它更暗或……”。

好吧,也许我的大脑有点反常——但是否有更好的选择来指示暗/亮模式切换?

4个回答

你可以简单地直截了当......

在此处输入图像描述

你真的不需要一个图标。

我只会使用一个拨动开关:将其放置在设计中一个独特的固定位置,然后进行自定义。您可以使用填充和笔触,或在下面添加措辞以获得更好的可用性(例如“浅色模式”、“深色模式”)。

在此处输入图像描述

暗模式和亮模式不是您每隔几分钟或每小时甚至永远都不会切换的东西。大多数人选择一种首选模式并忘记它,有些人可能会随着外部光线的变化每天定期切换两次。其他人都是压倒性的少数。

因此,它不是需要占用屏幕空间并在“主”UI 中直接可用的选项。它可以舒适地坐在专用屏幕上的其他选项中。

如果你有专用的屏幕,你就不需要发明不必要的紧凑图标——阅读简单直接的文本会更容易,猜测每个随机图标的含义。如果需要,请在选项名称前添加图标(如 Android 设置),但如果您计划添加更多配色方案,则将选项明确拼写为滑块“深色模式 <-> 浅色模式”或“主题”选择框。

您没有为此提供选项。

相反,您会自动从操作系统或浏览器设置中提取它(视情况而定)。匹配用户的全局、系统级偏好。不要在每个单独的应用程序中提供首选项。