Phil

Personalized Type 2 Diabetes Companion

Phil is a mobile app developed for Roche Pharmaceuticals in France that helps people with Type 2 diabetes manage daily life through personalized recipes, meal planning, grocery integration, product scanning, activity tracking, blood glucose monitoring and health reporting. It has since become the leading Type 2 diabetes app in the French market.

I lead UI and UX design across the entire experience, from onboarding and recipe flows to the scanner, glucose tracking, Diabetes Journal and report export. Working closely with Roche product managers, clinicians, and engineers, I translated complex health requirements into a clear, patient-friendly design system.

Design Approach

Research & Insights
Through interviews with patients, dietitians and healthcare providers, we uncovered consistent themes: people wanted a tool that was easy to understand, trustworthy in tone and able to guide them through the small decisions of daily life.

Design Principles
From those findings we shaped four principles that guided every decision: make the experience accessible, keep interactions simple, ensure clinical alignment and design in a way that empowers rather than overwhelms.

Process
I mapped flows, built and tested prototypes directly with patients, and iterated toward a modular design system that could flex across nutrition, activity and health tracking while remaining cohesive and easy to use.

Key Design Decisions

Personalized Onboarding

Onboarding was designed to feel simple and supportive. A card-based flow with conversational copy replaced long forms, using progress indicators to guide users and reduce friction. The tone stayed empathetic and avoided medical jargon while collecting only key details like goals, dietary needs and allergies. This approach helped users reach a personalized feed in under two minutes.

Recipes & Meal Planning

The recipe library uses a modular system where ingredients, portions, and nutrition values adapt to each user’s health profile. Nutritional scoring is built into every card, paired with clear typography and photography for quick assessment. Filters remain visible at the top of the screen for fast refinement by meal type, prep time, skill-set or cost.

Meals are added to a weekly or monthly planner with a single tap. Scheduled meals appear in context while empty slots prompt completion. From the planner, a shopping list generates automatically and groups items by store category. Integration with Intermarché connects the list directly to a digital basket for easy ordering.

play-rounded-fill
play-rounded-fill

Glucose Tracking & Journal

Glucose tracking is designed as one of the most sensitive and seamless parts of the experience. Pairing with Roche Accu-Chek devices uses large illustrations and clear step-by-step guidance for Bluetooth setup. Manual entry features a high-contrast keypad with large touch targets to support accessibility.

Meals, activity, and glucose data appear together in a single scrolling timeline rather than in separate tabs, allowing users to recognize patterns instantly. Reports export as PDFs with two clear views: a color-coded summary for patients and detailed numeric logs for clinicians. This structure keeps the interface friendly while maintaining the precision required for medical use.

Activity Tracking

To encourage daily movement, a lightweight pedometer was integrated. Instead of dense charts, the UI used simple progress rings and micro-interactions (glow effects, small bursts of animation) when goals were met. The intent was motivational without being overwhelming, particularly for older users.

Companion Art & Iterations

A visual companion was designed for Phil to make the experience warmer and less clinical. Early iterations explored abstract icons, character-like figures, and minimal illustration styles. The art was used in onboarding, empty states, and reports, giving guidance and personality without distracting from core tasks.

Impact

Phil unified recipes, shopping, activity, and glucose tracking into one consistent experience. By designing modular recipes that adapted to individual health profiles, a simple nutrition score at the shelf and a journal that connected daily choices to glucose data, we made complex management feel straightforward. The result was an app that patients could use with confidence and clinicians could trust, strengthening Roche’s digital health offering and creating a foundation for future growth.

”What sets Scott apart is his deep expertise in UI design. He is one of the most talented UI designers I’ve ever worked with, and this dual strength—product leadership combined with design excellence—makes him uniquely effective in his role. At Innit, Scott was instrumental in defining product strategy and leading UI design for critical, high-visibility projects, including those for Roche and HEB. In addition, Scott mentored and guided UI designers on the team, helping them grow in their careers and perform at a high level.

Vikram NatarajanDirector/Head of PMO at Innit