CNN Design System

The Problem

CNN Digital operated as separate teams. Without a design system in place, it was common for overlaps and redundancy in the components built. There wasn’t a consistent user experience because of lack of guidelines and documentation. How might we increase speed and efficiency in our build, test and learn process?

My Role

  • Organized first ever design/engineering summit to determine the role of a governing design system across CNN Digital.

  • Presented a business case for establishing a Design System cross-functional team to CNN Digital leadership.

  • Secured funding for Design System team (including design, engineer and product). Currently recruiting and onboarding members for the Design System team.

  • Outlined team and strategy for the Design System.

  • Drove the RFP process to identify a 3rd party vendor to help with DS ramp up.

Dot voting exercise to establish Design Principles

Working on our Design Principles

The Tasks & Activities

  • Align design leadership around the role of a design system at CNN.

  • Establish contribution and governance model.

  • Stand up Figma design libraries.

  • Develop the hub for live code components and Design System documentation.

The Results

  • The business has approved positions for a full product team and a budget of $950K towards a DS vendor.

  • I learned how to manage my team through extreme uncertainties.

  • Empathy and relentless proactiveness are the best ways to gain organizational alignment.

  • The combination of perseverance, preparation and opportunity was key to the CNN Design System journey.

Contribution workflow and governance model