Kicking Off The Project

When JoyHealth approached us, they weren’t just looking for a new coat of paint. They wanted a website that felt credible, trustworthy, and deeply empathetic to diabetic users, while still bringing an upbeat, modern tone to the brand.

So like any solid relationship, we started by listening.

From the very first message, we made it clear: we weren’t here to just push pixels. We were here to define the story, set the structure, and give every visual decision a strong foundation.

Moodboarding with the Team

Our first step was visual alignment. We curated an extensive moodboard with inspirations from modern healthcare brands, wellness startups, and app-focused websites, carefully split into sub-flows around UI layouts, colors, imagery styles, and typographic approaches.

We then asked the JoyHealth team to leave comments on anything that resonated with them:

• What feels credible to you?

• What looks too generic?

• What has the vibe you imagine JoyHealth carrying?

This wasn’t about design preferences alone. It was about finding the emotional tone for the entire website. One that said: "We’re medical, but warm. We’re backed by science, but built for real people."

Their inputs helped us eliminate overly sterile design directions and instead go for a look that felt:

• Optimistic, not clinical.

• Confident, not overwhelming.

• App-like, not too corporate.

Laying Down the Structure - IA

While the moodboard set the tone, our Information Architecture (IA) gave structure to the storytelling.

We shared a detailed IA strategy with the team via a Google Doc, outlining each homepage section and the role it plays in the user journey. From explaining the product to addressing doubts and leading them to action.

Key ideas we anchored on:

• Medical Credibility had to be front and center. We backed up JoyHealth’s claims with real studies, charts, and success metrics.

• We planned for three pages: the homepage, a "How It Works" page, and a Resources page.

• Since most visitors wouldn’t go past the homepage, we made sure it packed everything: storytelling, proof, empathy, and CTA.

We even tiered social proof into P0 and P1 categories, identifying what would build maximum trust (like research publications, video testimonials) versus what’s supplementary (text reviews, PR logos).

Collaborating Live

As the IA and moodboarding were taking shape, we hopped on a call with Dhruv to discuss the visual direction and finalize alignment.

This phase set the foundation for everything to come. We now have a shared vocabulary with JoyHealth. A tone they loved, a structure that made sense, and clarity on what we were building.

Next up? Hero Section Iterations.

Designing the Face of JoyHealth

Once the IA and moodboard directions were locked in, it was time to design the part of the website that matters the most: the hero section. That first scroll-stopping moment where a user either thinks “this is for me” or clicks away.

We knew we had one job here: explain JoyHealth’s promise in 5 seconds flat, while still making it feel human and hopeful.

Hero Section Iterations

We didn’t jump into finalizing a single hero. Instead, we created multiple hero section variations — experimenting with layout, image treatments, CTA placements, and copy styles.

The client saw two final directions and left comments directly on Figma. One featured a clean, blue-focused palette with an Indian man enjoying sweets — subtly highlighting Joy’s key differentiator: eat what you love, even with diabetes.

While some visual directions leaned too medical or too playful, we eventually aligned on a warm-yet-trustworthy look — approachable, Indian-centric, and confident.

Messaging

While visuals were in motion, we worked simultaneously on copywriting the homepage. Our internal research made one thing clear — the market was filled with generic “reversal programs” that weren’t working for real people.

Joy wasn’t just another app. It was:

• Science-backed by India’s biggest diabetes study.

• Culturally relevant, showing familiar food items we actually crave.

• Supportive, with real-time insights, not prescriptive rules.

So we rewrote the homepage to reflect that:

• “Don’t let diabetes control your little joys” became the north star headline.

• CTAs were direct — “Download Free,” not “Learn More.”

• Every section carried emotional stakes: food choices, social proof, personalization, empathy.

Homepage Iterations

Designing JoyHealth’s homepage wasn’t just about layout. It was about guiding the user through a story. Each section had a distinct purpose, building trust, evoking empathy, and moving the visitor closer to action.

Here’s how we structured it:

Explaining the Features Like a Journey

When it came to showcasing product features, we avoided the usual wall of icons. Instead, we explained the experience like a guided journey. Starting with an onboarding questionnaire, followed by food predictions, real-time AI chat support, and personalized glucose curves.

This structure mirrored the user’s mental model and helped them visualize what it’s like to use JoyHealth daily like a GPS for their condition.

Indian Comfort Foods, Reimagined with Health Tips

Immediately after the “Features Section”, we introduced a high-engagement section called “What do you love eating?”. Instead of generic features, we showed familiar Indian dishes like masala dosa and chhole bhature.

But rather than labeling them as “bad,” we offered realistic alternatives or mitigation strategies, like replacing maida with atta or pairing meals with chia water. This transformed guilt into empowerment, an approach rarely seen in medical apps.

Differentiating with Medical Credibility

To differentiate JoyHealth from the noise in the diabetes app market, we prioritized medical credibility. We showcased that JoyHealth’s guidance was grounded in India’s largest diabetic phenotype study.

We added graphs, stats, and summaries of medical validation, making it clear that this wasn’t a fad product but a data-backed health companion. The section quietly built authority without overwhelming users.

User Testimonials

Social proof is essential, but authenticity matters even more. Since we couldn’t get real user photos, we opted for named testimonials in the first person. We focused on tone, making sure the copy didn’t sound scripted or exaggerated.

By using full names, professions, and realistic outcomes, we preserved trust and relatability, even without headshots.

Transparent Pricing and a CTA That Reinforces Trust

We wrapped the homepage with a simple pricing section and a final CTA that tied back to the opening emotion: freedom without compromise.

There were no hidden conditions or confusing plans, just clarity on what the user gets and a gentle nudge to begin. It felt less like a sales pitch and more like an invitation to start feeling better.

Supporting Pages

After finalizing the homepage, our next step was to ensure the supporting pages carried the same clarity, empathy, and credibility. These pages weren’t just additional screens; they were extensions of the brand’s story. 

It gives users deeper insight into how JoyHealth works, why it’s trustworthy, and how it supports them beyond just onboarding.

Designing a Clear, Visual “How It Works” Page

The “How It Works” page walked users through the JoyHealth experience in simple, visual steps. We showcased how the app identifies your phenotype, predicts sugar spikes, and offers real-time support.

A key highlight was a visual glucose behavior curve designed to simplify complex health data. The language remained friendly and direct, with a layout that guided users through what to expect after signup.

This wasn’t a tech spec sheet. It was a gentle, reassuring walkthrough that complemented the emotional appeal of the homepage and gave users confidence in the science behind the product.

Blog Section

To position JoyHealth as more than just an app, we built a blog section that offered real value. The blog listing page was clean, responsive, and optimized for mobile. We used consistent formatting across all articles to make reading easy and intuitive.

Content focused on food, health, lifestyle tips, and product insights written in a way that was medically informed but user-friendly. This section helped expand JoyHealth’s credibility, support SEO efforts, and create touchpoints for returning users.

It wasn’t just content for the sake of it. It was content that built connection and trust over time.

Keeping Design Future-Proof and Flexible

As JoyHealth refined their backend models and graphs, we ensured the website could keep pace. We built the “How It Works” layout to be modular, allowing graphs and key visuals to be swapped without design breaks.

This adaptability meant the site could evolve with their science, without needing a redesign. From development to content updates, we thought ahead. The collaboration between product and design teams allowed for flexibility while keeping user experience intact.

Supporting pages didn’t just look good at launch. They were designed to stay relevant and credible as the product matured and data evolved.

Conclusion

We transformed JoyHealth’s vision into a relatable, credible, and conversion-friendly website. One that speaks to users like real people and drives real engagement.