#BLUE COLOR UI DESIGN FULL#

I have learned that color is not reliable and there are no two people that see one color the same, same as not two screens show it the same way. And something that I have been doing lately with all my projects related to color… I decided to stop focusing on color. This iterations in the color palette imply a high cost on our development side and the reasoning behind the changes better be strong and informed.Įventually, I decided to pause on the work take a step back, and look at it from a distance. At this point, I started thinking about the reason behind adding certain colors and leaving others out.Īnd that’s when all the problems started. 😀🔫 And that’s when I realized that I was actually not adding all colors. So with an aligned tint system that worked across all colors, I started adding the rest of the hues we had in mind. Left: luminosity, right: achromatopsia vision And there is nothing that can be done about that but learning to take advantage of these intrinsic peculiarities.

The saturation of spectral hue is perceived as part of the color’s luminance. It is a perceptual phenomenon that makes colors with approximately the same luminance level not appear equally bright or dark. Achromatopsia also gives us an idea of how the phenomenon of Helmholtz–Kohlrausch effect affects how we perceive color. The luminosity of each color and achromatopsia vision gives you an estimate of how different colors behave. Not all colors were going to behave the same, as luminosity changes from color to color and that is decisive in determining the color's behavior. I was constantly going back and forth comparing the ones imported from colorbox.io with my own.

#BLUE COLOR UI DESIGN FULL#

I would show you all a screenshot of the artboard at that point but I guess you imagine the mess… It’s full of (too) many different stripes of different colors to understand how they behaved. That’s why even though I started working with colorbox.io, I finally decided to generate our own system. I needed to figure out a consistent system for the generation of our color tints throughout all hues. Working with the color wheel side by side I was comparing the colors we had and the ones we wanted to add. The goal was to generate a big palette that could be used cross-department while keeping it consistent and functional for future work. It is very difficult to know what the needs are going to be for the future, so flexibility is key here. We decided that if we were to allocate the time and resources to rethinking our palette, we were going to be generating the palette for the future: full flexibility and well defined to meet accessibility standards, as well as product and marketing needs.

Right now we are not using many illustrations, less colored illustrations…but what if in some years we decide we want that? Alongside our brand colors, we needed a palette to help us all design better. The marketing department also wanted to shift their use of color for their branding material, so we were all starting to have different color needs. One of the main problems was that the palette was not making it easy to be compliant with accessibility. With the number of products increasing within TrustYou and with the need for new graph visualizations throughout the entire tool, we started to be concerned about the lack of flexibility of our color palette.

Blue color ui design