Carbon for IBM.com

Building a design system for IBM.com’s online experience with 40+ million pages.

Hybrid UX/visual – UI components, guidelines, user testing

Lead designer, 2 visual designers, 1 hybrid UX/visual designer (me)

Marketing, content, product management

Overview

Carbon for IBM.com is the design system for all of ibm.com webpages. These web pages range from marketing to Cloud documentation. As you may know, IBM is an old company, a 110-year technology company. With the age and size of the company, over the years IBM.com has amassed over 40 million online web pages, all with different styling and branding.

Our team was tasked with reducing the number of web pages and delivering a more delightful, accessible, and consistent experience through a design system.

The carousel component has long held the reputation of being controversial in the UX/UI community for its lack of accessibility and hidden content. Although this component has questionable value, it does allow users to browse through multiple pieces of content within the same area of the page. I was tasked with building a useful, functional, and accessible carousel component for IBM.com.

The locale change banner notifies visitors on ibm.com when they land on the page not associated with their selected location. For example, let's say my location is set to the United States but I land on a German page from a hard-coded link, the locale change banner will provide the option to continue, go to the United States page, or try a different location.