Carrion Coffee

An online coffee company I chose to re-design using UX principles

A glimpse of the final product…

Problem Statement

As a newly launched coffee company, Carrion Coffee's website requires optimization to meet the standard expectations of an eCommerce platform. Key improvements include a more intuitive top navigation menu, a smoother page flow, and accurate, accessible product information.

Competitive Analysis

Analyzing coffee shops that compete with Carrion Coffee Co showed that some features could improve the website and enhance the shopping experience.

Interviews

I created a survey to get more information on peoples’ preferences in buying coffee, since the website I’m working on is online only. I sent the survey to 2 people via email and collected their responses on SurveyMonkey.

Questions

  1. Would you ever purchase coffee beans online?

  2. Have you ever bought merchandise from a coffee shop?

  3. Tell me about a time you shopped for coffee beans

  4. What motivates your decision to purchase from a specific coffee brand?

  5. What is your favorite coffee brand and why?

Conclusion

Overall, people buy coffee in person and appreciate the design of the coffee bag. Ease of use and flavor are two big factors in buying from a specific coffee brand. If Carrion Coffee were to eventually sell products in stores, it would generate more revenue.

“I’m motivated to buy a specific brand by either a preferred flavor or perhaps an interesting design on the bag. Every now and then I’ll get some to support small businesses”
— Carey
“I mostly use Illy products that are already prepared for espresso, just due to the ease of using this for making espresso drinks at home. And it’s the only brand I can get in my store.”
— Lisa

Persona

User Flow

Designing the Wireframe

After gathering enough data to find out what the website needs, the next step was creating a wireframe to visually represent the new structure and layout.

Then, I refined the wireframe in order to create a clickable prototype that I could test on potential users.

Prototype Testing

I created a task list for users to follow while testing a Figma prototype. Three family members tested it at a table, and I recorded their thoughts during the process.

The task list I gave the users had a prompt rating the difficulty of each task, very easy being 5, and very difficult being 1. Rating each task gives me an idea of how each user felt about it overall, and showed me what I should prioritize.

After conducting the tests, I created a test report to show my findings.

I recorded each user's thoughts and their task ratings. Then, I shared what I learned from them.

I improved the wireframe after writing the test report, focusing on user navigation the most. The updated wireframe reflects a more user-centered design.

Before

Removed beginning screen

I learned that user testing is crucial for app design. I initially thought the tasks were easy and would rate them all a 5, but then realized some features frustrating for users. For instance, the home page wasn't clearly a home page to everyone, and the heart icon for the wishlist was not obvious. Limiting the categories in the hamburger menu also caused confusion. Through user testing, I was able to create a more straightforward design.

Task 1:

Find the Merch page. Speak your thoughts out loud as you look around. When you’ve found the Merch page, proceed to the next task.

Task 2:

Find the Home page. Speak your thoughts out loud as you look. When you’ve found the Home page, proceed to the next task.

Task 3:

Find the Wishlist page. Speak your thoughts out loud as you look. When you’ve found the Wishlist, proceed to the next task.

Added “Home” label

Removed heart icon

After

Added clickable elements

What I learned…

  • Not everyone has the same thinking process as me. Through research and testing, I was able to improve the product and make it more user-friendly. Without research and testing, I would create a confusing app that only I would understand.

  • Interviews offer insights into user opinions, while contextual observation reveals deeper understanding of user behavior. Combining interviews with contextual observation enables designers to better understand users, leading to informed decisions that improve product design and usability.

  • User testing is important because it identifies problems early, leading to a better user experience. It helps me to move beyond my own perspective.