VMeals

VMeals

A subscription based healthy meal plan product focused on clearer customer journeys, stronger conversion, and a more scalable experience across both customer and internal workflows.

A subscription based healthy meal plan product focused on clearer customer journeys, stronger conversion, and a more scalable experience across both customer and internal workflows.

Region

Region

Dubai

Dubai

Year

Year

2020 - Now

2020 - Now

The project itself :

Project Overview

VMeals is a subscription based healthy meal plan platform designed to help users discover, customise, and subscribe to plans that fit their goals, preferences, and lifestyle. It supports key customer journeys such as onboarding, plan selection, and checkout, while also powering internal workflows behind the scenes.

Problem:

The meal plan journey involved multiple decisions and too many points of friction. Users needed clearer guidance when selecting plans, customising options, and completing checkout, while the business needed a stronger foundation for conversion and long term scalability.

Goal:

Design a meal plan experience that feels clear, trustworthy, and easy to complete by improving onboarding, plan selection, checkout, and overall journey structure.

My role:

I led product design across key customer journeys and handled full stack development across important parts of the platform.

Responsibilities:
  • UX strategy

  • User flow

  • Interface design

  • Design System

  • Frontend development

  • Analytics informed iteration

Understanding the journey :

User Research

To improve the experience, I analysed how users moved through the meal plan journey and where confusion, hesitation, or drop off appeared. The clearest friction points showed up around plan discovery, customisation, and checkout clarity.

Pain Points

Plan discovery:

Users needed a clearer way to compare plans and understand which option best matched their goals and lifestyle.

Plan setup:

Shaping a meal plan around individual needs could feel unclear without enough structure and guidance.

Checkout clarity:

The subscription process needed to feel simpler, more trustworthy, and easier to complete without hesitation.

User Considerations

The experience was shaped around common user needs across the meal plan journey, especially around plan discovery, decision making, customisation, and checkout clarity. Rather than focusing on a single persona, the goal was to reduce friction across the broader customer journey and support clearer choices at each step.

Choosing the
right plan

Users need clearer guidance when comparing plans based on goals, preferences, and lifestyle.

Understanding
options quickly

Users need clearer guidance when comparing plans based on goals, preferences, and lifestyle.

Customising
with confidence

Users should feel supported when tailoring plans around their needs, not overwhelmed by choices.

Checking out
without hesistation

The subscription flow should feel simple, trustworthy and easy to complete from start to finish

Journey Mapping

I mapped the key stages of the meal plan journey to identify friction points, moments of hesitation, and opportunities to improve clarity. This helped structure the experience across plan selection, setup, checkout, and the post purchase journey.

Goal

Help users choose the right meal plan, customise it around their needs, and complete the subscription journey with confidence.

nice interior

The project schematically :

Starting the Design

I translated the key friction points into clearer journey flows and interface directions. The process focused on simplifying decision making, improving structure, and shaping a more scalable experience before moving into higher fidelity design.

Journey Flows

Early flows were used to map how users moved through plan discovery, setup, and checkout. This helped define the core structure of the experience and identify where clarity, guidance, and simplification were most needed.

I started by mapping the most important parts of the customer journey to understand where users needed support and where the experience could be simplified. These early explorations helped shape a clearer path from choosing a plan to completing the subscription flow.

nice interior

A broader view of the meal plan experience, showing how users move from discovery to subscription across the key stages of the product.

nice interior

A closer look at the plan selection and checkout journey, used to clarify decision points and reduce friction before moving into interface design.

Appmap

A structured map of the core product flow, used to organise pages, decision points, and content hierarchy across the meal plan journey.

The next step was defining a clearer application map. My goal was to create a structure that simplified navigation, supported better decision making, and made the overall journey easier to understand. The final map was built to connect plan discovery, customisation, checkout, and account related actions in a more intuitive way.

nice interior

Paper Wireframes

Early wireframes focused on the basic structure of the meal plan journey and the intended function of each section before moving into more refined layouts.

I explored multiple low fidelity wireframe directions to test how the experience could be structured more clearly. The aim was to simplify plan discovery, guide decision making, and create a stronger foundation before moving into higher fidelity design.

nice interior

Digital Wireframes

A clearer, more structured version of the journey translated into digital form. This stage brought together the key pages, interactions, and decision points across the meal plan experience.

At this stage I translated the journey into digital wireframes to define how each page connected and how the full experience would work as a system. The goal was to make plan discovery, customisation, checkout, and supporting pages feel structured, connected, and easier to refine before moving into higher fidelity design.

nice interior

Usability Studies

A review of how users interacted with the builder flow, used to identify friction, hesitation, and opportunities to improve the experience before final refinement.

I reviewed the early builder experience to understand where users needed more clarity and where the journey felt less intuitive. The goal was to identify friction across plan setup, decision making, and checkout related steps so the flow could be improved before final delivery.

Plan clarity:

Users needed a clearer understanding of how plan options, calories, and meal types worked together before moving forward.

Step guidance:

The builder needed stronger structure so users could move through each step with more confidence and less hesitation.

Review confidence:

Before reaching the final summary, users needed to feel sure that their selections, delivery details, and payment choices were complete and correct.

The clear version :

Refining Design

On this step, first I created a static, high-fidelity Voo's app design (keeping in mind all the conclusions from the previous phase of usability studies) that is a clear representation of a final product called design mockups.
After that, I created a high-fidelity prototype of the app.

Mockups

High fidelity interface explorations showing how the final product experience came together across the key builder and checkout related screens.

I translated the final flow into polished interface mockups that brought together layout, hierarchy, typography, and interaction clarity. The goal was to show how the product would feel in its final form and ensure the experience remained consistent across the key customer journey.

High-fidelity prototype

An interactive prototype used to test how the final builder and checkout experience would behave before development.

I turned the final mockups into a clickable prototype to validate flow, interaction behaviour, and overall usability. The goal was to test how users moved through the builder, confirm that the journey felt clear from step to step, and refine the experience before implementation.

Voo's High-fidelyty prototype
  1. Diet page and builder entry

  2. Portion and calorie selection

  3. Plan duration and delivery days

  4. Personal details form

  5. Allergies and dislikes flow

  6. Delivery information form

  7. Order summary and payment flow

  8. End to end journey review

The final outcome:

Outcome

The project moved from early journey mapping and wireframes into a more structured builder experience that supported clearer decision making across the full subscription flow. By refining the journey step by step, the final outcome became easier to understand, easier to complete, and more scalable as a product experience.

57%

increase in qualified leads

3.4x

website revenue growth

43%

increase in monthly sales

Takeways

Designing this flow reinforced how important structure and guidance are in multi step experiences. Small decisions around hierarchy, step clarity, and interaction flow had a major impact on how confident and supported the user felt throughout the journey.

Impact:

The final builder created a clearer path from diet page to checkout, helping reduce friction across plan setup, personal details, delivery information, and order review. The experience felt more connected, easier to navigate, and better aligned with both user needs and business goals.

What I learned:

I learned that complex product flows work best when each step has a clear purpose and the user always understands what comes next. Strong UX in this kind of journey is less about adding more and more about reducing hesitation through structure and clarity.

Next Steps

The next phase would focus on validating the refined builder experience, identifying remaining friction points, and continuing to improve the journey through iteration.

Validate the refined builder flow through usability testing and identify remaining friction points.

Continue improving the experience through iteration, with a focus on clarity, performance, and conversion.

To get in touch :

Contact Me

Let’s build digital products that are clear, scalable, and made for real world use.

Click to copy :

mishkum.noor@gmail.com

To get in touch :

Contact Me

Let’s build digital products that are clear, scalable, and made for real world use.

Click to copy :

mishkum.noor@gmail.com

To get in touch :

Contact Me

Let’s build digital products that are clear, scalable, and made for real world use.

Click to copy :

mishkum.noor@gmail.com

To get in touch :

Contact Me

Let’s build digital products that are clear, scalable, and made for real world use.

Click to copy :

mishkum.noor@gmail.com