Feather: a design system for Twitter Business products
Design and engineering should spend less time deciding on buttons, and more time on the customer problem
Ongoing | Roles: contributor, design lead, and evangelist
A strong repositioning turned this Hackweek project into a most valuable front-end development platform that's led to massive gains in efficiency and quality.
THE CUSTOMER
Internal full-stack engineering teams, as well as the Twitter product design team.
THE PROBLEM
The Twitter Ads platform has grown very quickly over the last five years. Part of what allowed us to grow so quickly was the chance to ship fast.
Without a core component library to conduct front-end operations out of, project teams would oftentimes use project-level style sheets that resulted in compiling conflicts and irregularity in the customer experience. With lots of of shades of gray, many button styles, and a blooming portfolio of text sizes, we had to reign things in.
All we had to do was convince engineering, product, and design leads that was a good idea.
Process: whiteboarding
Process: mid-progress
THE SOLUTION
During a winter hackweek, we reimagined what our business customer platform might look like and gained so much excitement that the win caught us by surprise. Problem was, as a fast-growing part of the business, a full-scale redesign would be irresponsible if not impossible.
We repositioned that redesign as a North Star and we'd use basic components as waypoints to get to that long-term state. Starting with colors, button styles, and typography, we showed value not by what we added, but what we took away. Less micro-decisions for our customers, less time making decisions as a design team, and a whole heck of a lot of code to delete.
SELECT PRODUCT VIEWS
RESULTS
We now use the component library in over fifty products at Twitter including Ads and Analytics. The greatest benefit though has been cultural. Individuals across the company contribute to the project and reinforce the project's strength across a smattering of customer needs.
We keep an open eye towards a public release.