The Pop Parlour (Case Study)
By Oscar Gonzalez
As we move into our 4th week at Ironhack, we got tasked with our second project. To help a local shop professionally improve their online presence in order to be more competitive in the market. The theme we choose was coffee shops, each person in the team got to choose their favorite and showcase their selected shop. We reviewed their social media profiles as well as their website in order to get a better understanding of their user interface.
Unlike the first project, we are working with a business that already has a finished product. We are just helping them further narrow down and define their platform. The process is somewhat the same but we don't need to use certain methodologies we used the first time.
Market & Competitor Research
We started our journey off with our first set of deliverables, creating a feature & brand comparison chart. This was a bit of a process because we had to review each and every single competitor in order to identify their features. In order to maximize time, we decided to divide and conquer, therefor Sam and I worked on the Feature & Brand comparison while Nat worked on creating the stakeholder and customer interviews. For the comparison we decided to include, Starbucks, Dunkin, Publix, Barnes & Noble Cafe, and Craft & Common below you can see both charts.
Feature Comparison:
This feature helped us compare how the competitors are implementing specific features and evaluate what works and what doesn’t. This process was not super difficult to accomplish but it was time consuming.
Brand Comparison:
This feature helped us compare how our competitors bran
by looking at their value proposition, offering, target audience, name, logo, slogan, and brand personality. This process was not super difficult to accomplish but it was time consuming.
Market Position Map:
We used this method to understand where our coffee shop is located based on specific qualities in the market. We then create a blue ocean circle in order to represent where we want our brand to stand.
Stakeholder/Customer Interviews
During her college years our teammate Sam worked at The Pop Parlour, she personally knows the owner so she volunteered to conduct the stakeholder interview. Since neither of us live in the general vicinity of the store, for the user interviews we decided to create a survey in order to reach more customers in a short period of time. Conducting face to face interview was a bit of a blocker because we don’t actually know any of the customers who regularly attend the shop.
In order to get the information we needed we had to tailor the interview questions carefully in order to not sound bias and get the information that we needed.
Affinity Diagram/Empathy Map
Once we had the information we gathered from the interviews and survey, we started working on the affinity and empathy map. We started off by creating a whiteboard on Figma and created sticky notes for every piece of information we gathered. Afterwards we started to group them together and created different sections (Gains, Pains, Habits, and Demographics) also created subsections (Product, Selection, Ordering, Design, Product Access, Company, Website Features, and Pros of Website). A lot of the responses we were getting back from the users were very similar. Users love the aesthetic of the page and they liked that it was simple to navigate. As far as pains go, more than 50% of the users said the website itself was not mobile friendly and it does not showcase the fact that they also sell coffee and other menu items.
Affinity Diagram:
Empathy Map:
User Persona/Journey Map
After organizing the information gathered in the initial interview and creating the affinity diagram/empathy map it was time to start creating our user persona.
User Persona:
Meet Adventurous Adam, he is a college student currently attending the University of Central Florida. Adam’s is new to the area and is looking for a one stop coffee shop where he can grab coffee, food and potentially become his new spot to study from time to time.
Journey Map:
Adams journey map gives us a brief overview of a possible scenario of something he could have experience while trying to find a coffee shop on campus. The journey map is composed of real data we collected during the interview phase. Most of the blockers Adam has during his journey map are real life blockers some of the individual we interview were having as they reviewed the website.
Problem/Hypothesis Statement
How Might We (HMW)
Before diving into our re-design prototype we first had to identify the repeated pain points users were having. The next step was to identify possible solutions to fix this issues, as designers I know its easy to fall into the habit of designing for ourselves and we constantly have to remind ourselves that we are not the user. We also have a tendency to want to fix every problem we find on the site, so the HMW statements are meant to help us narrow down so we can focus on whats really important to the users but also pleases the stakeholder.
Lean UX
The purpose of the Lean Ux, was to further assist us on framing our work as a business problem to solve, rather than a solution to implement. Then we dissect that business problem into its core assumptions in order to build up our hypotheses.
MOSCOW Method
We took our HMW and started coming up with ideas, then we used to the Moscow Method to help us categorize those ideas.
Sitemap
The sitemap for the current platform was a disaster, everything was all over the place and the header was extremely crowded. We decided to re-design it to be more simple for users and less crowded so they would not feel overwhelmed.
User Flow
We wanted to get a brief overview how the user would interact with the new website. So we went ahead and created a User Flow including all the steps a user would have to go through when ordering a coffee. We found ourselves coming up with a bunch of ideas and scenerios because we wanted to create the perfect platform. Something we kept in mind was that a good design is something that has room for potential growth further down the line, so rather than focus on perfection we refocused on the usability a user would need from the information we gathered.
User Stories
A user story is a brief statement that identifies the user and describes his/her core needs. They are short descriptions of a feature told from the user’s point of view. They typically follow a simple template like the one we did below.
Ideate
We started to ideate our ideas and put them into perspective, my team and I decided to go with the crazy 8 method. We set a timer for 8 minutes and we started putting together some ideas on paper based on all the data we collected. After the timer was up and each individual was done, we took turns explaining out ideas and why we chose the outlook of out design.
Our class time was limited so we did not have a chance to do this exercise more than once. So my team and I decided to each work on our individual sketches during our off time. The goals was to take the sketches from our crazy 8 methodology and further define them and build something off those ideas.
Sam’s Sketch
My Sketch
During our Saturday class we had the chance to review the sketches and define them a little more. We did a couple of more sketches of different ideas we could incorporate before drafting up our Mid-Fidelity sketches.
Once we had a better idea of how we wanted to design, we moved on to our Mid-Fidelity wireframes and prepared to create out prototype to we could test it using Maze.
Mid-Fi/Prototype
Maze Report
Once we finished up our prototype we decided to test out our design on Maze in order to get feedback from our user and make some improvements.
Overall we got a lot of good feedback from the users that participated in our Maze test. All 6 reported that the website was easy to navigate, it was simple and minimalistic and did not have a lot of distracting factors.
Maze results were 70% direct success and 30% indirect success, when the users were interviewed it seemed that the website was not an issue it was just the instructions were unclear to them. Also the fact that we left certain areas black confused them because they thought they had to put in the information themselves.
Takeaways
My team and I learned a lot during this project, it was really fun yet very time consuming. We had to do a substantial amount of market research in order to gather information about our customers, competitors and indirect competitors. For our customer interviews we had to divide them up, since we could not meet face to face with them we decided to create a survey and tailored the questions accordingly to get the information we needed. Luckily for us, the stakeholder interview was not an issue since one of our team members knew them personally.
During this processed we also learned about other tools and methodologies that can help us identify the core needs of both the consumers and the stakeholder. Something that was also helpful was that we already had an existing product so most of the research conducted was on how to improve it and make it more efficient for the customer. Since this project was also time sensitive we had to properly plan in order to stay ahead and not fall behind. We utilized the Kanban Methodology in order to organize and manage our workflow.
I think as a team we did well analyzing each others strengths and weakness in order to hand out assignments. Compared to the last project we did, I feel that my role changed during this assignment. I took more of a project manager role. I was constantly monitoring and making sure that all the deliverables were being completed in a timely manner. I look forward to working on a project by myself and seeing how I can incorporate each methodology I’ve learned through out the process.
Thank you so much for reading and following along, If you have any feedback or any tips please dont hesitate to comments or reach out to me. I’m always looking for different ways to improve my work flow and learn new ways of being more productive in this industry.
