Designing a responsive web-based report card for Pet Resort Pro

Overview

Pet Resort Pro is software built for pet care professionals. The app allows its clients, typically pet hotels and pet daycare centers, to view customer and pet information, manage reservations, and customize each pet’s experience through the interface. Currently, Pet Resort Pro has an internal dashboard for clients to manage their business, but there is no customer-facing portal. Pet owners want updates about their pets and currently, there is no simple way to send a personalized update with the platform.

This design challenge is to build a customizable pet report card for businesses to use and increase communication with their customers.

View Prototype

Project Info

My Role
UI/UX Design, Research
Timeline
Two weeks
Product
Client Project: Responsive Web Design for Pet Resort Pro Software
Goals
  • Research focused on understanding pet owners’ wants and needs when leaving their pet in the care of others
  • Design a pet report card for the customer facing communication
  • Define brand identity for the report card and template options for the client
Outcome
The first iteration of this project has been launched and is currently live. I will continue working on the design with the team as we move into building the customer portal.

The Challenge

How can we create a reassuring and clear update for pet parents to receive?

It’s only natural to want to receive updates about your pet, especially if they’re at daycare or in boarding while you’re away. What is the most pertinent information pet owners want to receive and how can we build trust in confirming your pet is being cared for?

understanding the user

Because I was working with a client, they had initial ideas about what they wanted for the report card content. I knew I was going to be working with constraints, but started with research to gain insights about the pet management software space, while understanding users’ wants and needs when it comes to receiving updates about their pet. For this project, I focused the research through a competitive analysis, market research, and interviews.

Competitive Analysis

These takeaways from the competitive analysis aligned with the information I learned from the interviews to serve as a foundation for defining design elements.

Interviews

For this project, it was especially helpful to understand what pet owners wanted to know when someone else is taking care of their pet. I conducted five user interviews with dog owners who have had their pet stay with someone else before, and I conducted one expert interview with the client to understand more about the needs of their customers (pet hotels) when providing updates and communication to the pet owners.

“I was really nervous the first time we left Cooper with someone else, but the updates we received helped to reassure us that he was doing ok and playing with other dogs.”

- Cooper’s Pet Parent

“The employees creating the report may have many pets to keep track of, so it’s key that they can do this efficiently, while still sharing the appropriate information with the pet owners.”

- The Client, when asked about their customers

Key Takeaways

The most common thread across all interviews with pet parents was being able to trust the facility to provide good care. A helpful update or report has the power to reassure owners their pet is doing well.

Pet parents want the truth about their pet’s behavior

Photos are more valuable than just text

Updates from pet facility provided relief

Pet parents are often nervous the first time dropping off pet

Want the dog to be comfortable and in a reputable place

defining the scope
User Stories

Taking the information from the interviews, I did an exercise with user stories in order to easily visualize some of the wants and needs of the users.

The MVP

Next, I started outlining the key elements needed for the product, driven by client wants and information I gathered from the research. Given technical limitations with this first version of the report card, the client requested a design for a standalone report card page that would link from the user’s email without a login.

I looked at the big picture for future iterations and to have a more realistic flow for testing. I created a more complete sitemap, but these project deliverables ultimately focus on a more narrow scope for this version.

The sitemap sketch includes the overview of the customer portal, though the MVP is the report card page that customers would access via an email link initially.

Ui Elements And Color

Throughout the project, some new priorities came up. Since this report card page is a template that the customers can use depending on their pet hotel location, the client wanted to have a few color themes that the customers can pick from. I also spent time developing the icon set that was used for the categories in the updates section about the pet.

Brand keywords: friendly, bright, intuitive, trustworthy

design iterations

Despite having a relatively simple flow, even with the addition of the reservations page, this project had many iterations and rounds of feedback on the priority screens. I’ve included feedback from my mentor, the client, and from usability testing to show the roadmap of the key iterations.

“Maya produced work that was detailed and above and beyond what we had anticipated. We are excited to share this product with our customers and this will serve as a foundation for our customer portal in later iterations to come.”

- CTO, Pet Resort Pro

Reflection

This project was a tremendous learning experience, and provided an opportunity to build on my skills in creating responsive design for a client. During the two weeks, I had many client meetings and there were several decisions that ended up changing my focus or strategy. I also built out more screens to test the flow, even though the MVP is mainly the report card page for now. I have enjoyed working on a team to launch the first iteration and I'm excited to continue working on this project.