top of page

The Rise of Dark Mode: Understanding its Impact on UI/UX Design




It’s no coincidence that most applications and sites now have dark and light mode options. Dark mode was introduced as an option on electronic devices and in software applications to provide an alternative viewing experience for users. This was brought by a 2003 study by An-Hsiang, which discovered that participants could read and absorb material more quickly when it was displayed with a light-on-dark color scheme. But it wasn't until 2017 that the phrase "Dark Mode" gained popularity once more. When Sylvian Boyer added Dark Mode to cellphones with OLED screens.


Dark Mode's goal is to lessen the amount of light that device screens output while keeping the minimal color contrast ratios necessary for legibility. Consequently, you can increase the battery life of your smartphones while lowering the strain on your eyes. All of this was accomplished while improving the UI experience with a simple, sophisticated design. A design many users have found to be more visually pleasing and easier on the eyes. As a result, many apps and operating systems started to include a dark mode option in their software. From Twitter, Gmail, Instagram, YouTube, Reddit, and even Wikipedia.


You’ll find that my phone’s wallpaper and most of my apps are always in dark mode. So do other 91.8% of mobile phone users, according to Android Authority and Polar who agree that dark mode is easier to use.





But the concept of Dark Mode is not new, even though the name may be. Dark Mode was the standard on computers as early as the 1970s. The iconic black background and green text were the default screen until computers became mainstream. The dark mode was changed to light mode to resemble paper. This was because it had to look familiar to non-coders and non-programmers.


Dark mode is arguably the ultimate refined version of the first-generation computer screen. And it didn’t get here by accident. Dark mode gradually evolved from inverted screen colors, anti-glare tech, and night mode.


Why Users Need Dark Mode.

As you may already be aware, programmers frequently write code in dark mode. Ever questioned why? They spend roughly 10 hours a day in front of a screen coding. Human eyes are adapted to seeing dark objects (like people or mountains) against light backgrounds due to our sunlit sky. But no one can stare at the light for a long time. So, it makes sense that coders utilize a dark screen because if they didn't, their eyes would quickly tire.


The average user spends 6 hours and 58 minutes each day and since 2013, daily screen time has climbed by about 50 minutes. You would agree that dark mode makes sense as a remedy to issues for our digital habits (such as eye strains or screen-induced headaches). Dark mode improves user experience by making it more comfortable for them to use their devices for longer periods, especially in low-light environments.


82.7% of participants in a recent poll, when asked if they use their operating system's dark mode gave an affirmative response. Another 64.6% of respondents believe dark themes should be applied automatically. You should also keep in mind that Apple iOS dark mode has a 55–70% adoption rate.





These are all exciting statistics but you need to take note of the group that has resisted dark mode so far. And why haven’t applications and sites gone dark altogether but left the options for both dark and light modes?


Challenges and Opportunities

1. Color Psychology: Due to the feelings that dark color schemes can arouse; some designers still choose light color schemes. For example, black and grey are occasionally regarded as "negative" hues in most cultures. It is linked to evil, mystery, death, despair, and mourning. But dark colors are also related to elegance and luxury. Think of tuxedos, business suits, and the "little black dress" when picturing formal attire in the West; it is often black or a dark color. High-end products like luxury vehicles, clothes, and other items are frequently dark in color.





Factors like these seem to impact the considerations on how dark colors are being employed. So as a UI/UX designer, think about how you want to position your product when deciding whether to use a dark design for your UI.


Dark color schemes could be a wise choice if luxury is one of your brand's primary selling points. However, as dark hues can be divisive, it could make sense to allow the user to make their own decision.


2. The Eye Strain Argument: It’s been mentioned in the earlier part of this article that the average individual today spends a significant portion of their day staring at screens. In actuality, the typical American adult uses screens for more than 10.5 hours every day. Due to the increasing importance of digital technology in our cultures, there is a growing concern regarding eye health. The American Optometric Association reports that 58% of adults have suffered "digital eye strain" as a result of using a gadget.


But as mentioned in the earlier part of this article, eye strain and many other factors, like aesthetics, contribute to users' preference for dark mode. Some users assert that dark mode is less taxing on the eyes. On a closer look, is this assertion true?


Currently, there is no solid scientific proof that using dark mode can lessen the likelihood of eye strain. Dark mode can make it more difficult to see by dilating the pupils when it is well-illuminated. Except when dark mode is in low lights, then, it helps to reduce eye strain.


So, regarding eye strain, experts advise not to worry too much about dark mode. But to avoid dry eyes by taking regular pauses from the screen or apply artificial tears.


3. Accessibility: Sadly, dark mode creates an accessibility challenge for users with myopia or astigmatism. This is because for these people, a phenomenon known as "halation" (from the word "halo") causes light text on a dark backdrop to look hazy or blurry.

However, users who have photophobia, keratoconus, or other diseases that make them even more sensitive to light than the average person benefits from the dark mode features.


This points out once again the importance of allowing users to switch between light mode and dark mode. This would help to maintain your apps and website's accessibility to everyone.


4. Sleep: Some users like to activate the dark mode to limit exposure to blue light at night. Blue light has been found to interfere with sleep cycles by preventing melatonin, (the hormone that helps control the body's sleep cycle,) from being secreted. Apart from this effect, the extent of blue light’s negative impact on our health is yet to be determined. But dark mode has blue light too! Users can only decrease their screen light, in addition to using dark mode, to reduce blue light.


5. Focus: Although some companies have maintained that using dark mode can enhance focus and concentration, no scientific evidence supports this. In reality, studies have shown that reading comprehension, speed, and task performance are all negatively impacted by light text on a dark background.





Dark mode may, however, help with reducing screen flicker. The flicker is too tiny to be seen and has been found to interfere with focus. This flickering may be reduced with a dark background, thereby enhancing focus.


6. Battery Life: Finally, it is frequently asserted that dark mode extends battery life. This is accurate, at least for some gadget types.


Devices with OLED panels have longer battery life while using the dark mode. This is because OLED screens only illuminate the colorful pixels while leaving the black ones off.


On an OLED screen, the "blacker" the dark mode, the more power will be conserved. According to a study from XDA Developers, dark modes with designs in pure black conserve slightly more power than those with designs in dark grey.


However, there was only a 0.3% difference between the two. Battery life hence might not be a key factor if you are undecided about whether to utilize pure black or dark grey in your designs. The obvious opportunity here is designing a mode that increases the difference in battery life.


What Does Dark Mode Mean For UI/UX Design

The rise of dark mode should affect the way you approach interface design as a UI/UX designer. Think and research more critically about color contrast and readability. You must ensure that the text is legible and the colors are contrasting enough in both light and dark modes. Furthermore, you must ensure that the visual hierarchy is maintained in both modes and that the interface is accessible to users with low vision.


You have to consider both light and dark modes when designing interfaces. Consider the challenges in dark mode as an opportunity like Twitter did when they discovered that users spent more time in-app with dark mode enabled. And they went ahead to provide users with dark, grey, and light mode options.





Dark mode should also affect the way you approach interface development if you are a developer. Ensuring that the colors are inverted correctly and that the contrast ratio between text and background is high enough for users with low vision. Additionally, ensure that the interface is used in both light and dark modes and that the user can switch between modes easily.


The same goes for product managers and stakeholders. You have to consider user experience in terms of both light and dark modes. Ensure that the interface is used in both modes and that users can switch between modes easily. The interface needs to be accessible to users with low vision and other health issues. Consider if the contrast ratio between text and background is high enough as well.


And as dark mode continues to gain popularity, designers and developers must stay informed about the latest trends and best practices to create effective and inclusive interfaces.


Conclusion

Apple had always exercised strict design control over its products but with the release of iOS 14, customers can now personalize icons and home screen widgets. It seems Apple has also come to recognize the importance of user preference in product design like so many other companies. So, the rise of dark mode in UI/UX design has been and will always be about the impact of users’ preferences on design.

Maybe in the near future user accessibility would include being able to build any theme they want rather than having to choose between light or dark mode. Also, as more platforms and devices adopt dark mode, and as research continues to grow, dark mode would hopefully evolve to accommodate more health-related considerations for user experience and accessibility.


Are you interested in learning more about dark mode or UI/UX design as a career path? Look no further because it has been made easy with the GoCreate USA mentorship program - a key part of our Bootcamp experience. You also have the opportunity to work as an apprentice with our partners and work on live projects.


Check out the Brave Achievers GoCreate website for opportunities for training and mentorship.

45 views0 comments
bottom of page