Responsive Redesign

Initial Sketches and Ideas

The Paid Profile

For the paid profile page, a user would begin on the home page which might have a screen of icons indicating different types of animals. Clicking on a pet icon would lead to a specialized Pet Information page that would contain information on how to take care of your animal in different emergency situations.

The home page would also have an Emergency button that would allow you to select the type of animal and what was wrong with the animal, then would display contacts for veterinarians nearby that could assist the user.

Finally, the home page would have a Profiles page that would contain all of the user's personal pets.

The Free Profile

For the free profile page, a user would see almost all the same features as the paid screen (however, if they clicked on a paid version option they would be prompted to sign up for Dr. Treat). On this app, they would still be able to access the entirety of the common ailments and symptoms for a pet, drawing heavy inspiration from the American Red Cross First Aid app. There would be a list of common emergencies, and clicking into a specific emergency would show how to spot and treat the emergency, and provide a general set of next steps for the pet parents.

Emergencies and Talking to a Vet

The emergency page, ultimately accessible through the home page, would prompt users with a step by step process to discover symptoms and connect pet parents with a specialist. Starting at the main emergency screen, the user would choose an animal, then narrow down the issue, and then talk to a live veteranarian to learn how to best take care of their pet.

Pet Profiles

The pet profiles page, accessible by pressing the Profiles button on the home screen, would contain a page of all current pets registered in Dr. Treat by the user. From the profiles page, the user could click on one of their pets to see information about general health, past visits, etc. The user could also add a pet to their profiles page which would lead to a page where they could select the type of animal, add in any information they know, and upload any relevant documents or medical history.

Wireframe from Combined Ideas

Home Page

We combined the grid idea of the paid version initial sketch with the different buttons of the free version initial sketch to create this home screen. We also opted to ignore the difference between a paid version and a free version and just focus on a single screen for home.

Emergency Page

We combined the list of common ailments and symptoms from both the paid and free initial sketches to make a page that would list issues and potentially accordion open to show how to treat those emergencies.

Pet Profile Page

We used the pet profile initial sketch as a base for this wireframe. When looking back at Dr. Treat's startup information page, we saw an emphasis on "personalized preventative care" and wanted to make sure there was a section on this screen that was dedicated to that.

Chat Page

We used the chat section from the “Emergencies and Talking to a Vet” initial sketch because Dr. Treat emphasizes virtual care. We interpreted this as both opportunities to begin a Zoom call with veterinarians as well as chat in real time with specialists.

Appointments Page

We discussed how users might actually take their pet(s) to the vet, and decided that having a page dedicated to making appointments was necessary in our wireframe (and ultimately HiFi) application.

Hamburger Menu

Because some information or services might be hidden within the buttons, we opted to also add in a hamburger menu so user would be able to see the full capability of the Dr. Treat app.

Interactive Hi-Fi Mockup with Critique Feedback

Our Original Interactive Hi-fi Mockup

We received the following advice/feedback for our high-fi prototype:

Revamp the hamburger menu options to ensure the options are actions the user would actually want to complete
Hide the nav bar when in the chat so the buttons aren’t accidentally clicked
In the appointment tab include affordances to make it intuitive to schedule an appointment
Generally, improve the icons— having the paw print and the "Your Pets" icon on the home page is redundant (as they lead to the same page); it is also unclear what the pawprint leads to
Include an option to schedule appointments within the individual pet tab
The emergency button on the bottom is problematic—maybe put it somewhere that is less likely to be accidentally pressed
The at home diagnosis page should be more flushed out, the list of symptoms is overwhelming
Users forget the name of the app while using it, so ensure it is somewhere in the interface

Taking the above feedback into consideration, we produced the following revised mockup:

User Testing Results & Analysis

Instructions

Note: this is a click-through prototype that does not have full functionality. If you click somewhere on a page that doesn’t lead anywhere, the clickable buttons will be highlighted in blue.

For background on the app, Dr. Treat aims to be a tech enabled modern veterinary care company offering virtual and in-clinic services to pet parents. It aims to be data driven to offer highly personalized & preventative care for every pet.

For this task, imagine you have three pet dogs, and you’d like to schedule an appointment for one of them, Clark. Imagine that while you are in this process, a veterinary emergency comes up, and you look to diagnose your dog through the app. Feel free to think aloud during your interaction with the prototype.

Schedule an appointment for Clark through the “Your Pets” screen. Note that the header on the appointments page you reach should say “Clark’s Appointments”, not “All Pet Appointments”
You realize there is an emergency with Clark and want to navigate to the emergency screen. Please navigate to the appropriate page.
You realize you would like to conduct an At Home Diagnosis. Please navigate to the appropriate page.
You decide you want to chat with a Dr. Treat representative. Navigate to the chat screen to start a conversation.

Post Test Questions

When completing the tasks, did you find that you were unable to complete any on your first try? If so, which task(s) caused issues and what incorrect steps did you take?
Which screen was most memorable to you?
Do you have any general feedback/suggestions for improving this application?

Dr. Treat

"One Medical for Pets."

Based out of San Francisco and geared toward millenial pet parents, Dr. Treat aims to offer virtual and in-clinic services as well as highly personalized care for every pet.