Medically Tailored Meals.

Designer
Tayyab Malik
Services
UX Strategy, UI/UX Design,
Web Design
Type
Website Case Study

A landing page for a medically tailored meal service, designed to simplify complex dietary information, build trust and guide people with specific health needs towards confident action.

Medically Tailored Meals landing page cover
01 — Overview

Project overview.

A landing page for LifeSpring Home Nutrition, a medically tailored meal (MTM) service. The job was to take complex dietary and health information and turn it into a page people can understand, trust and act on.

ProjectDetail
RoleUI/UX Designer (end to end)
ClientLifeSpring Home Nutrition
ServicesUX Strategy, UI/UX Design, Web Design
PlatformResponsive marketing website / landing page
ToolsFigma, Adobe Photoshop, Adobe Illustrator
PublishedNovember 2023
Clarity builds trust, and trust converts.
02 — Problem

The problem.

People looking for medically tailored meals are often managing a health condition, or caring for someone who is. Online, they meet unclear messaging, too much information and little reason to trust a health-related service.

  • Unclear audience. Many platforms never say plainly who the service is for, so visitors can’t tell if it fits their needs.
  • Hidden process. How ordering, delivery and dietary matching work is buried or never explained.
  • Weak trust. Health and food claims arrive without credentials, partners or real faces behind them.
  • Overload. Dense dietary detail adds cognitive load, and visitors hesitate and drop off before converting.

How might we explain a medical meal service so clearly that someone with specific dietary needs feels confident taking the next step?

03 — Goals

Goals and success criteria.

The landing page had one job: help the right visitor understand the service, believe in it and act, without wading through medical jargon.

GoalIn the designSuccess looks like
Communicate the valueHero with a clear value proposition and primary CTA above the foldVisitors can say what the service is in seconds
Show who it’s forCondition categories: Heart Conscious, Diabetic, Lower Sodium, Renal and moreUsers find their own dietary need on the first screen
Explain the processStep-by-step “LifeSpring Delivered Meals” sectionNo guessing about how meals reach the door
Build trustHealth-plan partner logos, expertise section, warm real-life imageryThe service feels credible and safe
Reduce frictionShort “Ask Our Dietician” form and repeated CTAsA clear next step wherever the user stops scrolling
04 — Audience

Who we designed for.

AudienceWhat they needWhat the page must show
People with specific dietary or medical needsMeals that fit a condition such as diabetes, kidney or heart healthTheir condition, named and easy to find
Health-conscious usersStructured meal plans they don’t have to work out themselvesQuality and ingredient standards, and meal options
Busy professionalsConvenient, healthy food delivered without effortHow delivery works, and a quick way to start

The three audience groups share one need: certainty that the meals are right for them before they commit.

05 — Approach

Design approach.

The answer to confusion was clarity, hierarchy and a guided flow down the page.

  • Simplified the hero to one clear value proposition and one primary action.
  • Broke dense information into structured, scannable sections.
  • Used strong visual hierarchy (type scale, spacing and contrast) for readability.
  • Placed CTAs strategically and repeated them down the page.
  • Kept the UI clean and minimal to lower cognitive load for an audience that includes older adults.
06 — Structure

Information architecture and flow.

The page is a single guided story: what it is, who it’s for, how it works, why to trust it, and what to do next.

OrientationNavigation: Home, Menu, How It Works, About, FAQs, ContactHeroHero: “Unparalleled Quality & Ingredient Standards” + CTAMeal plansCondition categories: Heart, Diabetic, Lower Sodium, Renal…How it worksLifeSpring Delivered Meals: numbered, step-by-step pointsTrustHealth-plan partners: recognisable provider logosCall to actionAsk Our Dietician: short form + “Let’s Start” buttonTrustExperience & Expertise You Can Rely OnStay connectedFooter: newsletter, social links, Instagram

Primary user flows

  • Find my diet: Hero → condition categories → pick a category (e.g. Diabetic) → view matching meals.
  • Understand the service: Hero → LifeSpring Delivered Meals → how MTM and plant-based meals are delivered.
  • Get expert advice: Scroll to Ask Our Dietician → fill the short form → Let’s Start.
  • Check credibility: Partner logos → Experience & Expertise → footer contact and newsletter.
07 — Decisions

Key design decisions.

DecisionIn the designWhy
Clear value propositionHero headline about quality and ingredient standards, with seniors and a primary CTAPurpose is understood immediately
Visual hierarchyLarge green headings, generous spacing, short supporting copyGuides attention down the page in order
CTA placementPrimary CTA above the fold, repeated in the dietician form and later sectionsA next step is always in reach
Content simplificationConditions as an icon grid; process as numbered pointsComplex dietary info becomes digestible
Trust buildingPartner logos, expertise section, real-life imagery and a persistent “Need Help?” tabLowers hesitation for a health-related purchase
08 — Visual design

Visual design and style guide.

The visual language aims for fresh, calm and trustworthy: a healthy green, a warm accent and plenty of white space.

ElementDecisionWhy
Primary colourGreen #448430Health, freshness and nutrition; carries headings and CTAs
Accent colourRose #DA5365Warmth and care; used in the heart motif
NeutralsLight grey #E6E6E6, charcoal #383837Soft section backgrounds and highly readable body text
TypographyLato and DM SansClean, friendly and legible at every size
IconographySimple coloured icons per health conditionUsers recognise their need without reading
ImageryReal seniors and real mealsMakes the service human and relatable
Typography: Lato and DM Sans
Typography: Lato and DM Sans.
09 — Final UI

Final landing page.

Colour palette and landing page hero, condition categories and delivered meals
Colour palette, hero, condition categories and LifeSpring Delivered Meals.
Landing page partners, Ask Our Dietician form, expertise section and footer
Partner logos, Ask Our Dietician, Experience & Expertise and footer.
SectionWhat the user gets
NavigationHome, Menu, How It Works, About, FAQs, Blog and Contact, plus a language switch
HeroA clear promise on quality and ingredient standards, with a primary CTA
Condition categoriesHeart Conscious, Diabetic, Lower Sodium, Vegetarian, Renal, Eyes, Bones and All Meals as icon tiles
Delivered MealsHealthy MTM and plant-based meals at affordable costs, explained step by step
PartnersRecognisable health-plan and provider logos
Ask Our DieticianA short form with a single “Let’s Start” action
FooterNewsletter sign-up, social links and an Instagram grid
10 — Outcome

Outcomes and learnings.

The redesign turns a complex health service into a simple, guided experience: a clearer offer, less confusion and a page built around trust and action.

Design outcomes

  • Improved clarity of the service offering.
  • Reduced confusion through a structured layout.
  • Designed for conversion with strong, repeated CTA placement.
  • Stronger trust through a clean, professional look.

Learnings

  • In health services, trust has to be designed, not assumed: partners, faces and credentials do real work.
  • Let users find themselves first: naming their condition beats describing the product.
  • Every section should end with a clear next step.

Next steps

  • Usability testing with people managing dietary conditions
  • Accessibility audit for older users: contrast, type size and tap targets
  • Meal browsing and ordering flow
  • Mobile-first refinement of the condition grid and form
  • A/B testing of hero messaging and CTA copy