Samsung Know is a business platform for configuring mobile devices offering efficient in various industries. Know Cloud Solutions allows businesses to customize, deploy, analyze and manage their devices.
Diverse data visualization colors have been used on dashboard in KCS products, but there was not official categorical color palette.
Establish an official categorical and sequential color palette for the KCS products' dashboard to improve accessibility and visual consistency. And create comprehensive color guidelines for consistent usage across various data visualization scenarios.
I conducted research for 7+ established color design systems. The research goal was to gain a better understanding of categorical and sequential color and to determine the best way to build the accessible color palette for data visualization.
What can we improve
01
02
03
04
Selecting categorical colors presented a challenge. Beyond defining the color palette, the sequence in which colors are applied to represent data sets significantly impacts accessibility.
The sequential color palette is designed to visualize high to low values for different measures. The sequential color palette of 10 colors derived from the Samsung One UI blue color is ideal for representing progressive data. Its visually cohesive range enables clear data visualization from low to high or in a specific sequence.
01. Blue 90
02. Blue 80
03. Blue 70
04. Blue 60
05. Samsung Blue
06. Blue 50
07. Blue 40
08. Blue 30
09. Blue 20
10. Blue 10
01. Red 10
02. Red 20
03. Red 30
04. Red 40
05. Red 50
06. Red 60
07. Red 70
08. Red 80
09. Red 90
10. Red 100
Although I tried all the colors that are 3:1 contrast-accessible against the background, it is challenging to keep them all accessible to enhance the visualizations’ readability.
For additional accessibility, the divider line is more important in charts using the categorical palette because colors are used here to differentiate between categories.
Also, hover tooltips are necessary to communicate more detailed information without overcrowding the visualization. KCS data visualization color has tooltips to enhance visual distinction and ease of recognition.
After a lot of wrestling and iteration, I landed on a solution to create categorical color palette.
The categorical color palette consists of 12 carefully selected colors to distinguish categories visually. The categorical color palette offers district colors that can be applied to represent different categories or groups. The spectrum categorical 6-color palette has been optimized to be distinguishable for users with color vision deficiencies.
The color usage guideline can provide a clear framework for consistent and effective color utilization in our data visualization.
Designing together
As a UX design intern at a big tech company, I realized that many people have been spending time to solve users’ problems. They have reviewed data, iterated prototypes, and discussed constantly.
Asking and listening to them, I learned much more than I could have discovered in 14 weeks. I could get great feedback about how well my suggestions could improve users’ and businesses’ needs. I felt lucky to have been surrounded my passionate people, and I enjoyed working with them.
Accessibility and Effective Communication through Color
Accessibility and Effective Communication through Color
I deepened my understanding of the connection between color contrast and accessibility in design. I recognized the importance of creating inclusive visuals catering to diverse users. I also discovered how the strategic use of color can significantly enhance data communication by guiding users' attention, emphasizing crucial information, and understandably presenting data.