Crave

 

Duration

My Role

  • June - August 2022

  •  User Research: Interviews, Usability Studies

  • UX Design: Wireframing, Prototyping

  • UI Design + Iterations


 
 

PROBLEM

Busy working professionals have limited time to place lunch orders for themselves and their teams.

Plenty of professionals skip out on ordering lunch online because they just don’t have the time to browse through the menu of a new app, place their orders, wait for the food to arrive, and eat their meal. Also, interns and associates, who are at times in charge of ordering meals for their team, don’t have an efficient way to place large orders.


THE SOLUTION

An easy-to-use cafe mobile app that provides busy users with plenty of options


PROCESS

Design Thinking Process


User research + interviews

I conducted interviews and created empathy maps to understand the users I was designing for and their needs. A primary group identified through research were busy professionals who don’t have time to eat their lunch during the workday.

RESEARCH QUESTIONS:

  1. Tell me about the last time you ordered food from an app.

  2. What challenges do you face when creating an order?

  3. If you could improve or change one aspect of the app you used, what would it be?

  4. What are the important features you look for when buying food/drinks from an app?


Pain points

3 key insights about users and their previous experiences

  • Time- Working professionals don’t have enough time to place orders and eat their meals during work hours

  • Limited customization options- It’s hard for busy professionals to find items they can quickly and easily customize to meet their dietary needs.

  • Information architecture- Text-heavy apps are often difficult to read and order from


persona + problem Statement

Problem statement: Raya is a busy professional who needs to be able to order a fresh lunch for herself and her team because she doesn’t have enough time during her lunch break to place all the orders and eat in peace.


user jorney map


wireframes+ Lo-fi Prototype

I took the time to draft iterations of each screen of the app on paper to ensure that the elements that made it to digital wireframes would be well-suited to address user pain points.

Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was creating and placing a group order and pre-placing orders, so the prototype could be used in a usability study. 


Testing + improvements

3 major improvements in my design

User feedback revealed what aspects of the mockups need refining. I continued to iterate on my designs until users were pleased with the overall look of the app.


The final screens

The final product

The style guide



next steps

If I were to continue this project I would conduct another usability study to validate whether the pain points users experienced have been effectively addressed with the high-fidelity prototype. After that, it would be time to finalize the designs and hand them off to the engineers for production.


conclusion + lessons learned

What I’d do differently next time

This was my first-ever UX project and I’m happy with how it turned out! I learned just how important it is to empathize with users and keep their needs front and center throughout the entire design process. Empathy helps designers spot user problems and solving these problems is the ultimate goal of UX design. Looking back at my work, there are things I would do differently having officially gone through this process. On that note, a few things I’ve learned:

  1. The importance of WCAG. For my next project, I want to be more mindful of the Web Content Accessibility Guidelines. I had to increase the font size multiple times because users were having trouble reading the text/buttons.

  2. Be consistent with the UI elements. I noticed the typography for my wireframes, mockups, and prototypes was not consistent. I had multiple different heading sizes and weights which threw the consistency off when pages were compared to one another. After noticing that I went back and changed the fonts so all the headers and body text would flow together and look seamless for the final design. Creating the style guide earlier would have also saved me time and hassle.

  3. Change is bound to happen. While creating this project, I learned that the initial ideas are never set in stone and are ever-changing. Usability studies and peer feedback influenced each iteration of the app's designs greatly, leaving it to look and behave a lot different than what I originally had in mind and that is totally okay.


Thank you for reading!

For more work inquiries email me at imanmuawiakhan@gmail.com