What Carbon didn't do well was standardize solutions to UX problems. There were dozens of teams working to solve and document common UX patterns with little coordination between them.

Starting from scratch, we each took one of the patterns and did yet another deep dive, conducting internal and competitive research.

Standardizing UX at IBM

The problem:

The Carbon Design System solves simple problems to reduce reinvestment of resources. We only need one dropdown menu. We only need one text input. Carbon provides those resources.

What Carbon didn’t do well was standardize solutions to UX problems. There were (and still are, to a large extent) dozens of teams working to solve and document common UX patterns with little coordination between them. This results in inconsistent user experiences through most common tasks like search, login, and empty states.

The hypothesis:

Most UX problems can be distilled into a set of actions and layouts.

It would be virtually impossible for a single team to address all possible UX problems and layouts a team may need, but there are certain patterns that define an experience in the eyes of a user. If we can effectively document and standardize those patterns across products the broader IBM ecosystem would feel more cohesive.

Research:

I had been working individually with several teams to collect and clean up pattern documentation. We surfaced this documentation under a section on the Carbon site dubbed “Experimental.” This content was intended to graduate to production once it had been vetted and approved.

Through my initial work, we built relationships with teams dedicated to solving this very same problem.

Version one:

Alongside IBM’s VP of Design and User Experience, I worked with a small team to determine a shortlist of the most critical UX problems to solve. Starting from scratch, we each took pattern and dove even deeper, conducting internal and competitive research. We collaborated with subject matter experts from the very beginning and created production-ready solutions that solved the most common UX problems across the web.

Each pattern was played back to and signed off on by IBM Cloud’s Chief Design Officer and our Executive Creative Director of Brand, and we published all eleven patterns in Q4 2019.

You can see all of the pattern documents under the Carbon website’s Patterns section.

Feedback and improvement:

As IBM begins to conduct Design and User Experience (DUX) reviews at a large scale, products will be expected to adhere to Carbon design patterns. Initial feedback from product teams working to migrate to the new UX patterns has been largely positive and we've began work to deliver updated versions of these patterns following vetting in production.

We also discovered that, as our images are abstractions of actual products, we need to be more clear and consistent about layout guidance when we choose to be prescriptive.

See the live Carbon patterns.

We need to select a single way for users to install Sketch and a single way to maintain the kit as a source of truth.

Onboarding designers

The problem:

Most IBM designers use Sketch. When we started this project, there were three ways to get the Sketch kit: Download the kit from Box, download the kit from GitHub, or subscribe to libraries served from Sketch Cloud.

This was both a confusing user experience and a nightmare for the Carbon team to maintain.

The hypothesis:

We need to select a single way for users to install Sketch and a single way to maintain the kit as a source of truth. This will standardize the experience for onboarding new designers and reduce ongoing support requirements.

The research:

At the time, Sketch Cloud was still in Beta and was not build to support distribution of design system kits. There were some issues regarding deployment and maintenance, and we discovered that our docs would have to be rewritten and placed on the site rather than live within the kit.

We also learned that Sketch Cloud held a significant advantage in that it allowed us to push updates to individual symbols. This allowed us to maintain parity between the Sketch kit and our component packages, pushing updates to design and development assets simultaneously.

The solution:

We went all in on Sketch Cloud. We rewrote our designer onboarding experience to support only one method of installation. Each library is automatically installed upon clicking the associated tile on the Carbon site. This allows us to offer context at each step of the way, allowing users to get a handle on the breadth and depth of the system without leaving the initial onboarding experience.

Next iteration:

Growing pains became apparent immediately. The libraries would not install unless users were not on the latest version of Sketch, and as we waned support for our Box deployment, users became frustrated with bugs and lagging updates.

Within a few weeks, however, we found questions regarding our Sketch onboarding experience slowed to a near-halt and we are rarely contacted about an onboarding issue for new users. While we lack empirical data from that period, questions about our designer onboarding have dropped to near-zero.


See the Carbon onboarding guide.

If we all took just a moment out of our day to check in and see how we felt, we’d be mentally healthier and happier.

We built an app called Vibrant which was centered around a “mood ring.” Users simply dragged a selector around a ring, choosing from a set of moods they felt represented their day.

Vibrant App

The problem:

People do a lot of thinking. We’re stressed, we’re overjoyed or, more often, we’re somewhere in the middle. It’s not always easy to see the tunnel’s exit when you’re deep inside of it, and people aren’t great at recognizing patterns in their mood.

There isn’t a great way to visualize these peaks and valleys, nor a good way to simple check in with yourself on a daily basis.

My hypothesis:

If we all took just a moment out of our day to check in and see how we felt, we’d be mentally healthier and happier. There’s a market for a simple app that quickly logs how a user feels but it has to be beautiful and pleasant to use.

Research:

This was a project we took from ideation to creation to market. We conducted three focus groups, met with several startup founders in Austin, spoke with psychologists and therapists and conducted weekly user testing sessions each week over a three-month period.

Once we had our app in beta we deployed it through Apple’s TestFlight program, getting it into the hands of hundreds of test users and collecting additional feedback from users well outside of our sphere.

The solution:

We built an app called Vibrant which was centered around a “mood ring.” Users simply dragged a selector around a ring, choosing from a set of moods they felt represented their day. Those results were shown on a “spectrum” to recognize trends as well as a calendar, allowing users to see how they were doing during a given time of their life.

Feedback and improvement:

The app was downloaded more than 2000 times in over a dozen countries. We received all but one 5-star reviews and glowing feedback from our users.

I led our presentation to a panel of judges that included Robert Metcalfe, the inventor of Ethernet. Vibrant was awarded Best Design and Best Overall at the UT Journalism Demo Day.

We have received mountains of feedback since launch, specifically regarding how limited the scope of the application is. Unfortunately, the app was not updated for several months and was recently removed due to a security vulnerability. We hope to reconnect and relaunch the app with increased functionality.


Read more about Vibrant.