San Francisco Design Week, the regional festival that showcases the intersection of ideas, design, business and entrepreneurism, recently wrapped up in the Bay Area, and Trulia was proud to be a participant. We hosted a panel bringing together designers, engineers, and managers from SF tech companies to discuss the nuances of working in design systems.
For those who aren’t as familiar, a design system is a set of principles for creating new design for a specific brand or product. Often times, it includes a set of components and rules that outline how and when to use those components. Today, in the digital product world, design systems scale design by allowing engineers and other non-designers to build on-brand experiences. The goal is to accelerate the proliferation of products while ensuring a cohesive and coherent experience for consumers.
For the panel, we hosted folks from Asana, LinkedIn, Salesforce, Slack, and Stripe to discuss design systems with us and more than 150 people attended. It was a great night! Following, we sat down with Trulia’s own Senior Director of UX Design, Eric Bailey, to learn more about the event and design systems in general.
What were three key takeaways from the panel?
- Treat Your Design System Like a Product – if you treat your design system like a product, you’re working to refine its usefulness and invest in its continued improvement. This entails continually gathering feedback and iterating on it, having a communication plan for new releases and updates, and implementing a process for decommissioning components.
- Democratize Don’t Weaponize – it’s important not to forget that the intention of a design system is to enable others to create and build. Systems are meant to democratize design, making non-designers the actual beneficiaries of our work. There was a great discussion about “policing” our partners too – reminding us that shaming or disparaging them for not adopting or implementing a system creates enemies. In the worst cases, the design system can become a weapon driving a wedge between disciplines. There are a few ways that can be prevented:
- Remember that new thinking doesn’t happen overnight and adoption may be slow. Start off by enrolling a small group of enthusiastic partners.
- Celebrate those who show interest and participate.
- Allow everyone to help define what “good enough” is. Everyone should own the system and feel encouraged to help define the standards of quality.
- New Opportunity for Engineers – compelling stories were shared about how engineers who promoted design systems were ascending as thought leaders in their organizations. The design system offers new surface area for engineers to sharpen their skills and cultivate influence among their peers and reports. Some of the panelists on-board every new engineer to the design system by having them work on it. This enables them to create a culture of acceptance and collaboration.
How does Trulia use design systems?
Our design system at Trulia is called the Trulia Experience Language – TXL. It’s in its second iteration and the third iteration is being developed as we speak. This entails a consistent set of user interface components and patterns that designers and engineers can use.
We also have a design system called Multi-brand UI. We developed this last year to streamline how we apply unique visual languages from each brand under our parent company, Zillow Group, to shared products and services. We essentially “whitelabel” the transactional services that underpin all our brands. This creates a beautiful and appropriate experience for our consumers while ensuring our business goals are met.
How has Trulia’s design system evolved over the past five years?
Our earliest design systems were much more local to the design discipline. They began as a set of user interface components that designers would share to ensure a consistent look and feel. Patterns evolved next, which comprised of interactions and the guidelines for when and how to apply them. Over time, our system has evolved to enable and accelerate the engineering process. By offering engineers reusable objects in code, they are able to quickly order and place without generating new code. A handful of our engineers have spearheaded this effort. They work closely with the design team and engineering peers to build out a suite of tools for developers, which is great!
What advice do you have for those who are just getting into design systems?
Take it slow. Think about the problem of scale that you’re trying to solve. As with any product, start with the most important and most achievable piece to bite off. Ask yourself, “Is the system making your designers more efficient?” and, “Is it allowing non-designers to design?” If the answer is yes and yes, start there. Remember there are product managers, marketing managers, and engineers that are wrestling with the same problems. Ask them for help. Work together. And remember to have fun.
We love talking shop and hosting meet-ups in our office. If you belong to a group and are looking for a free event space in SF, email us at zgmeetupspace@zillowgroup.com. And, if you’re interested in joining our team at Trulia, check out our open positions here.
