Project

General

Custom queries

Profile

Actions

Bug #19462

closed

Use WCAG standards to decide on new color scheme for wb2

Added by Sarah Zaranek over 2 years ago. Updated over 2 years ago.

Status:
Resolved
Priority:
Normal
Assigned To:
Category:
Workbench2
Story points:
-
Release relationship:
Auto


Subtasks 3 (0 open3 closed)

Arvados - Task #19433: Change cyan color and light grey in color scheme ?ResolvedSarah Zaranek12/20/2022Actions
Arvados - Task #19457: Change cyan color of buttonsResolvedSarah Zaranek12/20/2022Actions
Arvados - Task #19857: ReviewResolvedStephen Smith12/20/2022Actions
Actions #1

Updated by Sarah Zaranek over 2 years ago

same for icon -- he Web Content Accessibility Guidelines recommend a contrast ratio for images of at least 4.5:1

nice read here for accessibility and icons -- https://blog.hubspot.com/website/accessible-icons

Actions #8

Updated by Sarah Zaranek over 2 years ago

  • Status changed from New to In Progress

Made a presentation of how to pick a color scheme and also other issues with accessibility for wb2 here:
https://docs.google.com/presentation/d/1HNrhvK7zVZ7jgH3ELbX7KB97SdXCZXrvov_I4Oe1l2c/edit?usp=sharing

Actions #9

Updated by Sarah Zaranek over 2 years ago

Working on a final version to discussion on the branch -
19462-colorscheme

Actions #14

Updated by Sarah Zaranek over 2 years ago

These are what I adjusted
  • Updated process colors, removed yellow and orange and blue, colors either red, green or grey. Green and grey adjusted to meet WCAG contrast requirements.
  • Process chips updated to be outlines when running and filled when finished
  • Updated use of grey 500 to gray 600 when needed
  • Updated Arvadospurple and Arvados primary, to just use shades of blue
  • Updated warning and failed messages to match WCAG contrast requirements , lettering now not yellow or red but grey and background colors stay the same
  • Updated label colors in process panel and collection panels so that they are darker grey and meet contrast requirements
  • Updated label and icons for different panels on collection and process pages
  • Updated color of folders and subprocess icons and file icons to all be the same color of grey in process directory and other locations
Still need to do:
  • "No properties" still in default font and color
  • labels for subprocess columns and for labeling panels for input/outputs need to be a darker grey
  • Update font sizes for everything that is too small
Actions

Also available in: Atom PDF