🎨💡 It's a design language system 💡🎨 When working on EarnIn's design system, Forge Studio established a new, unified design language that delivered the same branded look and feel seamlessly across devices, platforms, products, and modes. 🧵
Thread
That means we had to solve for both light and dark modes for EarnIn's existing native iOS and Android apps, while also going 0→1 designing their first responsive web product, with the option of marketing utilizing the system for their marketing website.
How? ✨ Design Tokens ✨ are design decisions that are saved and used to style digital interfaces. Those two beautiful words were coined by the one and only @jina. Check out Clarity Conference. It is THE design systems conference and Jina, the queen of design systems.
EarnIn's design system is architected with a token library where we establish all of the design primitives for styles like typography, color, borders, radii, shadows, and grids that we'll use for semantic use cases i.e. background colors, typography etc to our components and UIs.
We used the Tokens Studio plugin to save these design tokens, sync them with Github and our engineering team's tools. We also use Tokens Studio to create our different "mode" themes for light and dark modes and for any unique brands EarnIn may create.
An example is Airbnb's guest experience is branded coral while host experience is teal. This allows designers to switch their designs between light and dark modes for any of EarnIn's unique brands for their iOS, Android, and web product designs in Figma with only a few clicks.
Forge supported EarnIn's rebrand through a platform-agnostic multi-brand design system that created a new unified, flexible, and scalable baseline user experience that could unify their existing native apps. forge.is/working-on/ear…
EarnIn's Cheddar Design System | Forge Studio | San Francisco-based UI/UX Product Design agency | Design Systems | Brand Design
Forge supported the roll out of an upcoming rebrand through a platform-agnostic multi-brand design system that created a new unified, flexible, and scalable baseline user experience that could unify their native apps, and adapt to their current and future needs, and support the launch of a new product channel going zero-to-one on the MVP of their first responsive web product.
forge.is
✨ Now taking on new projects! ✨ Need UI/UX product design, brand, or web design? Let us know at hforge.is/listening
Inquiries
Need UI/UX product design, design system, B2B SaaS software, brand, or website design for a project or staff augmentation? We'd love to learn more. Contact us and a representative will contact you within 24–48 hours.
forge.is