Streamlining business management for
groomers and dog trainers.
GoodFriend • Full MVP Launched Oct 2021
GoodFriend is an all-in-one platform designed to run a grooming/training business simply.
🔗 Visit the live site at https://www.goodfriend.com
Team ↓
Project managers, 10+ engineers and 3 designers
Matt Harlan (Creative Director)
Anna Sherriuble (Senior Designer)
Me (UX Designer)
Tools used ↓
Figma
Google Docs
Usertesting.com
Timeline ↓
Apr 2021 - Aug 2022 (1.5 years)
MVP release: Oct 2021
Design Sprint Cycle & My Roles
I joined this project as the sole UX Designer.
Led all UX research including market research and competitive analysis.
Defined end-to-end user flows with stakeholders and developers.
Created wireframes, prototyping, and part of the visual design mockups.
Led Usability testing for the search feature improvement.
✨ The highlight of my accomplishment ✨
Designed the holistic experience from the concept to the final product.
Shipped full end-to-end provider-facing user flows and wireframes.
👉 Click here to see all the user flows for service providers.
Designed an onboarding flow based on usability testing to help first-time users set up their businesses to enable online booking.
How did it begin?
Our client ‘Kinship’ had an idea for a new web-based service in the pet industry and they reached out to Graveflex to build the pilot website for both customers (pet parents) and providers (business owners).
This case study focuses on a pet care service provider(business owner)’s user experience.
Click here if you’re interested in the pet owner user side of the service.
Background
Small pet care business owners wear
many different hats every day
Owning a small business is a 24/7 job. They need to take care of many tasks like acquiring customers, running their own social media accounts, managing business expenses, and, most importantly, providing services.
Therefore, small pet care business owners spend too much time bogged down in their day-to-day operations and not enough time actually focusing on the quality of service & growing their business.
(Source: “U.S. small business owners assessment of their biggest challenge”, © Statista 2022)
The Problem — What do we need to focus on?
Target User — Who is this for?
Small Pet care business owners
— Groomers, Dog Trainers
Pain points
It’s difficult to promote my shop to potential customers.
Had to contact customers multiple times to get delayed payments.
Manage last-minute booking or cancellation.
Needs
Grow my business constantly.
Easily track my cash flow and manage unpaid appointments.
Easily manage appointments and employees’ availability.
Automate daily operations to focus on
things that really matter
Pet care business owners should be able to easily 1. market their business, 2. start an online booking system, and 3. manage appointments and payments — so that they can save time to focus on things that really matter!
The Goal — Challenge accepted!
The Solution
Psst, jump to the Design process if you want to check that first!
Solution 01
Listing business
Market your business on GoodFriend. (Grooming, and training service for MVP)
Sign up and claim your business.
Enter your business will come up automatically if it is already in our database.
User can also register a new business if it does not exist yet.
Solution 02
Start online booking
Set up the business to start receiving appointment requests from the customer 24/7.
Add services that you offer with details like price, length of service, and why it’s unique.
Add staff member and their availability.
Connect your bank account to get paid.
Solution 03
Manage appointments and payments all at once
Just one click to accept the appointment requests. Easy to checkout after you performed the service.
Manage appointments on your calendar in seconds.
Easy to manage appointments by a few clicking.
Charge client’s card on file automatically to offer stress-free checkout experiences.
Solution 01 | Listing business
What are others doing?
The purpose of this research is to:
Know how other services are solving the problem - Focusing on the ‘Business registration’ flow.
Discover competitor’s user flow and UI for this feature.
Getting some ideas of common design patterns or data they are getting from the user.
I looked into the business registration process of competitors (Yelp for Business, Google Business Profile Manager) that connect local small businesses with consumers. Through this competitive analysis, I was able to get ideas on what information to get from users and interface configuration for the business registration flow. I found that each competitor used a feature where you can search for your business in their database (if it exists) to use pre generated information from other sources to set up your business, saving the user a lot of time.
Solution 01 | Listing business
How we can help users finish the business registration process faster?
The purpose of this step is to:
Define the user flow and interface for the business registration.
Determine the scope for MVP with stakeholders and developers.
Based on the insights obtained through Competitive Analysis research, I created user flows and wireframes while considering all the possible situations in the business registration process. We made a decision to add an ‘Existing business search function’ with the seed data of about 30,000 Grooming salons and training centers across the United States in our Database. I found that this feature has the advantage of allowing users to complete business registration faster so that we can avoid users dropping in the middle of the flow.
Solution 02 | Start online booking
What needs to be done to start online booking?
The purpose of this step is to:
Make wireframes to define the feature and IA for each business setup page.
Determine the scope for MVP with stakeholders and developers.
To start online booking, a business setup process is required. At this time, we need to collect some information about the business from the user. I focused on designing each screen to make this complex process easier for the user to understand. When I finished designing each setup page, I realized that we need some sort of a guide for this complicated process. That’s why I designed a simple ‘Onboarding checklist’. (Made it like a simple overlay to consider dev feasibility in the tight deadline.)
Solution 02 | Start online booking
So then we asked users “how do you feel about it?”
The purpose of this step is to:
Validate the business setup flow with onboarding checklist to see if there is anything that we can improve.
Ensure that this feature and overall purpose is in line with what users want.
After completing the wireframes for the business setup flow with the onboarding checklist, we conducted usability tests to obtain feedback from our target users.
Participants 👥
Recruited 2 pet care service providers
2 dog trainers, both self-employed, 1 Millennial and 1 Boomer
User task
Set up their business to enable the online booking
Find out how users understand and use the onboarding checklist to complete their task.
Test Results
Confusing 👎
I don't know what to do on the first screen.
Lack of descriptions of how to complete the task for each step.
Inconvenient to click ‘onboarding checklist’ each time I want to check the status.
In addition, we made an animation when the entire onboarding checklist is completed, to help make users feel more engaged and to let them know what happens next.
The page that showed the checklist changes to the ‘Home’ page. This page works as a dashboard so the user can check today's bookings, requests from customers, and new reviews.
Through the Usability test, we were able to get feedback on what needs to be improved with the current onboarding checklist. Based on that, we designed the onboarding checklist V2.
Afterward, we had multiple dev feasibility meetings to check whether the V2 could be developed within the deadline, and clearly redefined the criteria for each step to show what tasks need to be done to complete each checklist item.
Solution 03 | Manage appointment and payment
Understand customer and provider’s interaction in real life
The purpose of this research is to:
Define the user’s journey for both customer and service provider based on each service phase (booking to payout)
Lay out all the scenarios for each service phase.
immediate up-front VS payment post-service
appointment approval step
no-show/cancellation
modification (adding /changing services, prices, discounts, gift cards, etc)
Adding a tip
Determine the scope for MVP with stakeholders and developers.
I created a service blueprint diagram to see the entire booking and payment flow for customer users and providers. In order to understand the behavior of each user, I conducted desk research to learn how pet grooming/training services work in real life. From there, I laid out the customer and provider’s actions, step by step, and came up with all the potential situations like checkout, appointment approval, cancellation, service modification, etc.
Based on discussions with developers and stakeholders, we determined to integrate Stripe and charge client’s card on file to offer stress-free checkout experiences for users.
Solution 03 | Manage appointment and payment
Connect the abstract flow chart to its visual design
The purpose of this step is to:
Display information architecture visually.
Turn the abstract nature of a flow chart into something real and tangible without distractions.
Ensure all the team members and stakeholders are on the same page.
Example) Appointment detail wireframes based on each booking and payment status
The wireframes were created to visualize the reservation/payment flow. The goal was to eliminate the bulk of the workload for busy small business owners. Automatic payments using customer credit cards on file and simple check-in and checkout with a few clicks were designed because of that reason.
In collaboration with our visual designer, the color code for each Appointment/payment status was determined, and accordingly, the same color was used to reduce user confusion and intuitively designed where the appointment state is displayed on all interfaces.
Final Design
Made final mockups for Desktop, Tablet, and Mobile to support the responsive design.
Now users can access our service from any device, anywhere.
It’s time to wrap up!
The purpose of this step is to:
Finalize the solutions, and get the stakeholders’ feedback on the hi-fi mockups.
Handoff deliverables to developers including:
Design comps for different devices to support responsive website
Assets (images, icons, fonts, UI components, etc)
All the design comps for different states.
We made high-fidelity designs based on the brand guideline from the client. Our visual designer already made the Design system so I used the components from there to make sure all designs were consistent.
The Result
We successfully launched a provider-facing website with the MVP feature in Oct 2021, and our client extended the contract with us. The client mentioned that our performance fulfilled their expectations and we have enough capabilities and skills to continue to improve the product.
Now, the project has been officially wrapped up since the client decided to temporally discontinue the service. With GoodFriend, we created a brand new product from an idea in the real world.
Reflection
To design a business management tool for groomers and trainers, it was key to understand their day-to-day operations and work environments.
Easy and intuitive design was important considering the various users. (e.g., users who are not familiar with using online services might still find it difficult to set up their businesses on GoodFriend.)
🧐 What did I learn?
🤔 If I had more time…
To better understand the user’s problems and needs, it would’ve been helpful to observe their behaviors and interactions with the customers at the workplace.
There was a lack of consideration for users unfamiliar with new technologies or unique work environments. (e.g., mobile groomers or trainers).