Background

Immediate Virtual Response, or “eCare” was one of AdventHealth’s pillars of care for the year. AdventHealth had the vision of users being able to get in touch with a doctor whenever and wherever they needed. They currently had a service offering this, where you went to their website and then were taken to another website to do the eCare experience. It created a dissonant experience that didn’t feel cohesive with their brand.

‍

The Brief

AdventHealth's vision for Immediate Virtual Response (IVR) is a telemedicine platform that can be used in-network by patients of their hospital system and non-patients alike. Our goal was to create an AdventHealth platform on both mobile and web, allowing users to video call with a doctor for minor injuries and ailments. This was to be integrated into the patient portal on AdventHealth’s website, to make it one connected and consistent experience. My work included working on the web experience alongside another designer that created the mobile experience.

‍

Research

At the start of the project, the mobile app experience was already being worked on. I started by looking through the flow, getting a feel for the experience we were offering to our customers. I went through the current eCare system on AdventHealth’s desktop, run by a non-affiliated website. I went through competitor flows for video visit, but I hit a paywall in most of them where I couldn't proceed through the entire flow without actually seeing a doctor. Using Miro, I laid out several of these experiences, so I could understand what our user would expect during a telemedicine visit. Below, you can see an audit of CVS’s telemedicine experience in mobile.

‍

‍

I created user-flows for the current web experience, the current app, and the newly designed app to easily and clearly illustrate each experience.

‍

‍

After competitor audits and user flows, I knew what I needed to craete a comprehensive eCare experience. I looked through AdventHealth’s current website, searching for existing patterns for selecting a time, picking a location, and looking at different specialties. Because AdventHealth had no design system in the past, the patterns and visual design were varied throughout the experience. Below demonstrates the differences in patterns seen across the AdventHealth website. Note the difference in pattern between the breadcrumbs at the top, the varying colors, and even being able to click on and map an address on the Urgent Care portal vs. Provider Appointment Scheduler.

‍

‍

Designs

Once I did the research, I started ideating on how to best lay out this experience. I created many sketches for the eCare home screen. I based these sketches on files from other AdventHealth desktop pages, AdventHealth’s consumer-facing website guidelines, the current website, and the mobile app.
‍

‍

I created wireframes of these sketches and took them to the design team for feedback. which included how the cards I created took up a lot of space, and they probably didn’t need all of the symptoms on the cards themselves. I iterated the designs based on these suggestions.

‍

‍

After a few iterations, it was agreed that we should break up the content into more bite-sized, digestible pieces. These pages were really long, which could be a bit overwhelming to the user. I took what I learned from the first iterations, and following patterns that existed elsewhere in the website to start breaking it down. Through many iterations, the home screen went from part of the modular experience, to a page in the website as an “anchor” for users to exit the eCare experience to. With each design, I pushed the limits of past AdventHealth designs and focused on more progressive, trendy designs.

‍

‍

Throughout many iterations, I landed on what would be my final version of this project. I used InVision to create a prototype with microinteractions that you can see in the video walkthrough below.

‍

‍

Documentation

Though I wasn't able to see these designs through to the user-testing process, I made sure to carefully document my pages so the next designer that works on this project will be able to pick it right up without any confusion. When I started this project with no design guide, and no documentation to reference, it became incredibly clear to me how important it is to document thoroughly.

‍

‍

Challenges and Key Takeaways

The importance of documentation and a design system became paramount to me in this project, especially when multiple designers are working on different parts of a website or application. Starting out this project with nothing to reference was incredibly difficult. It took a lot of time to go through AdventHealth's current designs to get a look and feel, and there was no consistency of spacing or sizing between pages. Without references, you have to follow design best practices, accept feedback, and iterate. Leanin g heavily on audits of pages and competitor research was frustrating at first, but bringing it all together was very fulfilling.