CONTENT DESIGN . RESEARCH . DESIGN DOCUMENTATION
OVERVIEW
Early in 2022, I was tasked with coming up a color design documentation plan for Ascensus. We worked with 21 states across the U.S and each state had one primary color that was going to be used in our User Interface at a given time. The goal was to group colors based on the roles they play on the interface.
MY TEAM
Solo Product Designer with guidance from the Design Director and other designers.
MY ROLE
Responsible for research, working on documenting colors for Government savings team.
TIMELINE
June 2022 -August 2022, Launched in August 2022
Documentation
Surface Colors
Surface colors are colors that are placed on the surfaces of the screen such as top navigation, bottom floating navigation and cards.
Global Colors
Global colors are foundational colors that are used across all the plans.They are assigned color roles across our UI and are used in expressing interaction states, background colors, errors, warning and success states.
Background Color
This color is used on the backgrounds of all screens.
.png)
Interaction Colors
These colors are for things like links, hover states and selected other interaction states.
Action Hovered
The color affects the action buttons when hovered.
Action Selected
The color affects the action buttons when selected.
System Colors
In addition to key colors, the color system includes semantic color roles for error, warning and success states.
Grayscale/Tonal Values
