Cooksy
From saved recipes to ready to shop grocery lists.
A mobile experience designed to reduce friction in meal planning, ingredient review, and grocery prep.
Role: UX/UI Designer - End to end project
Saving recipes is easy. Acting on them isn’t.
Home cooks can easily save recipes online, but turning them into grocery ready ingredient lists is still manual and time consuming.
Design Focus: Create a clear, low friction path that helps users move from saving a recipe to a grocery ready ingredient list.
Problem
A focused flow that turns saved recipes into grocery ready lists.
Cooksy brings recipe capture, ingredient review, and meal scheduling into a single, guided experience. Instead of manually copying ingredients between apps, users can confirm what they need and send a grocery ready list directly to their preferred store for pickup or delivery.
Key Design Decisions include:
Guided ingredient review to reduce manual effort and missed items
Clear primary actions that help users move forward with confidence
Seamless handoff to grocery pickup or delivery, connecting planning to action
Solution
Design Approach
Designing for momentum, not more features.
Rather than building a feature heavy planning tool, I focused on reducing friction at the moments where users typically stall, reviewing ingredients, scheduling meals, and knowing what to do next.
The Product Evolved Through:
Research to identify breakdowns between saving recipes and planning meals
Flow and hierarchy decisions that emphasized clear primary actions
High-fidelity prototyping to test real task completion
Iteration based on hesitation points observed during usability testing
Primary user flow from recipe upload to grocery order.
Exploring Structure Before Polish
Prioritizing clarity and hierarchy before visual refinement.
With the core flow defined, I focused on structuring key screens to support decision making without relying on visual polish. Mid-fidelity wireframes allowed me to test layout, hierarchy, and primary actions early, ensuring users always knew what to do next.
Mid-fidelity wireframes used to explore hierarchy and primary actions during ingredient review.
Refining the Experience Through Testing
Reducing hesitation by clarifying the next step.
During usability testing, users hesitated when reviewing ingredients and deciding what to do next. Multiple actions competed for attention, making progression feel uncertain.
Based on these observations, I refined the layout and hierarchy to clarify the primary action, reduce competing options, and guide users forward with more confidence.
Before : Competing actions and unclear progression during ingredient review
After : Clear primary action guiding users toward the next step
Reducing hesitation by guiding users through clear, step by step decisions
Usability testing showed that users completed key tasks with noticeably less hesitation after iteration, particularly during ingredient review and meal scheduling. As navigation, labeling, and primary actions were refined, participants relied less on trial and error and moved forward with more confidence.
Participants consistently described the experience as “clear,” “easy to follow,” and “less overwhelming,” with the interface guiding them through each step. By reducing ambiguity at key moments, the final design helped users move smoothly from planning to action.
Outcome and Learnings