Redefining the coffee order experience

While in the pandemic, I worked with a designer in Germany to develop a prototype of a online ordering app. We modeled our work on an existing software product called Spot On.

This case study explores the process and early stages of this digital product.

INDUSTRY: FOOD & BEVERAGE
ROLE: UX/UI DESIGNER

DESIGN PROCESS

01 Empathize

Assess the issues by deeply understanding the business problem, your target users and their needs through activities like market and UX research, and synthesizing gathered insights to inform your design approach.

02 Define

Define the problems, goals, and boundaries based on what was learned about our users, refining the focus and aligning on design scope, deliverables, and timelines.

03 Ideation

In the ideate stage, brainstorm ideas, challenge assumptions, and craft solutions, producing design artifacts such as wireframes or mockups to visualize concepts.

04 Design

Produce designs into tangible mockups and prototypes, emphasizing the connection of design flows and how they address user needs.

05 Test & Refine

Iteratively test and refine designs based on user feedback to ensure continuous improvement and refinement throughout the design process.

Research

The Market and
Competitive Analysis

We meticulously studied and examined Spot On's app alongside industry giants like Doordash, Uber Eats, and Postmates. By dissecting their app layouts and features, we identified key insights into user expectations and industry benchmarks.

USABILITY TESTING

Identifying Pain Points
and Usability Testing

We designed a robust usability testing protocol, engaging four participants across Apple and Android devices. Through structured tasks and open-ended inquiries, we aimed to uncover nuanced user experiences and preferences.

Spot On Home Page

STRATEGY

Analyzing Feedback:
Informing App Refinement

By synthesizing user feedback, we gained actionable insights into sentiments, pain points, and areas of delight. This guided Spot On's app refinement strategy, aiming to elevate user satisfaction and loyalty.

Information Architecture

We conducted a content audit and optimized the information architecture of the Spot On app, streamlining the user flow for easier business discovery, ordering, and payment processing.

USER FLOWS

Analyzing checkout processes of competitors like Uber Eats, Square, and Doordash, guided us in minimizing steps and improving navigation. This effort resulted in a new user flow from the home screen to the confirmation page, enhancing the overall user experience.

WIREFRAMING & MOCKUPS

I created wireframes and mockups, focusing on reducing clutter and ensuring an intuitive user experience.

MID FIDELITY SHOTS

Comparing the current app to the redesign reveals significant visual improvements. Changes include enhanced layout, clearer information presentation, and improved visual appeal, as depicted in provided screenshots.

ORIGINAL:
HOME SCREEN

Priority is deals or memberships which are not updated frequently.

REDESIGN:
HOME SCREEN

Expansive view of current location, cart, and local businesses.

ORIGINAL:
BUSINESS SCREEN

Reviews from third party brands. Access to menu varies on business.

REDESIGN:
BUSINESS SCREEN

Profile provides expansive view on featured items, points, & menu.

ORIGINAL:
PRODUCT SCREEN

Toggle menus and buttons create unnecessary friction and clutter.

REDESIGN:
PRODUCT SCREEN

Customization can be accessed by scrolling down from business profile.

AB TESTING

Three users rated their experience with the Spot On app and compared it to using the prototype. They evaluated clarity of information, ability to finish checkout, and visual identity.

Order Time Improvement: The prototype reduced order time significantly, with users spending an average of 2 minutes compared to the original app's 5 minutes for browsing, ordering, and checkout.

Task Rate Completion: The prototype achieved a 100% task completion rate, contrasting with the original app's 60% completion rate for checkout orders.

Net Promoter Score: Users gave the prototype a high (NPS) of 4.5 out of 5, contrasting with the original Spot On app's 2.5 rating in user testing.

REFLECTIONS

This project provided me with valuable insights into effectively work on a sprint with designers in different countries.