Project overview / my role

• Create standardize style guide for a range of imaging overlays and annotations

• Optimize interaction designs to improve workflows

• Test on a wide range of backgrounds and colors

User needs and pain points

Radiologists use imaging annotations and measurements to make diagnoses and communicate with other clinicians. Those measurements need to be subtle enough not to block any findings and easy enough to interact with. These images and measurements are shared between radiologist and clinician so they need to stand out, without blocking important content.

Legibility testing

There’s no way to control what these measurements would be laying on top of so ensuring they work on a range of values and complex backgrounds was key.

Creating a cohesive system

It was important to create a cohesive system to connect all the interactive elements across the viewports with the use of one action color which improves usability through consistency.

The scrollbar played an important role in interacting with clinical images that incorporated an editable slice thickness functionality.

Hit targets were made to be larger than the annotations in order to keep annotations small and not block the image while making interacting with them easier for users.

Annotations were given a cohesive visual style guide across line styles, states and text labels.

In context:

Global reach & impact

Consuming applications were able to rapidly implement and release products faster and more efficiently, including an application designed to help diagnosis and assess effects of COVID-19.