Katie’s Cafe

I designed a mobile app for a small imaginary café located in Salt Lake City. Katie’ café focuses on serving high quality meals and coffee drinks.

Contact Me View My Work

Overview

My Role:

UX Designer, UI Designer, Researcher

Purpose of Project:

The goal of this project was to design a mobile app for Katie’s Café that would make it easier for users to easily order healthy meals and drinks

Target Audience

Personas:

Persona1
Persona 2

Problem Statements:

  • Rachael is a busy professional who needs to be able to order quickly because she has limited time
  • Emily is a health conscious parent who wants to be able to read nutritious information when she eats out because her son has a food allergy

Wireframe / Low Fidelity Prototype

I started this project by ideating and sketching with a pen and paper and used those sketches to create a digital low fidelity prototype in Figma.

Link to the low fidelity prototype

High Fidelity Prototype

high fidelity

Link to the high fidelity prototype

Home
About
Product Details
Checkout
Confirmation

Research

Methods

  • Study type: Two rounds of moderated usability study
  • Location: Remote
  • Participants: 4 users from age 20 to 45
  • Length: 15 – 30 minute sessions

First Round Findings

  • Users expect a review step before checking out
  • Users expect to see text labels in addition to icons

Second Round Findings

  • Low contrast colors make it difficult for users to read the application
  • Users expect to see text labels in addition to icons

Accessibility Considerations

  • Color: All colors in the final design have a high contrast ratio so users will be able to easily read text and see visual elements
  • Icon Text: All navigation icons have corresponding text so they are easier to understand
  • Hierarchy: The flow of information follows a standard hierarchy so it can be understood by screen readers
Upload Image...

Conclusion

What I Learned

I learned the importance of getting feedback and looking at other perspectives in the UX design process.

Next Steps

  • Conduct additional usability tests to further improve the design
  • Study competitor apps to look for new features to add

Want to work with me?

If you like my work and want to work with me, feel free to reach out and sent me a message.

Contact Me