Creating a tool to scan and diagnose moles.

The Challenge

The average person has around 30 moles, and some have as many as 600. Most are completely harmless, but there are some that could be dangerous and, while there are signs to look for, it's very difficult to self-diagnose. The only sure way to determine whether a mole is dangerous or not is to visit a dermatologist — and the wait time to get an appointment can be long, especially in less developed or remote locations. What if there were a way for people to get their suspicious moles diagnosed without needing to go to a dermatologist's office?

Enter: SiaCloud. Our client created a special scanning device that takes pictures of the layers of skin under a mole. Using these pictures, a dermatologist can very accurately diagnose the mole — much more accurately than using a photo from a regular camera.

They were using the device with an old, PC-based software program. This program had to be installed on each local machine. All files were stored on the local machine, so sending files to dermatologists was very manual and working on multiple machines was not possible.

The program's user experience was also not optimal: everyone (dermatologists, scanning technicians, administrators) used the same interface, regardless of their use case. They were provided with a feature-heavy dashboard that had no clear path through it. It required a lot of training. Dermatologists and technicians are busy people, and we needed to maximize how many patients they could see. They needed the program to be optimized for their own uses.

The Process

We started the project with a kick-off meeting. The client demoed the current tool for us, and we discussed the current pain points. We then took a step back to look at their business model — they planned to sell to corporations rather than directly to clinics, so this needed to be updated. We helped them map out the new model and defined KPIs.

Our next step was a workshop with the client where we identifed the main user types. We created a user hierarchy tree and proto-personas outlining the challenges and needs of each user type.

SiaCloud User Hierarchy
SiaCloud User Needs

We used these personas to define the tasks that each user would need to do, and then outlined the steps they would need to perform to complete each task. Here's one of the final user flows:

SiaCloud User Flow

Sketches were created to accompany the user flows to help the client visualize the flow and to make sense of the tasks. These evolved over time into interactive wireframes.

SiaCloud Sketches

At this stage, we wanted to test the system with our two primary user groups: dermatologists and scanning technicians. We created a prototype and proceeded to test it with real users. Our observations helped us streamline each user's path through the program.

SiaCloud Prototype

Now that our wireframes had been tested, we started with UI designs. These were kept simple and clean so as not to distract users from the task at hand.

SiaCloud UI Design
SiaCloud UI Design
SiaCloud UI Design
SiaCloud UI Design

A design system was created to ensure consistency.

SiaCloud Style Guide

The Solution

We created a cloud-based solution so that users would be able to login anywhere and access the same patient records, depending on their location and permissions. Based on the user's account type, they access a different part of the program — scanning technicians get the tool to add patient records and scan moles, dermatologists get the tool to review and diagnose moles, and everyone else gets reporting and user account management tools. Each user's experience is streamlined to allow them to complete their individual tasks as quickly and easily as possible, with very minimal training. We also introduced a more modern look to the software.

The client is very happy with the final solution, and is currently in negotiations with customers in a few different countries.

Role

Workshop facilitation, persona creation, user flows, wireframes, prototyping, user testing, UI designs, design system creation

Agency

Blanc Labs

Want to know more?
Get in touch.