全库模式 用户模式 表模式_暗模式,亮模式和用户的故事

全库模式 用户模式 表模式

I have been working on designing a UI for an app that has individuals over the age of 60 as its main audience. At some point, I found my design more appealing in dark mode. As a UX designer, I know that my opinions and preferences don’t matter and I have to see what the real user prefers. However, because of the pandemic restrictions, I was unable to do one-on-one user research to find out what the users prefer.

我一直在为一个以60岁以上的人群为主要受众的应用程序设计UI。 在某种程度上,我发现我的设计在黑暗模式下更具吸引力。 作为UX设计师,我知道我的意见和偏好并不重要,我必须了解真正用户的偏爱。 但是,由于流行病的限制,我无法进行一对一的用户研究以找出用户的偏爱。

My designed UIs for T2D patients over the age of 60 in both dark and light mode provided as a sample

外卖 (Takeaways)

Based on my findings in research studies, articles, blog posts and user comments, my key takeaways for deciding about using dark/light mode at designs are as follows:

根据我在研究报告,文章,博客文章和用户评论中的发现,决定在设计中使用暗/亮模式的主要要点如下:

  1. You have to design for both modes and provide the user with the option of switching between them.(accessible and inclusive design)

    您必须为两种模式进行设计,并向用户提供在两种模式之间进行切换的选项。
  2. For text-heavy screens, light background with dark text is preferred as default (legibility)

    对于文本较多的屏幕,默认使用浅色背景和深色文本(易读性)
  3. For messaging interfaces, light background with dark text is preferred as default(semantic interpretation)

    对于消息传递接口,默认使用深色背景的浅色背景作为默认设置(语义解释)
  4. For people experiencing Migraine, dark theme is preferred as default (health)

    对于经历偏头痛的人,默认使用深色主题(健康)
  5. For people with long hours of working with screens, dark UI is preferred as default (preference)

    对于长时间使用屏幕的人,默认使用深色UI(首选)

研究方法 (Research Approach)

I looked up academic research papers, articles published on the internet, blog posts, and any other possible resource that I might find the answer through. One of the most interesting resources I found was the comments people left for some of these articles and blog posts. They were actual users of dark and light themes that expressed their opinions about their preferences and most of the time with an extensive explanation about the reason for their preferences.

我查找了学术研究论文,在互联网上发表的文章,博客文章以及其他可能找到答案的可能资源。 我发现的最有趣的资源之一是人们对这些文章和博客文章发表的评论。 他们是深色和浅色主题的实际用户,他们表达了他们对喜好的看法,并且在大多数时候对喜好的原因进行了广泛的解释。

None of the resources that I found compelled me toward using or not using either of these modes. Most of the old resources have only explored this subject for text reading use cases only. Many of the new resources based their arguments on those old ones (as it seems to be reasonable to do so!). However, I didn’t only rely on academic studies and tried to find more clues and synthesize my own conclusion.

我发现的任何资源都没有强迫我使用或不使用这两种模式。 大部分旧资源仅将本主题用于文本阅读用例。 许多新资源的论据都是基于那些旧资源的(因为这样做似乎是合理的!)。 但是,我不仅依靠学术研究,还试图寻找更多线索并综合自己的结论。

I found that I can explore this subject from the following perspectives:

我发现我可以从以下角度探讨这个主题:

  • Legibility (How readable is it?)

    易读性(可读性如何?)
  • Aesthetics (How beautiful is it?)

    美学(它有多美?)
  • Personal Preferences (Who prefers what?)

    个人首选项(谁喜欢什么?)
  • Emotional effects (How does it affect emotions?)

    情绪影响(它如何影响情绪?)
  • Semantic Interpretation (How does it affect understanding?)

    语义解释(它如何影响理解?)
  • Visual fatigue (Which one makes the eye tired?)

    视觉疲劳(哪个会使眼睛疲劳?)
  • Technology benefits (Which one is technologically preferred?)

    技术优势(技术上优先选择哪一种?)
  • Health conditions (Which one is better for health?)

    健康状况(哪种对健康有益?)

I defined a table(ish) structure, in which each of the defined aspects forms a row, and Dark and Light modes define a column each. Then I started to exploit facts out of my readings and placed them in the correct location in the table.

我定义了一个table(ish)结构,其中每个定义的方面都形成一行,并且Dark和Light模式分别定义了一列。 然后,我开始利用我的读数中的事实,并将其放置在表中的正确位置。

The structure of my findings from various resources. Just shows how I approached. No readable content.
Structuring my findings from various resources
利用各种资源构建我的发现

The left and right columns are light and dark mode respectively and each row represents one of the criteria I mentioned before. Red squares are against that mode in the specific criterion and greens are in favor of that mode. (Blue square is the reference related to each fact.)

左列和右列分别是明暗模式,每一行代表我前面提到的标准之一。 在特定条件下,红色方块反对该模式,绿色方块赞成该模式。 (蓝色正方形是与每个事实相关的参考。)

There have been some situations where the resource discussed one mode instead of explaining the benefits of the other. So I divided up my findings into two categories, the ones favoring a mode and the ones against it.

在某些情况下,资源讨论了一种模式而不是解释另一种模式的好处。 因此,我将调查结果分为两类,一类赞成一种模式,另一类反对这种模式。

A finding against light mode related to Health (left card in red), And a finding in favor of Legibility of light mode (right)
A finding against light mode related to Health (left card in red), And a finding in favor of Legibility of light mode (right card in green)
与健康相关的光照模式的发现(左卡为红色),有利于光照模式的易读性的发现(右卡为绿色)

研究成果 (Research Results)

After categorizing all the findings (Affinity finding), I synthesized the results of my (micro)research. Though I couldn’t find so many clues for every criteria, some of them with few findings were supported with strong research papers that made me compelled to conclude based on even a single finding. Here are the results for each criteria:

对所有发现进行分类(亲和力发现)后,我综合了我的(微型)研究的结果。 尽管我找不到每个标准的太多线索,但其中一些发现很少的证据得到了强有力的研究论文的支持,这些论文使我不得不基于一个发现就得出结论。 以下是每个条件的结果:

1- Legibility:

1-易读性

  • Research results support the legibility of dark text on light background more than light text on dark background [1].

    研究结果支持浅色背景上的深色文本的可读性比深色背景上的浅色文本[1]更多。
  • The smaller the font, the better it is for users to see the text in light mode[2].

    字体越小,用户在浅色模式下查看文本的效果就越好[2]。
  • Higher luminance of light background leads to an improved perception of details [3].

    较高的背景光亮度可以改善对细节的感知[3]。

2- Aesthetics:

2-美学

I couldn’t find any structured and unbiased research on this issue. However, based on my explorations, I can say the overall number of users who left comments in favor of the beauty of the dark mode exceed from the comments supporting the light mode. (see for example comment sections at [4] and [5])

在这个问题上,我找不到任何结构合理的研究。 但是,根据我的探索,我可以说留下评论支持暗模式之美的用户总数超出了支持亮模式的评论。 (例如,请参见[4]和[5]的注释部分)

3- Personal Preferences:

3-个人首选项:

Research studies show that dark themes are widely used among professions that heavily rely on working on computer screens [1].

研究表明,深色主题在严重依赖于在计算机屏幕上工作的专业人士中得到广泛使用[1]。

Large companies play an important role in forming preferences of their users. For example:

大型公司在形成用户偏好方面起着重要作用。 例如:

  • As Jon Friedman (Head of Microsoft Office design) states in his article [6], Customer choice was why Microsoft brought darker UI theme to desktop apps in office 2010, and also they brought it to more Microsoft experiences like Teams, due to its popularity.

    正如乔恩·弗里德曼(Jon Friedman,Microsoft Office设计负责人)在他的文章[6]中指出的那样,客户的选择就是为什么Microsoft在Office 2010中为桌面应用程序带来了更暗的UI主题,并且由于其受欢迎程度,他们也将其带入了更多的Microsoft体验,例如Teams 。

  • Apple somehow convinces their users for using dark mode by stating: “ Dark Mode makes it easier to stay focused on your work, because your content stands out while darkened controls and windows recede into the background.” [7]

    苹果通过某种方式说服用户使用暗模式:“暗模式可以使您更轻松地专注于您的工作,因为当暗的控件和窗口退回到背景时,您的内容就显得突出了。” [7]

  • Google states that dark theme has many benefits and provides guidelines for developers to utilize it on Android devices [8].

    Google指出深色主题有很多好处,并为开发人员在Android设备上使用它提供了指南[8]。

4- Emotional Effects

4-情感效果

Research studies approve that proficient color design increases pleasure, whereas inappropriate use of colors results in boredom, which in turn negatively affects mood and lessens the User Experience[9]. However, I couldn’t find any study or enough feedback from users to have any conclusion about emotional effects of dark/light themes.

研究表明,熟练的色彩设计可以增加愉悦感,而色彩使用不当则会导致无聊,反过来又会对情绪产生负面影响并减少用户体验[9]。 但是,我找不到任何研究或用户的足够反馈,无法得出有关暗色/浅色主题的情感影响的任何结论。

5- Semantic Interpretation

5-语义解释

A research study [1] shows that for chat interfaces, dark themes increase the probability of interpreting an ambiguous message negatively compared to light themes. However, I couldn’t find any similar study for other types of UIs (e.g. photo galleries).

一项研究[1]显示,对于聊天界面,与浅色主题相比,深色主题增加了负面解释歧义消息的可能性。 但是,对于其他类型的UI(例如,照相馆),我找不到任何类似的研究。

6- Visual fatigue

6-视觉疲劳

A research study by Nielsen Norman Group [2] states that there is no significant difference between dark and light themes in making people more tired. Also after reading users’ comments at[2,4,5], I can confirm this finding independently. There are users who found the dark mode so disturbing and some users who found it a relief. Finding an affinity requires conducting academic research studies considering age, visual status, gender, etc.

尼尔森·诺曼小组(Nielsen Norman Group)进行的一项研究[2]指出,深色和浅色主题在使人更疲劳方面没有显着差异。 同样,在阅读了[2,4,5]上用户的评论后,我可以独立地确认这一发现。 有些用户发现暗模式非常令人不安,有些用户发现它很轻松。 寻找亲密关系需要进行年龄,视觉状态,性别等方面的学术研究。

7- Technology

7-技术

OLED screens display black by deactivating pixel elements altogether. This way, true deep blacks can be achieved without the consumption of any power and this is one of the main reasons many users mentioned for their use of dark themes[1]. However, using any shades black (like dark gray) dissolves this benefit (i.e. not every dark mode design saves power!).

OLED屏幕通过完全停用像素元素来显示黑色。 这样,就可以在不消耗任何功率的情况下实现真正的深黑色,这是许多用户提到使用深色主题的主要原因之一[1]。 但是,使用任何深浅的黑色(如深灰色)都可以消除此好处(即,并非每种深色模式设计都可以节省功率!)。

8- Health

8-健康

A research study [10] confirms that near night-time, prolonged exposure to bright computer screens negatively affects sleep, circadian cycles and is known to cause headaches. Another one [2] states that even though performance in light mode may be better in the short term, there may be a long-term cost associated with it. From my exploration in users’ comments on blog posts [2, 4, 5], I found that users who have experienced some sort of eye disease or visual impairment, or the ones dealing with Migraine found the dark mode more comfortable.

一项研究[10]证实,接近夜间,长时间暴露于明亮的计算机屏幕会对睡眠,昼夜节律周期产生负面影响,并已知会引起头痛。 另一人[2]指出,即使在短期内在轻模式下的性能可能会更好,但可能会产生与之相关的长期成本。 通过对博客文章[2、4、5]中用户评论的探索,我发现经历过某种眼部疾病或视力障碍的用户,或者与偏头痛相关的用户发现暗模式更为舒适。

反射 (Reflection)

This was a one-day exploration of the resources I found on the internet to find an answer to the simple question of using dark or light UI for people over the age of 60. It is clear to me that the leading reason for using dark UI by many large companies has no root in scientific research and is mostly concerned with marketing decisions and following trends. However, these decisions raise a lot of questions regarding mental and physical health of users that can be explored by researchers.

这是对我在互联网上发现的资源的为期一天的探索,以找到针对60岁以上人群使用深色或浅色UI的简单问题的答案。我很清楚,使用深色UI的主要原因许多大型公司的研究都没有扎根于科学研究,并且主要关注营销决策和趋势。 但是,这些决定引起了很多有关用户心理和身体健康的问题,研究人员可以探讨这些问题。

I am confident that my findings can be used for designing interfaces on mobile devices and computer screens but cannot be employed at designing for VR/AR environments. This is another area of study that we need to explore more from the users’ perspective.

我相信我的发现可以用于设计移动设备和计算机屏幕上的界面,但不能用于设计VR / AR环境。 这是我们需要从用户角度进行更多研究的另一个研究领域。

翻译自: https://uxdesign.cc/the-story-of-dark-mode-light-mode-and-the-user-87782f180ae5

全库模式 用户模式 表模式

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值