Ironhack UX Case Study II
Local E-Commerce: The Dog Bar
Brief: Applying the design thinking process to the redesign of a local e-commerce’s website
Timeline: 4 days
Role: User Experience & User Interface Designer
Teammate: Julie Lim, UX Designer
Our third week at the Ironhack Bootcamp focused on helping local businesses improve their online presence to be more competitive in the market. Like the previous week, this was a team challenge. I was paired up (virtually) with a fellow classmate— Julie and immediately started conducting market research and analyzing the current website for The Dog Bar, intending to design viable solutions. Establishd in 1996 in Miami Beach, this modern pet boutique garners raves for its eco-friendly toys, luxe accessories & in-store services.
01. Discover
Before can jump into the methodologies we used to tackle this case study, it’s important to understand who we are designing for, who exactly our prospective users are, and who the business stakeholders involved are.
Through our secondary research, we learned just how much the pet industry has exponentially grown in the last year since COVID. We conducted a business & competitive analysis in which we compared The Dog Bar to several other companies offering similar products, we not only gained knowledge about how The Dog Bar distinguishes itself from other companies but also imagined ways in which the company’s website could apply features that could grant them a competitive advantage. Our goal is to grasp a better understanding of the pet parent’s needs, desires, and pain points to provide our client, Dog Bar, with strategic solutions that will improve the shopping experience of its users.
01. DISCOVER
Market Research
Before we start delivering any solutions to the business needs and goals, it is important to first identify the stakeholders in the business and conduct stakeholder interviews to develop a thorough understanding of the business. The identified stakeholders in the business were customers and owner/staff.
Because of the time constraints, we were not able to get the interview from the business side, but we made further research. Through the secondary research, we gathered data to get an insight into pet industry markets. We learned that the pet industry is growing exponentially for another 5–6 years.
“43% of dog owners buy premium pet food.”
“61% of US pet owners will pay more for foods to target pets’ dietary needs.”
“It’s estimated the US pet industry reached $99B in 2020.”
Pet Industry Statistics & Facts for 2021 — Petpedia.com
“The forecast predicts the global pet care market will reach $358.62B by 2027.” — Globe Newswire
Lean UX
To gain an understanding of the industry furthermore, we performed the business and competitive analysis. We integrated the Lean UX Methodology to focus on both and business and users’ problems and their expected benefits and outcomes through the solutions which would be validated through usability testing.
Through the Lean UX Canvas, we came up with some assumptions for both business and user perspectives:
The Dog Bar:
- It has to compete with big-box retailers.
- It has to gain new clients.
- It has to maintain a well-executed online presence.
- The business outcomes are tied to increasing orders and the ability to do online orders.
- It needs a way to provide seamless experiences for the customer to make online orders and delivery/pick-up simple and easy.
The Users:
- Customers are pet parents, big-box retailers, veterinarians, etc.
- Customers want to support local businesses.
- Customers want an easier, more convenient online order and delivery process.
Business Analysis
We analyzed the competitive landscape with a Competitor Analysis to analyze both the current competition and potential competitors who might enter the market. The Competitor Analysis helped us to under what could there in the current pet shop marketplace and what are their different branding strategies and features are working out or missed for them. We identified The Dog Bar’s main competitors which were similar to its branding and revenue size. We also included larger corporations like Chewy and Petco to check how the market size will affect their strengths and weakness.
Brand Comparison Chart of Competitor Analysis
Through the Competitive Feature Comparison Chart, we could cross-compare different aspects of all the companies. The most predominant features were their delivery system and the reminders and subscriptions. We found that local pet shops lacked ingredient filtration from product selections and many of the shops did not have a setup system of descriptive pet profile information for users’ pets.
INSIGHTS — Two areas of opportunities are:
- Descriptive pet profile information
- Ingredient filtration
Market Positioning
We analyzed the current market through the Market Positioning Map which identified where the current position of the client’s business and gaps in the market that our offering can take advantage of and turn into an opportunity.
It was important to consider what the users value through the market positioning axis components. We used the data from our secondary research and survey results to inform our decision to focus on luxury vs. value for the y-axis and niche vs. variety for the x-axis. We identified the market position of luxury and variety as the area of potential opportunity and a blue ocean for The Dog Bar.
Heuristic Analysis
We conducted a heuristic analysis that evaluated a product design to test its usability to check the current user flow of The Dog Bar’s website and see where we can add value to the website. We used the UX Check plugin for heuristics testing and we had the following insights:
- Match between system & real-world — users expect to enter their pets’ information before they select the product
- Help & documentation — users expect to have live chat available when they are not available to visit the store site
- Consistency & standards — users expect to see more simple and less repetitive of the same options within the website
User Research
Quantitative Data — 23 online survey responses
To get the general data of the users’ demographic information, habits, pains, and goals, we surveyed google Forms and Reddit from 23 customers who were pet parents. The survey questions were focused on the customers’ habits and their goals/needs of making purchases from their pet shops. Some important data that we gathered from the results are following:
- 56.6% acquire their pets’ food and supplies through an online retailer.
- 78.2% claim health benefits and quality are the most important factor when choosing their pet food.
Qualitative Data — 3 user interviews
To get a deeper understanding of our user group, we conducted a total of three individual interviews where we discussed their pet food purchase experiences. Most of the interviewees mentioned the need for clear descriptions of the ingredients and an easy way to find the right food options for their pets.
The followings are some quotes from the interviews:
“Whatever my pet needs, and will help her, I’ll get.” -Valeska
“I want to provide the best quality food with good ingredients that fit for my pet with no hassle of the ordering process.” -Dan
“They are part of the family. When they hurt, we hurt when they’re happy, they make us happy.” -David
02. DEFINE
Affinity Mapping
After gathering all of the insights from user research and market research, we were ready to synthesize our finds and define the main problem. The research data was organized in the Affinity Diagram to find patterns and commonalities among the answers.
Key Takeaways:
- Customers are highly concerned about their pets’ health as a lot of their pets are suffering from some sort of food allergies or food sensitivities.
- Customers are willing to spend their money to get good quality food for their pets.
- Customers want to have convenient and seamless experiences when they order pet food over the online shop.
- Customers get frustrated when they encounter descriptions of products that are misleading with the actual ingredients.
Value Proposition Canvas — Customer Profile
We employed the Value Proposition Canvas to ensure that our solution meets the customers’ values and needs. At this point of the process, we started with the Customer Profile part of the canvas to map out the values for users by exploring the customers’ jobs to be done when they hire The Dog Bar’s website and the pains and gains they experience.
Customer Profile of the Value Proposition Canvas
Here, the Customer Jobs to be done includes the functional, emotional, and social aspects of the jobs to be accomplished by the users. The Pains describe anything that annoys or prevents the users before, during, and after trying to get their job done. The Gains describe the outcomes and benefits the users expect, desire, or require to have as they get their jobs done.
As-is Scenario Map
With the collected data, here in the As-is Scenario Map, I built out the user workflow to understand the users’ current experience to identify the problems to solve and opportunities to improve the experience with new ideas.
We found the unique phases of the users’ current experiences in three steps: setting up account and profile information, looking at matches’ profiles & making conversation, and planning a date & Enjoying the date. We circled the negative areas that we found to be further synthesized as problems to solve.
User Journey Map
To further visualized the user experience process that users going through to accomplish a goal, we created the User Journey Map. The User Journey Map helped us to look at the process from the user’s perspective with a specific storyline, understand, and address users’ needs and pain points. It helped us further empathize with them and found opportunity areas to improve the experience.
Here, we could look at the user experience at a glance and found three distinctive areas of pain points where we should focus to work to make their journey better.
Reframing the problem
Based on our research and the User Journey Map, we finalized the problems in the following statements:
1. Some food packages claim to have certain nutrition benefits, yet the ingredients contradict the branding.
2. Express checkout is not available.
3. Delivery can be back-ordered when products are out of stock.
How Might We
We started to brainstorm about How Might We help the users with their experience hiring the products.
1. HMW keeps our pets safe from wrongly advertised foods?
2. HMW accelerates the user journey when placing an order of dog food?
3. HMW assure the users of timely and accurate deliveries?
We found where we should focus on the Dog Bar website to bring efficient and effective solutions to improve user experience.
IDEATE
Before we jump into developing any ideas into solutions right away, we brainstormed further with each HMW’s in the ideation phase to generate ideas that the business was capable of and the feature we adopted could solve the defined problems
03. DEVELOP
MoSCoW Method
After brainstorming with the ideas, we prioritized those key features that we could add to the E-Commer website to bring value to the users and the business client in the Feature Prioritization process using the MoSCoW Method. The ideas of the features are categorized into Must-Haves, Should-Haves, Could-Haves, and Won’t-Haves. The key features would be mandatory to be applied for the end product to solve the user problems.
As Must-Haves, creating a pet profile, a filtering system for ingredients, pre-filled information, and guest checkout was selected for our impactful features for the E-Commerce website.
Value Proposition Canvas — Product Market Fit
Here, we revisited the Value Proposition Canvas to look at this canvas’s value proposition part, (left) We were focusing on the features, functionality, and benefits that the final product would offer to meet the customers’ needs and business requirements. We aimed at achieving a fit between what the customer wants and what our products and services can offer to overcome pains and generate gains.
Each section of the Value Proposition part corresponds to the relevant Customer Profile section but deals with the product. We filled the sections to offer the Products & Services to meet the Customer Jobs, to describe how they alleviate the defined customer pains, and how they create customer gains.
Jobs To Be Done
The JTBD framework focuses on the users’ situation, their motivation, and the desired outcome. It catches the main jobs that the user needs to get done and the things they hire to get their job done.
WHEN A USER is a pet parent and needs to purchase pet’s food with specific ingredients with high quality THE USER WANTS TO use a pet food retailer website that gives detailed products information/key ingredients, with a seamless checkout process & clear delivery instructions SO THAT THEY CAN buy quality food without the fear of any allergens in the food, WHICH MAKE THEM FEEL safe & happy for their furry friends and have peace of mind.
Job Story
- When I purchase my pet’s food, I want to know which ingredients are in the pet food so I can determine if it is safe to give my dog with underlying health conditions (allergies, etc.).
- When I purchase my pet’s food, I want to know if it allows express checkout by remembering the information so I don’t have to enter mine and my dog’s information every time I checkout.
- When I purchase my pet’s food, I want to know that they provide a subscription model so I don’t have to worry about storage of the food and low in stock.
Minimum Viable Product
Based on the data, the Minimum Viable Product would be offering to solve the user problems and meet the users’ needs as well as bring our client The Dog Bar to the targetted Blue ocean of “luxury” and “Variety.” Here the MVP is defined in the statement with the following MVP features.
Our minimum viable product is an online tool that lets users create pet profiles to enter specific pet information and allows them to browse and filter out pet food products with certain ingredients that they want or don’t want to have for their pets, and the subscription model to fit the customer needs.
Features
Feature #1: Pet Profile
Feature #2: Filtering System
Feature #3: Subscription model
User Flow
Understanding the data with user journey and the adopted MVP, we created the User Flow Chart to define the screens and actions needed for a user to accomplish tasks and achieve certain goals. Here we created several users flow to understand how different paths that users go through for each different task.
The user flow represents the happy path that the user will take to get their job to be done. This helped us to get a better sense of users’ expectations and how they will be interacting with the prototype. For this project, we focused on the user flow with an existing user taking a purchasing procedure with an existing ‘dog profile.’
04. DELIVER
LO-FI Prototype & Usability Test
To come up with our initial designs, we time-boxed ourselves with an exercise called the crazy eights method to brainstorm layout ideas for the new features. Then we transferred the Lo-Fi Prototype sketches into wireframes on Figma to conduct the Usability Test. The early stage of prototyping and usability testing is an important part of the UX process because it allows to “fail fast and fail cheaply”.
We offer the usability test of this Lo-Fi Prototype with a few potential users through the usability website called “Useberry” to evaluate the new checkout procedure with the pet profile page on The Dog Bar website. We relied on usage metrics in conjunction with ten usability tests. This allowed us to gain a deeper understanding through both qualitative and qualitative information.
Although users were able to get through the checkout procedure quickly, they continued to struggle with the parts of where they are with a lack of information, when to type and when to select buttons to proceed to the next steps. It was necessary to organize the elements and screen layouts.
Key Takeaways:
- Lack of information to show where they are
- Unclear options and selections to proceed to the next steps
Mid-fi Prototype
We moved to the Mid-Fidelity Prototype design using Figma. This iteration included the revisions made to the dog profile page and more complete wireframes. Our Mid-Fidelity Prototype accomplished the task of easy and seamless navigation to help our users to find their information quickly, incorporating the filtering system for individual pet conditions and food preferences, and providing clear delivery instructions with a subscription. The users’ information was already pre-filled once they sign in and log in back to the website, so they wouldn’t have to go through the process of entering their information every time.
The scope of the 4-day sprint ended at the Mi-Fi Prototype stage in this project; however, if we had given more time, we would conduct the usability test for the mi-fi prototype and proceed to create a hi-fidelity prototype.
CONCLUSION
Success & Failure Metrics
We will know if the changes to the website are a success through the following success metrics:
- Task completion rate
- customer return
- Good customer reviews
- Increase in online orders
- Healthy pets and Happy pet parents
On the other hand, we will also know if the design doesn’t meet expectations or create value for our users through these failure metrics:
- one time customer
- High bounce rate
- Negative customer reviews
- Incomplete or canceled orders
- Little to no increase in online orders
Knowledge Gaps
The whole process of the project was done virtually through Zoom with my teammate Karina. We definitely had some knowledge gaps for the business analysis research. If we could have more time, I would definitely reach out to the owners of The Dog Bar in Miami, FL, and have a conversation about the changes that they have experienced during the COVID-19 and their goals and objectives for the business moving forward. Also, I would preferably conduct more interviews with the regular customers of The Dog Bar to gain more insights into the users’ perspectives toward the business
Next Steps
The following will the next steps I’d do:
- Sketch the other user flow and put it to test
- Develop the actual filtration system in details
- Iterating into Hi-fi prototypes
Takeaways & Learnings
We learned how important it is to understand the users’ thought processes as they go through the tasks through usability testing. Also, We noticed that users might complete the task with 100% completion, but that is not always what users expect to achieve their goals.
As a team, Karina and I communicated over Zoom. It could be much convenient and easy to share the design process in person; however, through the virtual system of Miro & Figma with the aide of Zoom, we learned to cooperate in the working process and were able to overcome the constraints of working remotely.
