Background
The Cloudera Product Design System had been created, however, it was very outdated and had not been updated in quite some time. It also had not been updated to achieve WCAG Accessibility standards.
Objective
To update the Design System components with correct variants within Figma as well as the Design System website so that Engineers could more easily grab code snippets. Also, to ensure that the components were meeting Accessibility standards. Another objective was to update components based on a company rebrand.
Responsibility
Lead UX/UI Designer, working with the Design Team Manager and a team of ~15 Designers, as well as a small team of Engineers to ensure that the Design System was continually updated in order for the team of Designers and Engineers to utilize it, and also ensure that it was meeting Accessibility standards.
Methodology
We utilized the Double Diamond approach to conduct market research, user journeys via Miro in order to collaborate with team members. Iterative usability testing and surveys were used after creating user profiles to guide our decisions. Design and content approaches were examined to identify improvements to overall navigation within a suite of ten products, as well as layout, and UI elements throughout the suite of products.
Creative Phase
Building upon the existing Design System, I worked with the design team and design manager to create a priority-based plan to update the existing Design System and then expand upon it, as well as an audit of all components for Accessibility purposes. Once this plan was approved, I began auditing and updating/adding the Figma components for the design team to utilize, as well as updating the Design System site accordingly so that both Designers and Engineers could utilize the updated components.
Initial Design System Updates
These are a few examples of the initial Design System Updates, prior to the company rebrand.