Integrating Accessible Design for Cancer Patients
At Vinehealth we put our customers first which means designing a product which is suitable for everyone. By listening to feedback we believe we have designed an app which is accessible for everyone.
Designing for accessibility means allowing people of all abilities to perceive, understand, and interact with the product. This includes users with poor vision, limited hearing, cognitive and motor abilities, and low technical literacy. To make sure the Vinehealth app is accessible, we conducted research trying to learn what issues are most important to address when it comes to accessibility and tested prototypes with a wide selection of our users in various environments.
Such an approach allowed us to highlight key priorities when it came to designing for accessibility:
1. Respect colour contrast ratio Colour contrast ratio should be respected to allow people with colour blindness and visual impairments to understand the message and interact with the app. Our designs follow WCAG’s standards for body copy and graphics and are greater than the recommended 4.5:1 for normal text and 3:1 for large text (14pt bold & 18pt regular and above) and graphical elements.
2. Test for colour blindness Testing for various types of colour blindness helps us to make sure that our messages and statuses do not solely rely on colour. For example, error states are supported by error messages and error icons, which makes understanding errors easier.
3. Follow font sizes guidelines Over 65% of our users are 45+ years old, which belongs to a category prone to age-related presbyopia. To allow them, as well as people with other visual impairments, to easily read and navigate through the app, we made sure the body copy is 16pt (considered as a large text according to WCAG’s standards).
4. Respect target sizes for interactive elements Especially relevant for people suffering from neuropathy, tappable elements should accurately respond to people’s taps to avoid tapping more than needed or frustration of mistapping. This is why our interactive elements are of at least a 44x44px surface area and have at least 8dp space between tappable elements.
5. Design for low digital literacy Having older users who have low technical literacy, we tried to make sure that all elements in the app and navigation are clear and self-explanatory. This includes having the labels along with the icons, as well as introducing walk through tours with call to actions to teach users basic interactions.
6. Design for cognitive impairments Many patients who undergo chemotherapy suffer from cancer-related cognitive impairment (also known as chemo brain or chemo fog). It is a common term that describes thinking and memory problems which can occur during and after cancer treatment. To address these, we introduced easy to follow visual guides and animations that come along with the copy.
We continue learning and supporting our designs to make them more inclusive and accessible. Please, do get in touch if you have any feedback or comments regarding the app’s accessibility – hello@vinehealth.ai
You can also check out the post about Vinehealth’s patient advisors and how they have been helping us with validating the accessibility and usefulness of designs:
Read Jill’s story here
Read Jame’s story here
Read Marie’s story here
Read Liz’s story here
Read Aurora’s story here
Learn more about how we make sure the app is truly patient centric here
Learn more about how we created senior friendly experience here
Check out why ORCHA rated Vinehealth’s accessibility and usability at 92% here