Resolver Dark Mode
Customers had long awaited the implementation of dark mode on Resolver’s CORE platform. Their frustration had been mounting as they were accustomed to utilizing dark UI on other platforms and were eager to maintain consistency across all the platforms they use daily. We built an experience enabling users to seamlessly transition to dark mode in CORE if their browser was already set to a dark theme.
My Role
Designing dark mode and building dark component library for the entire web application.
The Team
Lead designer working with a senior PM and 8+ engineers
Building component library for dark mode
A key deliverable of this effort was to create a comprehensive library with dark theme to empower designers and developers to seamlessly continue building future dark theme features.
User Preferences
We heard from customers that if dark mode is enabled in their browser, they are highly likely to use dark mode in CORE as well. However CORE is a text and data heavy platform and it’s not always recommended to use dark theme for such use-cases. This meant relying on browser settings alone without the ability to change themes would be a frustrating experience. We built an experience where dark theme would default to browser settings while allowing users to change to light mode if desired.
Onboarding users to dark mode
No exceptional feature is truly complete without an outstanding onboarding experience. We showed a pop up as soon as users logged in to:
📣 Announce the release of Dark mode to all users.
🧠 Explain where and how they can access theme settings.