UX Case Study: Shelter, Online Pet Adoption
What is the Design Thinking Method?
So, in the realm of Product Development, there is such a thing as a design process, now there are many methods for this design process, one of which is Design Thinking. This method takes a solution-based approach, or also called Solution-based.
So, in this case study, we will implement the Design Thinking method from start to finish.
There are five steps in this method, namely:
- Empathize
- Define
- Ideate
- Prototype
- Testing
This stage is the stage where we understand the user regarding the problem that we will solve. What do they want. We can also go directly to the field to communicate with them so that problems are more obvious.
Problem Research
I interviewed some friends about their problems with buying and pet adopting process during the pandemic. Some through chat and some participants from an online survey I made with Survey Monkey.
Then the following information was found:
- The number of respondents is 7 people. 4 boys and 3 girls
- 4 respondents are under 18 years old, 2 people are between 18–24 years old, and 1 person is between 25–34 years old
- All respondents have a desire to adopt a pet
- Respondents are interested in finding adoption info through the nearest pet shop, social media, relatives, and online stores
- Respondents experienced several difficulties, namely; limited types of animals, the location of the seller is far, takes a lot of time and effort, limited information, and the quality of the shop and the animal is not clear
- All respondents are more interested in buying pets online
User Persona
Furthermore, to make it easier to determine our user scope, and also to answer the question “Who am I making this application for?”, I created a User Persona “card” containing the target user profile for this problem.
In the Define stage, the information that has been obtained in the Empathize stage is analyzed and synthesized to identify the core problem, so that we know the problems experienced by the user.
Pain Points
After being analyzed, several core problems experienced by users were found, namely:
- Users have to find the location of the animal adoption shop and information about the opening and closing times of the shop which are sometimes not written on the internet/newspapers
- The user does not know the quality of the store so there are doubts about the quality of the animals in each store
- User says that some pet buying and selling applications mostly look uncomfortable and sellers are quiet
- User has to give up a lot of time and energy to go to the store one by one until there is a match
- User doesn’t get the animals they want due to limited resources
Action Points
Then, I change the Pain Point earlier into an Action Point in the form of questions about what I should do to deal with the various problems above. The Action Points I get are:
- How do you get buyers to know firsthand all the pet shops in the surrounding area as well as information about the store without looking from other sources?
- How can you make shoppers have no doubts about the quality of the animals in each store?
- How to shorten the buyer’s time in the pet buying process?
- How do you get buyers to get the animals they want?
- How to make this application crowded with users
- How to make it easy and comfortable for users to use the application
Well, at this stage we will make ideas about what answers the various questions in the Action Point we created earlier. We need to collect as many ideas as possible so that more and more the most solution possibilities emerge.
Solution
After collecting various kinds of ideas, it was decided some of the most solution ideas, namely:
- We make an online pet adoption application for smartphones, not only that, I give features in the form of :
- Included are reviews and ratings of buyers at the pet shop so that other buyers know the quality of each store
- There is a list of animals in each store that are ready for adoption along with their characteristics
- There is a list of any pet shops in the surrounding area, without having to search for too long
- Individual sellers can sell animals or their equipment for delivery, which can be delivered to the buyer’s location
- Buyers can communicate via chat with buyers via the application
- Create user-friendly applications, and easy to use
- Presenting articles, news, and tips & tricks related to the pet world
- Not only selling animals, but shops or individuals can also sell animal needs, accessories, and equipment such as cages and food
User Flow
To help map the user flow when using this application later and also make it easier for users to achieve their goals, we created this application User flow. Here I use the whimsical website to make the user flow, it’s free
Sketching
here I just need paper and a pen to sketch how the design will look like. Explore as much as possible from various layouts to content hierarchies.
Usually, designers like this stage the most because we start designing the whole application here. Here I use the Figma application to make the design
First of all, I named the application Shelter, which implies later this application is a place for pets ready for adoption.
Wireframe
Then, the first thing I design is the wireframe, which is a rough layout design that doesn’t need to be too detailed but I can already identify the layout of this application.
Moodboard
It would be nice if I explore existing designs to add inspiration to the ideas of design styles, layouts, colors from our application later. Usually, I search on Dribbbble and Behance.
UI Guideline
This is the step that determines the branding style of our application, from colors, typography, margin sizes, logos, etc. This makes it easier for us to be consistent in using resources and maintain the Branding DNA of our application.
High Fidelity
Next, I start visualizing the rough design into a Hi-Fi design. And from here later, I can consider our design to enter the production stage because I can say that our design is quite mature.
At this stage, I validate the prototype earlier to our users, so I get an insight into whether the prototype is suitable and whether the user’s problem is resolved properly?
I will do Usability Testing, which is where I will prepare several scenarios that the user needs to do with our prototype. Here I use a testing tool called Maze.
Untuk kalian yang ingin mencoba tes validasi ini langsung aja klik disini.
Hasil Test
From the test results that I got, some users are still having problems using this application, for that, I do a checkup on the path interaction that the user goes through. Then it was found that the user could not interact with one of the features, in this case, the filter feature.
So, what needs to be improved is the prototype, so also for those of you who want to try Usability Testing, try testing all the existing features, because I also don’t know which one the user will interact with, I can’t force the user to do testing through the flow. that I create, let the user naturally use the prototype. And also from the prototype that I made, there are many paths that the user can take to achieve the goals of a testing scenario. You can see the user heatmap on the path that the result failed so that it is clear what the user interacts with and I can also easily inspect what still needs improvement from our application prototype.
Kesimpulan
Design Thinking is very valuable in solving problems because each stage of this method is mutually sustainable with each other, I cannot proceed to the next step because I need each step to be completed coherently. So for this Online Pet Adoption problem, I can find out and analyze the problem thoroughly, because the stages that need to be passed are coherent and structured. As a result, I can understand the user’s problem, identify the right solution, evaluate our solution, and achieve the goals.
Soo that's for today’s case study guys, actually, when we have a failure at one stage, we can still return to the stage that needs to be fixed. The example in the Ideate stage does not result in solving the problem, so you can return to the Emphasize stage.
For you guys, I have a few tips regarding the tools I use to organize this design thinking process, so I use Miro, it’s free and easy to use. if you want to see the miro board from this case study, check the link below
Semoga bermanfaat 🙌
