Project Proposal

MyFoodDoctor Web Application Development

A new web application that mirrors the core MyFoodDoctor mobile experience, rebuilt for the browser. The mobile app keeps running exactly as it does today — this is an additional platform, not a replacement — with one key change: subscription billing on web moves from mobile app-store purchases to Stripe.

ProductMyFoodDoctor (MFD)
DeliverableWeb Application
MarketDACH (DE/AT/CH)
Mobile AppStays Live, Unchanged

Overview

MyFoodDoctor already exists as a mobile app offering food diary tracking, personalized nutrition methods, e-learning courses, a food lexicon, and psychological eating assessments. This proposal covers bringing that same experience to the web — same features, same personalization engine, new platform. The web app will share the backend and data model already powering mobile, so user accounts, diary history, and progress carry over seamlessly regardless of which platform a user opens.

Importantly, this is additive: the mobile app is not being retired, rebuilt, or paused. It continues to serve existing users and app-store subscribers without interruption. The web app is a second front door into the same product — useful for users who prefer a browser, for corporate/insurance partners who want a link-based experience, and for prospective users evaluating MFD before installing anything. Both clients will call the same backend, so feature parity is maintained by design rather than by manual syncing.

Scope — What Moves to Web

All core sections of the mobile app, rebuilt as responsive web experiences.

📔 Food Diary

Daily logging, meal categories, macros, water & exercise tracking, diary export.

🍽️ Logging Methods

Search, barcode lookup, AI photo analysis, favorites & custom meals. Voice input scoped as optional (browser mic support varies).

🎯 Optimization Methods

Personalized recommendations, activation & adherence tracking, progress view.

📚 Courses & Certificates

Chapter-based e-learning, quizzes, celebration screen, PDF certificate export.

🔍 Lexicon & Recipes

Searchable food encyclopedia with recipe discovery and filtering.

🧠 Psychogram

Eating-behavior questionnaire that feeds personalization, ported as-is.

📊 Weight Tracking

Weight & waist logging with trend charts.

👤 Profile & Anamnesis

Health intake form, profile management, insurance details.

⚙️ Account & Settings

Password, legal pages, GDPR-compliant account deletion.

Key Modification

Billing: In-App Purchase → Stripe Subscription

Mobile (today)
Google Play / App Store billing
Web (proposed)
Stripe Checkout & Billing

App-store billing only works inside native apps, so the web app needs its own payment path. Stripe replaces it for the web subscription tier, while the ZPP one-time preventive purchase and coupon system carry over conceptually to Stripe Checkout as well.

  • Stripe Checkout for both the recurring subscription plan and the one-time ZPP preventive purchase
  • Stripe Customer Portal for users to manage or cancel their own subscription
  • Webhooks to sync payment status back to the same access-control logic already used on mobile (subscription vs. preventive vs. locked)
  • Existing coupon/voucher codes re-implemented as Stripe promotion codes
  • Web accounts are billed independently of mobile store purchases — a user who subscribes on web won't automatically show as subscribed in the mobile store ledger, so entitlement will be checked against our own backend, not the device platform

Approach

Four phases, building outward from the shared backend so the web app stays in sync with mobile at every stage rather than diverging and needing to be reconciled later.

01

Foundation

Set up the Next.js project, design system, and routing. Build authentication (login, registration, password reset) against the existing MFD backend. Stand up the API integration layer so mobile and web read/write the same user, diary, and profile data. Includes environment setup, CI/CD, and a deployable staging build.

02

Core Features

Build the Food Diary, the logging methods (search, barcode, AI photo analysis, favorites, custom meals), the Lexicon and Recipes browser, weight/measurement tracking, and the profile & anamnesis flow. This is the largest phase since it covers the day-to-day features users touch most.

03

Personalization & Learning

Implement the optimization Methods tab (evaluation flow, activation, target questions, progress view), the Psychogram questionnaire and result screen, and the full course engine — chapters, quizzes, chapter unlocking, celebration screen, and PDF certificate generation.

04

Billing & Launch

Integrate Stripe Checkout, Customer Portal, and webhooks for both the subscription and ZPP one-time purchase; migrate coupon codes to Stripe promotion codes; run cross-browser and access-control QA; then a staged/soft launch before general availability.

Suggested Stack

Next.js is the frontend framework of choice — it gives us server-rendered pages for fast first loads and good SEO on public/marketing-facing pages (useful for insurance and corporate landing pages), while still behaving like a standard React app for the logged-in product experience.

Next.js (React) Existing MFD backend & APIs Stripe Billing + Webhooks Responsive, mobile-web friendly UI PDF export (certificates, diary) Shared auth session across mobile & web

A Few Notes

Things worth flagging up front while scoping this out.

Mobile keeps running

No downtime, no re-release, no forced migration for existing mobile users. Web is launched as a parallel option.

One backend, two clients

Diary entries, weight logs, and course progress made on web appear on mobile and vice versa, since both read the same account.

Faster iteration on web

Web updates ship instantly without app-store review, which is useful once the Stripe flow is live and needs quick fixes.

Voice input scoped as optional

Browser microphone support is inconsistent across devices, so this logging method is nice-to-have rather than v1-critical.

Insurance & corporate links

A browser-based flow makes it easier to send ZPP or corporate-wellness signup links that don't require an app install first.

Entitlement source of truth

Access checks move to our backend rather than the device app store, so the same logic works no matter where a user paid.

Rough Timeline

Estimated at roughly 7 weeks end to end, run largely sequentially with some overlap possible between phases 02 and 03 once the API layer is stable.

PhaseFocusEstimate
01 · FoundationNext.js setup, design system, auth, backend/API wiring, staging environment1 weeks
02 · Core FeaturesDiary, all 6 logging methods, lexicon, recipes, profile, weight tracking2 weeks
03 · PersonalizationMethods engine, evaluation flow, psychogram, courses, quizzes, certificates2 weeks
04 · Billing & LaunchStripe Checkout/Portal/webhooks, QA, staged rollout2 weeks
Total7 weeks