Avie Patient Onboarding

An iPad app for onboarding new and existing patients.

This app replaces paper intake forms. It also educates patients about procedures before they see the doctor.

This app is launched and configured by a doctor or staff member.

To start, the staff member can search for a patient or select from a list of patients who have appointments that day. Because the primary use case is when existing patients arrive for an appointment, I chose to list patients who have an appointment within 30 minutes of the current time. Because the data set is small, and to increase the tap area for a touch device, I chose to use cards instead of a list view.

patient profiles

If someone is a walk-in, the clinic staff can choose to add them as a new patient from this screen.

Here the clinic staff confirms the patient information and appointment is correct.

patient profiles

The staff member can also manually configure the onboarding content that will be presented to the patient. Here they can select forms and take-home material for the patient to complete. Forms are displayed as cards to keep the tap area large and to leave space for summary text below the form title. Tapping anywhere on the card area would select/unselect the form. Tapping the View Button would bring up a modal that previews the form.

patient profiles

At this point the, the staff member hands the patient the iPad so they can begin the onboarding guide. Here the user sees a welcome message and an overview of steps to complete. Tapping the Get Started Button takes them into the guide.

patient profiles

Patients or staff can also move around the app through a dropdown navigation menu. Staff controls are locked with a four-digit key code.

patient profiles

First the patient is asked to view videos about their procedure. Again, I’m using cards to display the video content. The user can swipe horizontally to scroll through the videos.

The reason to use horizontal scrolling is so that we can keep the screen and the Previous Button and Next Button in a fixed position, making the guide feel easier to move through and complete.

Instead of just saying “next”, the Next Button indicates what the next step is.

patient profiles

Here the primary action for the patient is to fill out and sign the required form(s). Similar to videos, the intake forms and take-home information are displayed as cards that scroll horizontally.

The Next Button is disabled until the user completes the forms.

Secondary actions on this screen are for patients to view or send themselves a copy of the take-home information.

patient profiles

The paper forms traditionally given to patients were redesigned to be easier to read and navigate. To make entering information easier, buttons were used instead of text fields or dropdown whenever possible. These forms also autocomplete with existing patient information. In most cases, the patient will simply be reading to confirm their information is correct.

patient profiles

If patients want to send themselves a copy of their take-home information, they can do so by emailing or texting a link to the document.

When a patient taps the Get a Copy Button, a bottom drawer slides up to display the send options.

So the patient knows the link has been sent after the Send Button is clicked, the button text colour transitions from blue to green and the button text transitions from “Send” to “Sent”.

patient profiles

At the end of the onboarding guide, the patient is presented with a few options to explore while they wait for the doctor to arrive.

As with the rest of the app, I’m using cards to display the links to each additional section, keeping them visually interesting and easy to tap.

patient profiles

The FAQ section is list of questions with answers revealed/hidden in an expansion panel. In this way the patient can easily scan the list of question without having to scroll past answers they aren’t interested in. The patient can also search for questions using the search bar.

patient profiles

Initially we thought about letting the patient submit questions. Below is a link to an animation I created that shows how a submit-a-question interaction could work.

patient profiles


See More Case Studies