Becoming a new UX designer you not only have to get comfortable with designing but also with why you are designing. It’s great if something looks nice, but how does it help the user? How accessible are the functions? How easy is the product, device or software to use and how quick it is to learn and recognise?
成为一名新的UX设计人员，您不仅必须熟悉设计，还必须熟悉设计的原因 。 如果看起来不错，那很好，但是对用户有什么帮助呢？ 这些功能的可访问性如何？ 产品，设备或软件使用起来有多容易，学习和识别有多快？
Through my case studies and Daily UI challenges, I improved on my understanding of UX and taking these accessibility guidelines into my designs. With this is in mind I started to look at apps and websites I use every day and what could potentially be added to improve the usability.
通过案例研究和Daily UI挑战 ，我提高了对UX的理解，并将这些可访问性指南纳入了设计。 考虑到这一点，我开始研究我每天使用的应用程序和网站，以及可能会增加哪些功能以提高可用性。
As a user, I LOVE dark mode on most apps. I’m even on record of shrieking when I’ve accidentally switched my Twitter from dark mode to light mode because of the new level of brightness my eyes need to adjust to. There is one app I’m not a fan of being in dark mode and that’s WhatsApp. I don’t like how the text looks, it sometimes feels harder to read, I’m not a fan of the speech bubbles and when someone bolds text I find it hard to identify the difference between bold and non-bold.
作为用户，我喜欢大多数应用程序上的黑暗模式。 由于我的眼睛需要调整到新的亮度水平，当我不小心将Twitter从黑暗模式切换到亮模式时，我什至还在尖叫。 有一个应用程序我不喜欢处于黑暗模式，这就是WhatsApp 。 我不喜欢文本的外观，有时很难阅读，我也不喜欢讲话泡泡，当有人用粗体显示文本时，我很难识别粗体和非粗体之间的区别。
I looked at a few other “popular apps” in dark mode. Twitter and Facebook Messenger allow users to switch between dark and light mode regardless of the users phone settings. So it’s either have your phone settings as light mode (which I do not want) or continue to be uncomfortable with WhatsApp’s dark mode (here I am suffering). But surely it couldn’t just be me, right? So I took to Twitter and typed in “WhatsApp dark mode hate” and “WhatsApp dark”, to see if anyone else is in the same boat as me.
我在黑暗模式下查看了其他一些“受欢迎的应用程序”。 Twitter和Facebook Messenger允许用户在暗模式和亮模式之间切换，而不管用户的电话设置如何。 因此，要么将您的手机设置为亮模式(我不想要)，要么继续对WhatsApp的黑暗模式感到不舒服(这让我很痛苦)。 但是可以肯定的不只是我，对吧？ 因此，我上了Twitter，输入了“ WhatsApp暗模式的仇恨”和“ WhatsApp暗”，以查看是否有人与我在同一条船上。
Good news, I’m not the only one who hates WhatsApp dark mode. Bad news I’m not the only one who hates WhatsApp dark mode.
好消息，我不是唯一讨厌WhatsApp黑暗模式的人。 坏消息我不是唯一讨厌WhatsApp黑暗模式的人。
Comments from Twitter users:
Twitter用户的评论：
Twitter didn’t give me the total number in my results, but you can continue to scroll and see the number of WhatsApp users who are not a fan of the app’s dark mode. But it’s not only Twitter users who have found an issue with the design of WhatsApp’s dark mode, but designers also have picked up on the issue too. Nino De Vries did an article about the aesthetics of WhatsApp dark mode and how bad they feel it looks.
Twitter并没有提供我结果的总数，但是您可以继续滚动并查看不喜欢该应用程序暗模式的WhatsApp用户数量。 但是，不仅Twitter用户发现了WhatsApp暗模式设计的问题，而且设计师们也注意到了这个问题。 尼诺德弗里斯(Nino De Vries)撰写了一篇关于WhatsApp暗模式的美学以及它们看起来多么糟糕的文章。
It hurts my eyes and it bums me out, especially when I think about how I’ll be stuck staring at this dogshit theme a couple of times per hour every day. WhatsApp is my main mode of communication, and they made it ugly.
它伤了我的眼睛，使我不胜其烦，尤其是当我想到每天如何每天呆几次盯着这个狗屎主题时。 WhatsApp是我的主要沟通方式，但他们却使其变得难看。
“They didn’t put a lot of effort in optimizing it”, he continued. “The contrast of the name colors on the mid-gray bubbles is terrible compared to light mode, where the colorful names sit on a crisp, white bubble. This just isn’t friendly-looking, like light mode is. It’s… muddy.” — TNW’s head of design, Alexander Griffioen
他继续说：“他们并没有付出很多努力来优化它。” “与浅色模式相比，中间灰色气泡上的名称颜色对比非常糟糕，在浅色模式下，色彩鲜艳的名称位于一个清晰的白色气泡上。 这看起来并不友好，就像灯光模式一样。 太烂了。” — TNW的设计主管Alexander Griffioen
This is a telling statement from the TNW head of design. He has pointed out the contrast which causes an unfriendly visual look compared to how it is on light mode. The call of it not being optimised does add fuel to the rumours of WhatsApp looking to make changes to their dark mode due to user criticism.
这是TNW设计负责人的一个有说服力的声明。 他指出，与光线模式相比，对比度会导致不友好的视觉外观。 尚未优化的说法确实加剧了WhatsApp因用户批评而试图改变其暗模式的传闻。
WhatsApp are currently testing some new colour changes for dark mode in both the iOS and Android build. — Express
WhatsApp当前正在iOS和Android版本中针对暗模式测试一些新的颜色更改。 — 快递
But the dark mode isn’t only a visual annoyance, it also carries some accessibility issues too. As I mentioned before, I found it hard to read and found difficulty with acknowledging if the text had been bolded or not. I wanted to find out if this was my issue, a dark mode issue or both. My research showed me dark mode can cause “halation” which massively impacts how people with astigmatism perceive digital interfaces.
但是黑暗模式不仅是视觉上的烦恼，而且还带来一些可访问性问题。 正如我之前提到的，我发现很难阅读，并且很难确认文本是否为粗体。 我想找出这是我的问题，暗模式问题还是两者。 我的研究表明，暗模式可能会导致“ 光晕 ”，从而严重影响散光症患者对数字接口的感知 。
“When you see light text on a dark screen, the edges of it seem to bleed into the black background. This is called the halation effect (via Make Tech Easier) and it reduces ease of reading.” Android Authority
“当您在深色屏幕上看到浅色文本时，其边缘似乎会渗入黑色背景。 这被称为光晕效应(通过 Make Tech Easier )，它降低了阅读的便利性。” Android授权
For something I wasn’t completely aware of before, it affects a lot of people.
对于以前我还没有完全意识到的事情，它影响了很多人。
“In the UK, 47% of patients have astigmatic vision correction needs, with 24% having astigmatism in both eyes and 23% being monocular astigmatic, but toric contact lenses only represent 20% of fits.” Johnson & Johnson Vision
“在英国，有47％的患者需要散光视力矫正，其中24％的双眼有散光，而23％的患者是单眼散光，但复曲面角膜接触镜仅占20％的佩戴量。” 强生愿景
And if Johnson & Johnson isn’t enough, this is directly from the NHS’ website.
如果强生还不够的话，那可以直接从NHS网站上获得 。
Astigmatism means your eye is shaped more like a rugby ball than a football, so light is focused at more than one place in the eye.
散光意味着您的眼睛比橄榄球更像橄榄球球，因此光线聚焦在眼睛的多个位置。
This can cause:
这可能导致：
• Blurred vision
• 模糊的视野
• Headaches
•头痛
• Eye strain (you may notice this after concentrating for a long time — on a computer, for example)
•眼睛疲劳(长时间集中注意力后，您可能会注意到这一点，例如在计算机上)
Astigmatism normally occurs alongside short sight or long sight.
散光通常与近视或远视一起发生。
Sources have proven that dark mode makes astigmatism worse. It affects 47% of UK users and according to Messenger People WhatsApp is the UK’s most popular chat app for both ios and android. This could be causing an issue for users, possibly up to 47% of WhatsApp users. WhatsApp doesn’t use a “true black”, so halation may not be as high as 47%, but the research shows, there is a dislike for WhatsApp’s dark mode for visual and accessibility reasons. White on grey is more user friendly but this may still cause issues for users.
有资料证明，暗模式会使散光变得更糟。 据Messenger People WhatsApp称，它影响了47％的英国用户，是英国最受欢迎的ios和android聊天应用程序 。 这可能会给用户造成问题，可能高达WhatsApp用户的47％。 WhatsApp不使用“纯黑色”，因此光晕可能不会高达47％，但是研究表明，出于视觉和可访问性的原因，WhatsApp的暗模式并不受欢迎。 灰白色更加用户友好，但这仍然可能对用户造成问题。
So what could be added to fix this? I propose an option to override the system dark mode and allow users to switch between light and dark mode. Facebook Chat and Twitter allow users to turn dark mode on or off without having to change the theme within their mobile settings.
那么可以添加什么来解决此问题？ 我提出了一个选项来覆盖系统暗模式，并允许用户在亮模式和暗模式之间切换。 Facebook Chat和Twitter允许用户打开或关闭暗模式，而不必在其移动设置中更改主题。
FBC and Twitter allow both options which increase the accessibility, allowing users to choose the best option for them. What they do well is that they make it easy for users to switch between light and dark mode. The option also saves the preference themed so the user doesn’t have to switch each time they open the app.
FBC和Twitter都允许增加访问性的两个选项， 使用户可以为他们选择最佳选项。 他们擅长的是使用户可以轻松地在明暗模式之间切换。 该选项还保存了主题设置的首选项，因此用户不必在每次打开应用程序时进行切换。
线框： (Wireframe:)
WhatsApp leaves a lot of space between the ‘chat’ menu options and the tab bar. Like on Twitter, I would use a light bulb icon to display a switch between light and dark mode. This will open up a pop-up box which would give users the option to switch between light. and dark mode within the app.
WhatsApp在“聊天”菜单选项和标签栏之间留有很多空间。 像在Twitter上一样，我将使用灯泡图标显示明暗模式之间的切换。 这将打开一个弹出框，为用户提供在灯光之间切换的选项。 应用内的暗模式。
第一原型 (First Prototype)
用户测试结果： (User test results:)
With this first prototype, I wanted to test if the bulb worked for users. I was split in-between either going with the bulb or making space between “Chat Backup” and “Archive All Chats” for the dark mode option. I chose the bulb as it was quicker to add, user thumb touch zones and WhatsApp not using that space.
有了第一个原型，我想测试灯泡是否适合用户。 我要么选择灯泡，要么在“ Chat Backup”和“ Archive All Chats”之间留出空间以选择黑暗模式。 我选择了灯泡，因为它可以更快地添加，用户的拇指触摸区域以及WhatsApp不占用该空间。
来自用户测试的评论 (Comments from the user testing)
4/4 found an issue with the bulb. My initial design didn’t take into consideration users using both hands, inadvertently blocking the bulb. From the user testing feedback, the light bulb isn’t the clearest indication. Two users covered the bulb and tried to go back, two felt the option should be placed amongst the other options whereas the other tester found the process a little bit confusing. In my opinion, this is a positive for open/remote user testing. As it’s a PANDEMIC my testing was done remotely by me sending out a link to the users. The only instruction I gave, was the bulb is there to switch from dark mode to light mode. I think it is good to give the freedom to see if your design makes sense to a new user. This would be an update and would be new to users, some may not check the updates or even notice the app has updated due to having automatic updates on. The user testing data suggest that the bulb isn’t the most obvious so wouldn’t enhance the user’s journey.
4/4发现灯泡有问题。 我的最初设计没有考虑到用户用两只手无意中阻塞灯泡的情况。 根据用户的测试反馈，灯泡并不是最清晰的指示。 两名用户遮盖了灯泡并试图返回，两名用户认为该选项应放在其他选项中，而另一名测试人员则发现该过程有些混乱。 我认为，这对于开放/远程用户测试是一个积极的结果。 由于它是大流行病，因此我的测试是通过向用户发送链接来远程完成的。 我给的唯一指示是灯泡在那里从暗模式切换到亮模式。 我认为最好给新用户自由查看您的设计是否有意义的机会。 这将是一个更新，并且对用户来说是新的，有些用户可能不检查更新，甚至会注意到由于已启用自动更新，因此应用程序已更新。 用户测试数据表明，灯泡不是最明显的灯泡，因此不会增加用户的行程。
Users suggested adding the dark mode feature under the “Chat Backup” option which aligned with my alternative placement. With this user data, I can make the changes which fit within the menu options.
用户建议在“聊天备份”选项下添加暗模式功能，该功能与我的替代位置保持一致。 使用此用户数据，我可以进行适合菜单选项的更改。
Learnings from user testing:
用户测试的经验教训：
- How users hold their phones 用户如何握住手机
- Devices and brightness 设备和亮度
- User familiarity with testing 用户熟悉测试
- Identifying the light bulb to switch from dark to light mode 识别灯泡以从暗模式切换到亮模式
Second Prototype:
第二原型：
- I removed the light bulb 我卸下了灯泡
- Added the dark mode option under “Chat Back Up” 在“聊天备份”下添加了暗模式选项
- Removing the “light mode” option and only having dark mode and system settings 删除“亮模式”选项，仅具有暗模式和系统设置
结论： (Conclusion:)
The user testing helped me get to a final design which I think would help users who want to switch from dark to light mode similar to what users can do on WhatsApp web and android. This option is available on Facebook Chat and Twitter for ios. Although both are owned by Facebook, WhatsApp and Facebook Chat are 1&2 for messenger apps in the world. WhatsApp leads in users but FBC is predicted to have 2.4 billion users in 2021. The growing number of users and the ability to switch between light and dark mode could entice WhatsApp users to make FBC their main source of messaging.
用户测试帮助我完成了最终设计，我认为这将帮助想要从暗模式切换到亮模式的用户，类似于用户在WhatsApp网络和android上可以执行的操作。 此选项在iOS的Facebook Chat和Twitter上可用。 尽管两者均由Facebook拥有，但WhatsApp和Facebook Chat在全球Messenger应用中是1＆2。 WhatsApp领先用户，但FBC预计到2021年将拥有24亿用户 。 用户数量的增长以及在亮模式和暗模式之间切换的能力可能会诱使WhatsApp用户将FBC用作其主要消息来源。
It was good to test with different users to eliminate my own design biases. Elements of my design which I thought made sense, didn’t to the users. I am a WhatsApp user but the testers didn’t find the bulb useful which is good teaching for me as I develop my UX career.
与不同的用户进行测试以消除我自己的设计偏差是一件好事。 我认为合理的设计元素对用户而言并不重要。 我是WhatsApp的用户，但是测试人员没有发现灯泡有用，这对我发展UX生涯来说是个很好的教学。
翻译自: https://uxdesign.cc/whatsapp-and-dark-mode-is-it-a-match-42d598cffd32
628
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
