A common question is how to encourage organizations to elevate the importance placed on design, and design systems in particular. Executing the creation and management of a design system is a task that required the support of executives and leadership. However, at companies like Twitter, leadership is taking the first step in putting design first.
With design initiatives kick-started directly from executives, Twitter has been able to accelerate their pace of innovation and creation, allowing projects to scale at record speed. One of these projects, a design system for all Twitter consumer products, was again sponsored by leadership.
Related: Twitter’s Dan Saffer on design systems vs. the designer
Twitter Senior Product Designer Ashlie Ford recently outlined the steps to creating the internal design system at Twitter, named Horizon. In Ashlie’s words, the goals for Horizon were to bring cohesion across platforms, provide a summary of trusted resources, and look towards the future without recreating the wheel. Horizon was sparked by the lack of consistency across the growing Twitter design team, who needed a system to ensure alignment across all products.
“Without this centralized documentation, our team couldn’t scale properly. Knowledge was confined to specific people, resulting in those individuals having to meet with others regularly to discuss the same topic over and over again,” said Ford.
The Twitter design team rolled out the Horizon design system internally like they would roll out a public Twitter feature, with clearly identified goals, research, and a roadmap.
For consistency, we take the long view. Read why we created our design system, Horizon.https://t.co/z0gUxaIry9
— Twitter Design (@design) December 11, 2017
Intrigued by the connection between executives and the design team, InVision spoke to Tina Koyama, Product Design Manager at Twitter, who says it’s one of the most exciting times to be a designer at Twitter.
Tina notes how the process of building Horizon was seamless, due to the existing value placed on design by Twitter executives. Twitter clearly stands out when examining the direct connection between executives and design decisions.
“I think the fact that we have our VP of Design + Research directly report into Jack Dorsey, our CEO, represents the importance on design very clearly,” says Tina.
“The effect of that trickles down to every layer throughout the company which is why you’ll see Design and Research being peers to Engineering and Product in every single stage of the product making and decision process.”
“It’s really one of the most exciting times to be a designer at Twitter.” –Tina Koyama, Product Design Manager at Twitter
When asked on how valuing design manifests at Twitter, Tina points to one of the Design + Research team’s biggest accomplishments as shifting the entire companies focus to a “Jobs to be done” framework. This framework being extremely user centric, naturally empowers the Design + Research team.
“Our product teams are built around ‘EPDR’ groups, which represents Engineering, Product, Design and Research. The team leaders are EPDR, and the individual contributors are EPDR, so designers and design leads are represented throughout the product making and decision process,” says Tina.
“By reporting to Jack directly, it also gives us the freedom to explore other opportunities, ideas, and vision that might be outside of our core product roadmaps.”
The freedom to create and innovate outside the Twitter Design team’s roadmap, with direct approval from CEO Jack Dorsey, seems to be key in making sure Twitter continually improves their product offerings for both employees and users.
“Without this centralized documentation, our team couldn’t scale properly.”
As Horizon was encouraged by leadership, the first step in building the design system was internal research to identify the barriers and challenges each team faced. Tina points out that every designer and engineer at Twitter is a part of the system, and Horizon was essential in helping to facilitate collaboration and encourage designs that work across the product and not just in one scenario.
“We had slightly different UI treatments for the same exact thing across the product, which was impacting the ease of use of our product,” says Tina. “So, we conducted internal research to find out what we could do to solve this and one of the outcomes was that we needed a design system.”
“We’ve invested a lot of time in establishing a system working closely with back-end, front-end engineering. This ultimately helps us elevate the quality of the designs and makes them more scalable. Horizon also played a big role in enabling our redesign last year, which was built and shipped at record speed and will keep doing so for our future product launches.”
We've been doubling down on our design system and tools. Great presentation today by the team. We'll be sharing more on this soon! pic.twitter.com/TsVSOSXKOe
— Twitter Design (@design) May 11, 2017
Tina reveals that her team is planning a blog post detailing exactly how the importance of design systems was communicated from the top down. On a final note, she adds that is it essential to understand that a design system is as much of an engineering effort as it is design.
“Design systems help improve communication across engineering and design and avoid tons of tech debt, which is why engineering gets as much, if not more, benefit out of it.
Another final thing to highlight is that maintaining a design system is crucial to its success.
“If your design system accounts for accessibility, adapts to different screen sizes, networks, and languages, you also enable your own product to scale—so you can reach everyone on the planet more easily.”
Twitter invests a lot in their team culture, which their blog does a great job at highlighting. One of the posts also talks about efforts around design systems and design tools, which was sponsored by Twitter leadership.
Header image by Michie Cao.
Want to learn more about how InVision and other companies are using design systems? Check out the Design Systems Handbook at DesignBetter.Co.
by Jess Thoms
Jess is a writer and brand strategist, focused on championing innovative ideas in tech, design, and marketing. She is the co-founder of conversation design studio Xandra, Inc.
