Overview
My role
Product designer, Design Systems
Team
Design Systems
Timeline
~2 months
Deliverables
Figma component, Documentation, API handoff
Summary
I conducted an audit on the Base design system, identified accessibility gaps related to tap target and usability guidelines, and improved the overall component build to increase usage and behavior comprehension.
Method
This project follows the established component creation and lifecycle process, established by the design systems team, to ensure a high bar of quality is maintained across every project.
Intuitive and give the user a clear sense of their location within the content.
Visible and easy to differentiate from each other
Placed in a consistent location to ensure users can find them quickly and easily.
Missing numbered pagination across the board.
These components are dependent on other elements on the screen, so while it may seem like a simple component, there was a need for clarification on usage and behavior of this component in context.
The color and size of the page control component didn’t meet accessibility standards.
The behavior of progressing through the indicators was inconsistent across the ecosystem.
The assets are outdated and requires updating to uphold the quality and hygiene of the component.
Enhance the versatility of this component to support more use cases.
Revision 1
These are the top 3 explorations from the first attempt
Revision 2
Revision 3
