Accessible design: A story of three Jira icons
“Great things are done by a series of small things brought together.”
Vincent Van Gogh
Small things can have a big impact.
Did you know there are different types of color blindness? In Australia, about half a million people live with some degree of color blindness. In the US, it’s closer to 12 million people. Worldwide, there are an estimated 300 million people living with some degree of color blindness; some sources say that number is closer to 350 million.
Many of these people struggle to distinguish green from red.
And up until now, Jira Software’s pull request icons have relied on grey, green, and red to differentiate between open, merged, and declined pull requests:
This is how the icons can look for some different types of color blindness:
On a board in a Jira Software project, these icons are small, appearing alongside other small details on each issue, such as story points, assignee avatar, and issue key.
This is an example of a board in a project within Jira’s iOS app. The pull request icons are circled:
Although small, the icons convey meaningful information.
In late 2021, I began my quest to update the development status icons, and make them accessible for colorblind users. It began with a note in the Accessibility team’s Slack channel:
From Hannah McKenzie: “Hi team. I’m curious, are there currently any plans to make Jira’s pull request icons more accessible? At the moment, they’re identical, differentiated only by color.”
In early 2022, during a Slack discussion with several Designers and Engineers, a rough mockup was created:
Design conceptualization began, and quickly gained momentum:
After several more discussions and design sparring sessions, the new, accessible pull request icons were born:
While the icons are still grey, green, and red to indicate open, merged, and declined, they also incorporate a (green) tick for merged, and a (red) cross for declined; the merged icon’s lines join (to signify the merging of the branch), while the declined icon’s lines do not merge.
People who are colorblind can now visually identify different pull request icons on their Jira Software board:
This journey taught me…
- Keep persevering, even if the journey looks tricky. If you work on a complex product, or within a large organization, you may have to reach out to multiple teams to connect with the right people.
- Something that appears small in the UI may have involved many different people behind the scenes. Often, it’s a series of small things (in this case, many conversations and sparring sessions) which lead to something great being shipped to customers.
- Making accessible products is important to everyone, and the small details really do count. Everyone benefits, including people who identify as non-disabled. Did you know that many common products were originally designed for accessibility? Think telephones and electric toothbrushes! Several non-colorblind Designers and Engineers at Atlassian commented on these new pull request icons:
‘I’m not colorblind, but these are far easier to understand at a glance.’
‘This is pure gold. The same icon with different colors confused me; I’d often think, ‘What’s the state of the branch?’ This is such an amazing improvement.’
So this is your reminder to sweat the details — even small things can have a big impact.
