Atlanta Meal Prep
Atlanta Meal Prep
Atlanta Meal Prep
Atlanta Meal prep is a food prep and delivery service in the heart of Atlanta, USA.
Atlanta Meal prep is a food prep and delivery service in the heart of Atlanta, USA.
Atlanta Meal prep is a food prep and delivery service in the heart of Atlanta, USA.
MY ROLE
User research & analysis
UX and UI redesign
Design library kit
Usability testing
YEAR
2024
TEAM
CEO, PM, 2 FE Engineers, 2 BE Engineers
CEO, PM, R&D, 2 FE,
2 Software Engineers
Challenge
Challenge
Challenge
WordPress service designed by a graphic designer, which made UX cumbersome, slow, and somewhat limited.
WordPress service designed by a graphic designer, which made UX cumbersome, slow, and somewhat limited.
WordPress service designed by a graphic designer, which made UX cumbersome, slow, and somewhat limited.
Impact
Impact
Impact
I redesigned the service reducing order time completion by 300% and increased the ordering success rate 4x.
I redesigned the service reducing order time completion by 300% and increased the ordering success rate 4x.
I redesigned the service reducing order time completion by 300% and increased the ordering success rate 4x.
Task Completion Rate
Task Completion Rate
Task Completion Rate
4x
4x
4x
Reduced time spent per order flow
Reduced time spent per order flow
Reduced time spent per order flow
300%
300%
300%
SUS score from 47,5 (F) to
SUS score from 47,5 (F) to
SUS score from 47,5 (F) to
82(B)
82(B)
82(B)
Assessing UX Before the Redesign
Assessing UX Before the Redesign
Assessing UX Before the Redesign
Analysis
Analysis
Analysis
Heuristic analysis outlining the key usability problems and improvement opportunities.
Heuristic analysis outlining the key usability problems and improvement opportunities.
Heuristic analysis outlining the key usability problems and improvement opportunities.
Interviews
Interviews
Interviews
Interviews & usability testing with 10 loyal customers on top tasks + SUS benchmarking.
Interviews & usability testing with 10 loyal customers on top tasks + SUS benchmarking.
Interviews & usability testing with 10 loyal customers on top tasks + SUS benchmarking.
6 areas for improvements
1.
Improve visual hierarchy
2.
Redesign clunky scanning UX
3.
50 shades of button into consistent IxD
4.
From a hard-coded menu to a contextual
5.
Add affordances and system feedback
6.
Introduce missing features and loyalty
Challenge #1
Challenge #1
Challenge #1
Redesign a menu type selection.
19 hard-coded options to contextual flow.
Redesign a menu type selection.
19 hard-coded options to contextual flow.
Redesign a menu type selection.
19 hard-coded options to contextual flow.
Concept decision
Concept decision
Concept decision
I've landed on a hybrid solution between concepts #1 and #4. Combining the convenience of progressive menu selection, but keeping submenu options in the same left column.
I've landed on a hybrid solution between concepts #1 and #4. Combining the convenience of progressive menu selection, but keeping submenu options in the same left column.
I've landed on a hybrid solution between concepts #1 and #4. Combining the convenience of progressive menu selection, but keeping submenu options in the same left column.
Design Flow
Design Flow
Design Flow
Challenge #2
Challenge #2
Challenge #2
Redesign an order flow, keep the logic:
1 entry meal + 2 side dish selections.
Redesign an order flow, keep the logic:
1 entry meal + 2 side dish selections.
Redesign an order flow, keep the logic:
1 entry meal + 2 side dish selections.
Concept decision
Concept decision
Concept decision
I chose concept #1 because switching the tabs between entry meals and side dishes can feel disruptive.
I chose concept #1 because switching the tabs between entry meals and side dishes can feel disruptive.
I chose concept #1 because switching the tabs between entry meals and side dishes can feel disruptive.
Design Flow
Design Flow
Design Flow
Before/After the Redesign
Before/After the Redesign
Before/After the Redesign
Number of meals
Number of meals
Number of meals
Before
Before
Before
After
After
After
Meal selection
Meal selection
Meal selection
Before
Before
Before
After
After
After
Add addons
Add addons
Add addons
Before
Before
Before
After
After
After
Review order
Review order
Review order
Before
Before
Before
After
After
After
Checkout
Checkout
Checkout
Before
Before
Before
After
After
After
Other Design Details
Other Design Details
Other Design Details
New features
New features
New features
Unifying design library
Unifying design library
Unifying design library
Unifying design library
Usability testing insights
Usability testing insights
Usability testing insights
Usability testing insight #1
Usability testing insight #1
A/B testing on mobile navigation
Variant A
Variant A
Variant A
Variant B
Variant B
Variant B
Context
Context
Context
I wasn't sure about mobile navigation patterns, choosing between bottom breadcrumbs and contextual accordions.
I wasn't sure about mobile navigation patterns, choosing between bottom breadcrumbs and contextual accordions.
I wasn't sure about mobile navigation patterns, choosing between bottom breadcrumbs and contextual accordions.
Solution
Solution
Solution
I threw an unmoderated prototype testing on 2 different groups of users.
Results
Results
Results
Behavioral data shows that more users succeeded completed the flow using accordions (Variant A).
Usability testing insight #2
Usability testing insight #2
Review meals before checkout
Review meals before checkout
Review meals before checkout
Review meals before checkout
Before
Before
Before
After
After
After
Context
Context
Context
Heatmap data suggested that when users were asked to go back and edit their selection on mobile devices, his led to 40% errors.
The start over button sounds ambiguous.
Heatmap data suggested that when users were asked to go back and edit their selection on mobile devices, his led to 40% errors.
The start over button sounds ambiguous.
Heatmap data suggested that when users were asked to go back and edit their selection on mobile devices, his led to 40% errors.
The start over button sounds ambiguous.
Solution
Solution
Solution
Actions reprioritized to fit mobile context. "Start over" button is removed from the flow.
One primary action and two secondary actions for meals editing or duplication.
Actions reprioritized to fit mobile context. "Start over" button is removed from the flow.
One primary action and two secondary actions for meals editing or duplication.
Actions reprioritized to fit mobile context. "Start over" button is removed from the flow.
One primary action and two secondary actions for meals editing or duplication.
Actions reprioritized to fit mobile context. "Start over" button is removed from the flow.
One primary action and two secondary actions for meals editing or duplication.
Usability testing insight #3
Usability testing insight #3
Duplication flow
Duplication flow
Duplication flow
Duplication flow
Before
Before
Before
After
After
After
Context
Context
Context
Users were confused why they have to select the menu items again.
I’ve also noticed that people ignored the ‘back’ arrow on the header.
Users were confused why they have to select the menu items again.
I’ve also noticed that people ignored the ‘back’ arrow on the header.
Users were confused why they have to select the menu items again.
I’ve also noticed that people ignored the ‘back’ arrow on the header.
Solution
Solution
Solution
The whole selection is duplicated by default with an option to customize it.
Buttons replaced with checkboxes to ensure action affordability.
Cancel duplication flow button added to the sticky footer.
The whole selection is duplicated by default with an option to customize it.
Buttons replaced with checkboxes to ensure action affordability.
Cancel duplication flow button added to the sticky footer.
The whole selection is duplicated by default with an option to customize it.
Buttons replaced with checkboxes to ensure action affordability.
Cancel duplication flow button added to the sticky footer.
Takeaways
Takeaways
✅
Minor UX tweaks → major wins
Small changes led to clearer flows and
higher engagement.
Minor UX tweaks → major wins
Small changes led to clearer flows and
higher engagement.
Minor UX tweaks → major wins
Small changes led to clearer flows and
higher engagement.
✅
Early design system saved dev time
Prevented UI rework and enabled faster,
more consistent delivery.
Early design system saved dev time
Prevented UI rework and enabled faster,
more consistent delivery.
Early design system saved dev time
Prevented UI rework and enabled faster,
more consistent delivery.
✅
Validated early, built smarter
Testing concepts early helped avoid wasted effort and focus on real needs.
Validated early, built smarter
Testing concepts early helped avoid wasted effort and focus on real needs.
Validated early, built smarter
Testing concepts early helped avoid wasted effort and focus on real needs.
✅
Key features trimmed pre-MVP
Collaboration with engineering avoided
costly overbuild.
Key features trimmed pre-MVP
Collaboration with engineering avoided
costly overbuild.
Key features trimmed pre-MVP
Collaboration with engineering avoided
costly overbuild.