Overview

Project
Designing a booking feature. Pup & Kit is a mobile pet groomer in Charlotte, NC and wants to build their cliental. They are ready to streamline their process and create a better experience for new and current customers.

Role
UX Researcher, UX/UI Designer

Timeline
2019 (80 hrs)

Tools
Pencil & paper, Sketch, and InVision

 

Challenge

Create a booking feature that meets all of the groomer’s and user’s needs Most importantly, make sure pet owners feel safe and secure when selecting a groomer.

Goal

Design a responsive website that allows user to book and pay for grooming services.

 

The Process

 

Research

Secondary Research
1:1 Interviews
Persona

Strategy

User Flow
Wireframes

User Interface Design

Branding
UI Kit
Mockups

Iteration & Implementation

Prototype
Usability Testing
Affinity Map

 

Research

I always like to begin my research with a competitive analysis to better understand the market and where the brand can improve. Being that Pup&Kit is a mobile groomer I struggled to find other mobile groomers that offered online booking so I added on-site groomers that offered this feature. Though mobile grooming may have its own set of insights my main focus is the booking feature .

Following competitive analysis, I conducted 1:1 interviews with pet parents that use a grooming services, to better understand their needs and pain points when booking appointments. The biggest drivers were convenience, trust and quality styling. To my surprise, almost all participants spoke about their struggle in finding a groomer they can trust.

“I took Roscoe to about 4 groomers before I found the right one.”
- Jennifer H.

Need

  • Offer images and reviews on groomer’s past work.

  • Easy visual way of showing style/cut desired.

  • Able to schedule an appointment in advance.

  • Ability to create an account and save all pet’s information.

  • Access to pet’s grooming history and information.

Pain Point

  • Having to schedule same day.

  • Not being able to see groomer’s work in advance.

  • Difficulty in explaining cut/style desired.

  • Paying only in cash.


With all of the research findings it was clear that the booking process focused on what the groomer needed, not the customer. Pup&Kit’s customers consider their pets family and want to feel that they are being put first. All of these findings lead me to the persona of Alyson Isaac.

 
 
 
 

Strategy

Throughout my interviews I learned that pet parents struggled finding the right groomer for them, so I wanted to make sure that this pain point was resolved through the booking process. Alyson loves social media and this gave me the idea to create a profile for each groomer so they can give customers some information on themselves, their past experience and a gallery of past work.

Another big factor was figuring out how to break out the booking process so that Alyson would not feel overwhelmed. After writing out all the information needed for the groomer I broke them out into categories. I also gave the Alyson the option to create an account, which would have the majority of their information saved for future bookings Once I had my final categories decided I began working on my user flows.

For the user flow below, Alyson is looking for a groomer for Max’s first appointment.

 
 
 

After completing my user flows I began by sketching out a few different layouts. Though this is a responsive website majority of users would be booking on their phone so for testing I focused on mobile screen size.

For their homepage I decided on showcasing booking, groomers & services on the homepage. All of these pages hold a lot of information so I decided on a very simple & clean layout. Having the booking portion already broken up into categories made the sketching portion pretty easy for me, but once I began wireframing I had to try different variations of font size and padding so that each category did not feel too packed or overwhelming for the user.

 

User Interface Design

For the branding of Pup& Kit, I looked for inspiration that would express Alyson’s bubbly and fun personality. Between all the content for groomers and booking feature, a pop of color brought the brand to life while maintaining a clean and simplistic design. Below are some images of inspiration and the UI kit.

 


After adding all of the UI components to the wireframes I made slight iterations to the booking process in terms of padding and font size. Legibility and clear direction is extremely important for this feature.

 
 

Iteration & Implementation  

 After completing my mockups, it was time to do some usability testing to see what users responses to the feature would be. All participants were pet parents and had a groomer. To make sure I was not too focused on note taking during testing, I recorded each testing session. This allowed for me to look back and take detailed notes of each session. View prototype here.

My testing objectives were to:

  • Test how user navigates to groomers and booking page.

  • Test if design is easy and clear to navigate.

  • Observe if there are any moments of confusion through the booking process.


All participants in the end completed all tasks and I received great feedback. To better review my findings I added them to an affinity map. The next steps would be to iterate on the designs based on the first round of feedback and continue to test.

 
 

Takeaways

Being a pet parent myself I really enjoyed doing this project. I always find research important and sometimes it confirms what we already know. In this instance I was surprised with an unexpected pain point in my interviews that had a huge role in this project - focusing more on the groomers themselves.

Finding the right flow for the booking form was challenging at times but in the end I was able to meet the users needs while keeping the form as short as possible. If I were to continue on this project I would conducting more testing with groomers themselves to make sure their needs are also being met.