Carl Zeiss Meditec

UI/UX design

Mobile

Face scanning app

Created the end-to-end design of a face scanning application, optimizing user flows and accuracy for Zeiss remote care needs. Collaborated with hardware and software teams to integrate technical constraints into an intuitive mobile app, ensuring adoption in early product testing.

The goal

Create an app that guides users to take a full facial scan and analyze if the resulting image was sufficiently good to be used in the remote care product.

The challenges

  1. To create a good image, a precise alignment was needed.
  2. The app users were not expected to go through intensive training.
  3. There were strict guidelines to define an acceptable image.

The result

I created all the screens for the app, tested them with users, and received positive feedback. I also completed the process of handoff with an external international team, who successfully developed the app.

Understanding the ask

Before starting the design of the app, I wanted to understand the full picture and clarify the tasks I needed to do. This involved:

Analyze constraints

I talked to developers to understand the algorithm constraints and with clinical personnel to understand the workflow constraints.

Interview doctors and nurses

I learned about their daily tasks and how the device fits into their work. My goal was to discover  their needs, their concerns, and their motivation.

Create requirements

With the constraints and user findings, I defined with the team the basic requirements for the product and performed the task analysis.

Requirements

The user research and constraint analysis showed that the two main challenges were to accurately align the patient and to comprehensibly describe what a bad image looked like.

Prototype and test

I decided to use a guided approach for each of the challenging areas identified. For the face alignment, I chose to test visual guides to show where the face was pointing and where it should move. For the analysis, I devised a guided questionnaire with examples to verify each parameter.

Original app

Alignment brainstorm

Alignment brainstorm

Questionnaire brainstorm

Full workflow

After testing, I created the full workflow map to dive into each necessary page and started their designs.

Refine

With each iteration and test, I gathered important information that guided my subsequent work. My prototypes became more usable, and started following the Zeiss UI guidelines.

V2

V2

V3

V3

Develop

I created user stories for developers and we discussed them in grooming meetings. I had to weight in the app priorities, address corner cases, and resolve problems that came up.

In the end, we had a fully defined app that addressed the challenges and met the needs of all the stakeholders involved.

Next: Electric motorcycles