Skip to content

FEA110: Enhance color contrast for color blindness
Feature ID FEA110
Subsystem the feature is part of UI/UX
Status In progress

Description

This feature enhances color contrast for users with color blindness, ensuring that all users can easily differentiate between different elements on the interface.

ID Description
US046 Users with color blindness benefit from improved color contrast, ensuring better differentiation of interface elements.
FUNC-REQ-C0003 The color contrast should be adjustable for users with color blindness

As a user, I want to be able to search for specific items within the platform for easier navigation. As an administrator, I want to be able to restrict user access to certain features based on their role for security purposes. The User Story related to Feature 110 has been entered directly into the Issue format and can be found at US046.

User Interface MockUp

  • Don't use color as the only element: symbols, error messages and icons need to be visible as well

  • Different textures/patterns in charts and graphs, if there is only colors used before

  • Labeling items that are normally indicated with different colors
  • Clear bolding on links and buttons to indicate them clearly

  • In contrasting the colors, use brightness and tone in addition to hues. If you contrast by color, but maintain the same brightness, elements might look blended or muddled to those with color deficiencies. Contrasting with brightness and tone, rather than only pigmentation, is also much more satisfying aesthetically.

  • Color combinations to use:

color schemes example
Color scheme by NCEAS Science Communication Resource Corner, Alexandra Phillips, 2022
History data charts

The history data charts are not readable as they are in Tukko 1.0, all the chart lines look the same without colors. We need to use different sort of lines, such as dashed lines. Example below:

charts example
Chart example by UK Health Security Agency

MockUp using Paul Tol's Muted color palette, and in different color blindness emulated scenarios

Implementation

  • write here
  • what has been the stages of your work
  • what happend and why
  • etc
  • bla bla

Testing / possible approval criteria

Test Case Description
Acceptance Test Case Acceptance Test
Functional System Test Case Testitapaus