UI/UX & Graphic Designer, Webmaster
09/16 - 12/16
Professor Antaki (of Carnegie Mellon University's Biomedical Engineering Department) was preparing to test a non-biased, LVAD decision aid video on senior citizens with end-stage heart failure. Code Blue was brought to format the video into a web-app.
Based on research and user interviews, Code Blue realized that a Hypertext FAQ wasn't enough. To satisfy user needs, a web-app prototype with these three features was needed.
1. Hypertext FAQ
2. Search Option
3. Easy-to-understand prognostic information
Pleased with our proposal, Prof. Antaki gave the go-ahead for us to proceed.
The main challenge was creating a format that senior citizens who were also seriously ill could easily use. This goal set up three metrics I had to make the UI meet:
• Compatible with aging senses and motor skills on both a desktop computer and on a patient provided Apple tablet
• Simple and forgiving to users; most seniors don't use smart technology because they feel embarrassed that they can't use it without significant help
• Keeping users calm with the presentation of sensitive, possibly depressing information
All features are simple, prominent, and easy to understand to make the interface easy to use by seniors. All buttons and links are large to handle shaky motor control and trigger tablet vibration.
While designing the UI, I quickly realized that I needed to throw out the more modern UI conventions, such as a hamburger menu icon. Early research and play-testing confirmed that our target audience prefers the older, more familiar, and ingrained UI behaviors they learned when they were younger.
To keep a sense of calm, I also implemented a soothing color palate. After much play-testing, I settled on using shades of warm green and brown (8).
The result is a straight-to-the-point, blunt but non-stresser interface. The web-app prototype helped cut Prof. Antaki's research timeline while giving room for improvement during his testing.
For Code Blue's branding, I focused on the theme of finding and connecting information. This is carried out with the idea-webs throughout the design. Since our users were heart-failure patients, I tied that in with our logo by turning the "B" into a heart with a monitor line.