1, 2, 3, Groceries
Indepedent Class Project
Time Span: March 2024 - May 2024
Role: UX Designer, UX Researcher, Prototyper
Skills: Diagraming, Prototyping, Research, Figma, Sketch, Keynote
Why does there need to be yet another grocery app? Isn’t the market already too saturated?
Big Question
After my classmates and I conducted contextual inquiries, we found that grocery shoppers are in search of a more streamlined shopping experience. There is an opportunity in the market to curate a more streamlined product navigation.
Want to skip the read and listen to my presentation instead?
User Research
Who am I designing for?
Validating Concept Through Research
Affinity Diagram
The Affinity Diagram highlighted the importance of the entire user experience when planning a mobile app. There are two overarching categories that influence how user shops for groceries (regardless of if they shop online or in person). The first is decisions they make while shopping, and the second is the decisions the user makes before grocery shopping.
Compiling Information to Create a UX Persona
Audience: "Systematic Sam"
Who is Sam?
Systematic Sam is someone who prioritizes efficiency.
“I like to leave my shopping lists vague so I have flexibility to try new things.”
- Systematic Sam
Biography
28
Non-Binary
Pre-Planned Innovator
Goals
01
02
03
Schedule time to shop in person.
Budget for food costs.
Try something new each week.
Design Strategy
In the eyes of my users, how will my prototype integrate into their daily life?
Storyboard
Two Scenarios to Design For
Scenario 1: Sam schedules time to shop in person.
After the UX visioning sessions, my group came up with a highly automated grocery store concept. In my storyboards, I translated these ideas to an accompanying mobile app. The 3rd screen of this storyboard shows Systematic Sam immediately seeing the best in-store offers. Although I tried this in my first prototype, it wasn’t intuitive without an actual store accompanying the app. In my latest iteration, this screen turned into the user seeing their recent purchases as soon as opening the app.
Scenario 2: Sam is choosing the best produce for them.
In this storyboard, the 2nd screen made it to my final iteration. A service that users seemed to like was the ability to compare similar products.
Prototyping and Testing
For an unreleased project, how can I test success and progress this project beyond the scope of my class?
Creating a Paper Prototype and Testing it on a Real User
Paper Prototype and Feedback
Low Fidelity Paper Prototyping helped me narrow down what features I needed to remove. For this first iteration I wanted to have as much repetition as possible. For example, being able to access the product page from the camera app, a home page button, and a qr scanner.
After testing, I learned that the user actually prefers one streamlined method.
Visualizing Feedback to Develop Another Iteration
Interpretation and Redesign
I used a flow diagram to better understand what steps I need, and to simplify my app. This helped me visualize the new product page based on a simplified flow diagram.
Using Testing as a Benchmark for Success
The 3 phases: research, ideation, and testing, are a loop. Some tasks, like Digital Prototyping, exist in multiple phases of a project. For this project, my final step was the testing phase where I presented my design to users to see how close I was able to get to my initial goal.
Creating a Digital Prototype and Testing it on a Real User
Digital Prototype and Feedback
For this round of testing, both users were able to quickly navigate through my digital prototype. The first screen is what immediately shows up now when a user opens the app. After the simplification, I didn’t notice users missing any of the repetition, from the paper prototype, of how to access the product screen. That made me more confident about the design decisions I made for this iteration.
