Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Accessibility issue / UX improvement on bar charts [Twitter & Netflix overviews, TrackerControl, Apple App Activity...] #1110

Open
alexbfree opened this issue Oct 25, 2022 · 2 comments
Labels
bug Something isn't working request-ticket ux user experience issue

Comments

@alexbfree
Copy link
Contributor

alexbfree commented Oct 25, 2022

Black text is hard to read when overlaid on bars whose background are dark shades of blue or purple.

We should either switch all our bar graphs (and pies?) to a colour scheme using a range of light/pastel colours, keeping black text OR we should use white/light grey text when the darkness of the colour is above a certain threshold.

We should review hover background colour at the same time - it could be a bright white or yellow.

This is present in Apple App Activity experience, TrackerControl experience, Twitter, Netflix and possibly others - review all graphs.

Examples:
Screenshot 2022-10-25 at 14 20 06
Screenshot 2022-10-25 at 14 21 43
Screenshot 2022-10-25 at 14 21 53
Screenshot 2022-10-25 at 14 22 17
Screenshot 2022-10-25 at 14 22 57

@alexbfree alexbfree added bug Something isn't working ux user experience issue labels Oct 25, 2022
@alexbfree
Copy link
Contributor Author

Relatedly, we should make the "Current filter" bar highlight colour something outside the color palette of the other bars - e.g. a bright white or yellow bar, or it should be boxed in yellow, black etc to highlight it. As it is, a currently selected filter bar looks the same as bars in other graphs where there is no filter.

Screenshot 2022-10-25 at 14 28 00

@valentinoli
Copy link
Contributor

valentinoli commented Nov 2, 2022

White text will not work because text that flows outside the bar becomes invisible. A wise selection of background color and text color might solve the problem.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working request-ticket ux user experience issue
Projects
None yet
Development

No branches or pull requests

2 participants