CASE STUDY - 2020
01. Pip's Original
Overview
Pip's Original Doughnuts & Chai is locally owned and family operated by Nate & Jamie Snell since 2013. They currently only have one location in Portland, but they are well-loved by the locals and people worldwide by serving hot doughnuts and homemade chai.
My role
Lead & solo designer - illustration, research, UI & UX, prototype, and testing.
Disclaimer
I am not affiliated with Pip’s Original in any capacity.
Timeline
June - July 2020
Problem
Describe your image
Describe your image
Problem
01. Not having an official website.
Maintaining an optimized site is crucial to acquiring new customers, building credibility, and nurturing relationships.
Describe your image
Describe your image
02. Poor design that leads to confusing booking experience.
Customer will more likely to seek out competitors for catering.
Personal objective
- Create a responsive and user-friendly website
- Create a better booking experience
User Persona
Scope & Constraints
- No access to analytical data to define the target audience
- Limited funds to conduct a bigger sample
Process
Competitive research: Two main competitors of Pip's Doughnut is Voodoo Doughnuts and Blue Star doughnuts.
- Voodoo Doughnuts - Oldest and the most popular donut shop from Portland.
They currently have 9 locations in the US, and their branding is unique. They have a responsive website, Facebook, and Twitter. They also have a catering van.
- Blue Star Doughnuts - Trendier and newer donut shop. 7 locations in Oregon and Southern California. They are always innovating their doughnuts, and their branding is modern and sleek. They have a responsive website, Facebook, and Instagram. They also have a catering van.
Quantitative & Qualitative research - Interview
I conducted a usability test with 3 participants in the existing website (pipmobile.com) to see how users interact with it. Interviews were conducted over FaceTime with one interviewee at a time.
Understanding the Users
1. All the participants felt that the booking website is confusing.
2. Two users pointed out that they thought Pip's Mobile is for a phone, not catering.
3. Some people expressed that they don't know what the opening hour of Pip's is on their Facebook. Younger users had no problem finding that since it is very accessible on Google. I looked deeper into it and found that older users are using Microsoft laptops, and their built-in browser is Bing. I searched and found out that when people searched up Pip's donut, the hours were wrong because it was pre-COVID hours. This caused elderly customers to show up at the wrong time.
User Flow
I created an ideal user flow from the data I collected as to how I imagined the website and the booking experience would entail.
Maria Journey's
1. Maria is looking for catering for her outdoor wedding in November.
2. She remembered that her favorite doughnut place does catering.
3. She looks up the website online
4. She then looking through the options to see what is in her budget.
5. Maria then starting to book through the website.
6. She then got a confirmation in 3 days.
Wireframing
An intro to the website, showcasing the community and Pip's.
Menu with pictures.
About us, introduce the people behind Pip's.
Catering
Shop/Merch
Landing Page
Based on the problem identified, I worked towards addressing these points by coming up with potentials solutions.
- Establish clearer visuals
- Break down the booking process into digestible chunks
After the initial user testing with the old website, some of the user's problems are locating the booking page. The user got lost easily during the process. The current website forced users to write down information or memorize too much information. After extensive research on different catering websites, I started pulling user interface inspiration from a similar website. I decided to stick with the screen by screen booking process to eliminate memory load. This gives people information instead of recalling.
Prototypes
For the main page, I really want to keep it simple but with a personality. I want to bring that mom and pop vibe into the website. This also will create a personal connection with the customer. Since a lot of Pip's current customers are not locals, I want to keep everything accessible and easy to find.
High Fidelity Mock-Up
Validating the Designs
To test out the new website, I surveyed the same participants, asked the same questions from my initial tests, and recorded their feedback.
As a result, 3/3 of participants could find and locate items much easier than before. It took participants on average 5-7 mins to book catering through the old website, and only 3-5 minutes with the new one. They said it was so much easier than the previous interview.
Since this is my first UX/UI project design, I was both nervous and excited. Despite my nervousness and chaos initially, I did the best thing I could and finished the project.
I had an amazing time, especially when I was learning and trying different ways to integrate what I learned into the website. I'm still in awe about how much I learned in these past 3 weeks. I cannot wait to learn new things about UX/UI.
Feedback is an important aspect of UX/UI, and since this is my first project, I would love to hear your feedback. Good or bad, it will greatly help with my learning curve. Thank you for reading.