A website to help pet owners find the best for their fur ball of joy.
UX Designer | Sep 2021 - Present
Project Overview
Create an all-in-one website where customers can check for stock and shipments of their favorite products as well as browse care tips and stay in the know about local pet events happening in the area.
Bark N’ Bites is a local pet boutique located in the Bridgeport neighborhood of Chicago, IL. The boutique curates and sells natural and delicious pet food and other pet necessities to customers, whilst providing the best pet care knowledge. However, without a website, this local store isn’t able to broaden their customer base and help other pet parents which is the mission of this project, to create an all in one website that allows customers to browse items and also learn more about pet parenting and upcoming events.
Role
This was a solo project where I worked directly with the business owner to conduct research, user interviews, and design for the business’s website.
Methods
Competitive analysis, systems mapping, interviews, surveying, prototyping, usability testing, user journey mapping, and business analysis
Approach
Starting with understanding the user journey mappings of the various different users who will use the site and interview and survey to then create wireframes and prototypes. Where the main focus will be, creating a site where users will be able to see what items are in stock and reserve them but also have a blog feature to spread information on pet care.
Understanding the Problem
What is the purpose?
Bark N' Bites a local pet shop boutique in the heart of Bridgeport, Chicago IL has been serving the community's cat and dog lovers since 2013, however, with the pandemic and the busy everyday working individual's filled schedule, the store not having a website hampers on the customer's shopping experience.
The purpose of this project is to create an even more efficient and better experience for Bark N’ Bites customers that not only fits their needs but improves their overall time with Bark N’ Bites.
To create a website for a local pet boutique
Spread awareness and drive traffic to the site
Place orders on the site
Share additional pet information about pet care
Brand perception solidification
What is the problem?
More than the obvious issue that there isn't a functioning site for the pet boutique, is the other features the website should provide to enhance the overall experience patrons of Bark N' Bites have.
There is no site at the moment
Want to encourage more traffic to the site and to the pet store
Provide additional support to customers on store items
Easy usability of technology for less tech savvy customers
Problem Statement
Customers of Bark N’ Bites love to visit the physical shop, however, sometimes with a busy schedule or a time crunch it’s hard to go into store to get the items you want in a timely manner. Wanting to shop locally can be difficult without an online resource to check on the stock of items and purchase the right items for your pet.
Problem Breakdown
Who: pet owners or pet supply consumers
What: wants to look at what products are in stock at pet store\ wants to see specific products in store
When: users get frustrated when they go to the store and don’t have the item they want in stock
Where: will most likely use the app at home or away from the store on the way there to the store
Why: users might not have the time to call the store or have anxiety with ordering the product they want\ users want to access to whether or not an item is in stock at the store\ want to reserve the item in store
How: users want to be able to pick up the item they need from the store
Problem Needs
Website to show items in stock
Be able to reserve the items they want
Blog feature to spread and share pet care information
Business analysis of local competitors
Market Research and Competitive Analysis
Bark N’ Bites is one of the few LOCAL pet stores in Chicago and one of the only local pet stores that sell pet supplies south of the downtown area. There are a few other pet stores that offer additional resources such as grooming, daycare, and training all of which Bark N’ Bites does not offer.
There are other competitors such as Petsmart, Petco, and Pets Supplies Plus that are bigger corporation stores around the area that offer similar services to the competitors.
In terms of the local small business competitors, they have shipping and coupons to customers as well as blog and additional information on pet care and local events for customers as well.
However, based on market research, Bark N' Bites by far has one of the most supportive and also attentive customer base compared to the other local pet boutiques. Their reviews are nearly all 5 star reviews across the board and provide exceptional advice and information to their loyal customer base.
All these website provided customers with the ability to:
Place orders
Browse available products and items at the designated store
Contact and reach customer service
Book services with the boutique's staff
View order status
All these services are readily available to the customers of these various local pet shops, and since Bark N' Bites does not presently have this available to customers, it puts the shop at the disadvantage. Thus it is important to take into account what is already in the local market and conduct a comparative analysis to determine what features the Bark N' Bites site will include.
User Research
Used reviews off of the store’s Yelp, Facebook, and Google maps to consolidate a general understanding of the feelings the customers are feeling and would be feeling.
Customers of Bark N' Bites found having a website to simply check on item stock were more likely to shop at Bark N' Bites over other local pet shops.
Trends or Major Take Aways
A large selection of items but sometimes certain items customers want are out of stock
Always new inventory but no updates or way of knowing where to find out what the new inventory is
Really knowledgable staff who’ll guide you on things you have questions with
However, in a couple of reviews and also from personal experience, there was a sense of pretentiousness with the staff there making the customers feel uncomfortable with their experience there
Samples the store offers come in handy for pets when there isn’t stock of the item they typically buy
→ could be problem that many other pet owners face with their busy schedules they want to know when their pet’s food is going to restock/ arrive
Overall: Bark N’ Bites offers a wide selection of items that are oftentimes hard to come by at other stores and at a very reasonable and good price point. The staff are very knowledgable and helpful to customers and patient. However, there isn’t a way to check inventory before arriving to the store and no way to check when the next shipment is. And customers who are unsure about pet care, would benefit from tips the staff offer to them without having to ask all the time.
In order to provide the best experience to customers as well as cater to the business's needs in a realistic manner, brand perception must also be solidified and taken into account.
Bark N' Bites customers want to be able to readily check the stock and availability of their loved items and minimize the amount of time spent away from their busy schedules.
This must be done in a way that is inclusive to various technology abilities as well as hold true to Bark N' Bites' branding and shop persona.
Who are we designing for?
Tiantian | Current pet owner who is incredibly conscious about the food they’re feeding their pet, they only buy certain brands and or specific foods and treats with specific ingredients. Characteristics: has a higher budget and are tech savvy, always on the go and needs to know as much as possible.
Jolene | New pet owner who is coming to Bark N’ Bites to learn more information about pet ownership. Characteristics: tight budget and also working full time job but is tech savvy doesn’t have the ability to come in often, and is crunched on time but wants to learn as much as possible.
Ali | Current pet owner who’s been a long time patron of the store and loves to meet new people. Characteristics: not tech savvy and average budget but also wants to learn more about pet care and share information as well.
Starting the Design Process
Whilst starting the design process of creating Bark N' Bites website, mapping of the information architecture is necessary in providing a skeleton for the design that will be built upon.
As the homepage will be the main page of the customer's use, this must house all the other features that customers are looking for when browsing the website.
From taking in the input of the customers' interviews and research, the site goals were for customers to be able to: place orders, check on order status, check for stock and next shipment of orders, resources for pet parenting, new parent guides, and lastly a place to contact the store with ease.
After drawing out the wireframes of the design, the next part was to create digital iterations of the already drawn out designs.
Once these low-fidelity wireframes were finished, feedback was necessary to continue forward with the design build out. Asking and surveying various different customers and their thoughts, as well as gaining feedback from the store's business owner was a must as well.
"I like the simplicity of the design and how it's easily navigable. I'm excited to use the site!"
From several customers, I spoke with they all found the design to be quite pleasing in the sense that it's easy to use and when there's a busy day it'll make taking a short trip to the store much easier, since their order will be ready to pickup by then.
Setbacks and Reality
There were definitely hurdles in making this website design come to life, finding the balance between the needs and the ideas of the business whilst also creating a site that responds to requirements of customers is a fine balancing act. An act that requires extensive communication from customers and business owner to see what's best not only for the business itself but also for the customers, since they're the backbone for the business.
Refining the Design
Simple yet stylistic choices on the typography was decided upon because of the ease of readability as well as the complimentary aspect of the style to the color palette. Such colors were not yet muted but not too vibrant to the customers and evokes a playful and composed feeling to the users.
The Final Design
Finally rounding the corner, we have the final design of the website, which took various iterations that added and subtracted features and stylistic aspects to and from the final design.
Taking on style inspiration from other well known pet store websites, the final design plays upon those existing sites but uses Bark N' Bites' already existing branding to create a digital storefront representative of its' brand.
Going forward
Although, the final design of the website is presented here, there will always be additional changes to the smaller aspects such as the images and the blog posts in the Pet Parenting section of the site. Customers will continue to have a great and easy to use website that allows them to accomplish their pet needs at a touch of a finger.
I will continue to monitor and change any iterations with the business owner and as other customers continue to provide insights on the website's needs whilst developing the site and after the launch of it, as well.