We also decided that we needed toolbars and menus that were already dark in light mode to stay dark.
For example, we immediately knew we wanted the light panels in the editor to become dark in dark mode, with light icons and text as foreground elements. Before we even thought about writing a line of code, each team member audited the surfaces in the Figma app to see how difficult it would be to recreate those pieces in dark mode. Understanding the challengesĪs the engineering lead for dark mode, I wrestled with which challenges to tackle first: those specific to the UI, and those pertaining to the scope of the entire project. And, we wanted to do both while building for the future state of Figma. These considerations informed two main goals for the workstream: Enable Figmates to design and develop new features in dark mode out of the box, and make it easy to introduce new themes to Figma and FigJam. In other words, we didn’t want to break things across the app while trying to experiment with different solutions. The trick was developing an approach that would be easy to implement and maintain, while also ensuring that it was regression proof. Doing so would make it easier to onboard new engineers, tackle unforeseen challenges, and introduce new themes down the road. We wanted to build a solution that wouldn’t just solve the existing need for a new feature, but would be flexible enough to scale with us as the product evolved. But we quickly discovered that the project was much more complex than that. On the surface, implementing dark mode seemed like a straightforward front-end change: Simply swap every light color for a dark one. As they said in their talk, “One of the hardest things about dark mode is that people think it’s easy.” Not only did dark mode surface thorny UI questions-which Jacob and Ryhan talked all about-it required a significant engineering lift. Product Manager Jacob Miller and Product Designer Ryhan Hassan detailed the product and design challenges of implementing dark mode at Config 2022, our annual conference. So, after months of toiling over the right approach, we shipped dark mode in May. (Visual contrasts are a core tenet of the W3C Accessibility Guidelines 3.0 standards, and we wanted to make sure our dark mode efforts satisfied those requirements.) That meant that delivering dark mode for us was more than just answering a user request-it mapped back to Figma’s core mission of making design accessible to all. Designers were tired of being assailed with a bright screen when working on Figma files late into the night, and studies have shown that people with visual impairments find dark mode more legible than light mode. Over the last couple of years, one feature emerged as our top user request: dark mode.
0 kommentar(er)
