Digital Health Onboarding Experience

This case study covers my role as the Lead Product Designer in redesigning the onboarding experience for Shoppers Drug Mart and PC Health™ Digital Health customers.

Once users complete a step by step form to create their account, their inputs are reflected in a centralized area where patients can make updates to their profile information, set their prescription preferences, manage their data, and other account-related settings.

At the beginning of the year, I was asked to partner with a member of the research team and develop a Customer Journey Map. This journey map was shared with the leadership team to help inform the yearly Digital Health roadmap.

I chose Miro as our tool to begin building out the journey map. Miro would be both a quick, engaging way to involve the research team and stakeholders as well as an effective method to circulate the journey map in future planning sessions with leadership.

The process to create this map involved working closely with the research team to define the journey phases, outline the two primary types of profiles/customers, and bring in existing relevant research. I also facilitated an Ideation Workshop with business stakeholders to gather insights on areas of opportunity across the journey.

Once the map was created and reviewed with stakeholders, I translated it into a table on Coda. The benefit of this was so that as we learned new information about our patients, it could be easily updated and reflected back in the journey, acting as a live document.

To kick-off the Design Phase, I ran a virtual Design Discovery Workshop with my team. The goal of this workshop was to (rapidly) critique the current onboarding flow and create low- to medium-fidelity mockups. Because the business was looking to urgently improve this experience and increase the number of verified accounts, my Design lead and I felt that a focused, fast-paced design sprint would help us launch a MVP sooner.

Coming out of the workshop, I was able to synthesize our ideas into two distinct concepts; a single page flow and a multi-step flow. Even though the team leaned heavily towards breaking down the form into a multi-step flow, I knew that this was a large leap from the existing experience where all of the fields were displayed on a single page. I wanted to be strategic about presenting our ideas and doing a round of testing first so that we could make this decision based on feedback from real customers.

We launched 1 round of Unmoderated User Testing that presented both concepts to 6 customers. By recommendation from our Research team, half of our customers were presented with the single page layout first, while the other half was presented with the multi-step flow first.

Ultimately, with feedback from our customers, I moved forward with the multi-step flow. But notably, not all customers preferred this structure, and my guess is that it mainly depends on what size of screen the customer is viewing the experience in.

The designs and synthesis of the testing was shared back with the business. Depending on the size of the project I will have 1-3 reviews. Each review involves presenting the designs (usually a hybrid model), discussing with stakeholders what's missing or unclear, and sharing out a link to the designs so they can provide more in-depth feedback async. In between each of these reviews, I will refine the design and address their feedback.

Documenting my designs has always been a critical part of the role. I'm always looking for ways to improve my hand-off file and clearly layout the expected behaviour. Most recently, I addressed a comment from the Software Development Manager to find a way to separate UX annotations from accessibility annotations. This way, it would be easier for the QA team to complete accessibility testing.

Since accessibility is naturally intertwined with UX I still wanted the accessibility annotations to be grouped with the UX annotations. My solution in the end was to add a new symbol "A" to indicate accessibility-specific requirements. Since doing this, I've adopted this approach in all of my hand-off files and helped my team do the same.

Throughout the implementation phase, I collaborated closely with the development team. This usually looks like a combination of in-person side of desk checks, async or virtual reviews, and formal rounds of QA. I'm often bouncing between Storybook, Google Chrome (dev inspect mode), Gitlab, and JIRA. Over the years I found that reviewing work early and often can lead to better results, less re-work, and reduced time to launch.

Since the launch of the MVP experience, the business made the decision to integrate SDM Digital Pharmacy into pchealth.ca. In order to do this, I was asked to update the entire onboarding experience so that it accommodates the necessary requirements to support both new and existing PCH customers and new and existing SDM Digital Pharmacy customers.

Not only did I set out to meet the business requirements, I also wanted to use this initiative as a opportunity to optimize and improve the original MVP experience that we launched. In order to do this I consistently emphasized quality and setting the bar for a best-in-class experience.

An important part of the design process I facilitate is regular design crits with the Digital Health design team. These are in addition to monthly crits we attend across the organization. The Digital Health crits are on a weekly basis and intended to help us improve our work. I've taken many pieces of work to design crit and this project was no exception. I always leave feeling like my work can only get better.

Like we did with our MVP experience, I conducted usability testing on the new flows. For these flows, it was important we had a prototype that was interactive. I was able to put together an unmoderated test plan, set up the screen criteria, and launch the testing within a week. I often find that launching testing on Friday's tends to have very good turnaround over the weekend and we can quickly pick back up the work and start going through the feedback.

The final phase of this project was significant because of the complexity of the business requirements and the user scenarios. The hand-off file had to be clean, easy to navigate, and detailed. Below is a very small sample of the documentation. I'm still in the progress of providing dev support on the implementation of this work but it's been really enjoyable watching the design come to life.

Throughout this project I spent a lot of time in our design system. Myself and two other members of the Digital Health team maintain this. The level of collaboration and skill that each member brought to the table each day to mature our design system and ultimately, the quality of our product, is very fun to be a part of. I'm fortunate that I worked on a team that cared so deeply about this foundational work.