BuildOrbit
All Projects

Nutrition Scan PWA

Field teams photograph a meal and see the food, its portion and its typical pH range, without pretending a photo can measure pH.

An installable employee web app for a pharma field team. Employees sign in with their ID, photograph a meal, and AI identifies up to five foods and estimates portions. Typical pH values come from a source-linked catalogue of published measurements, and anything not in the catalogue is shown as a clearly labelled AI estimate. Every scan is kept in a personal history.

Client delivery. The product was designed and engineered as studio work for the team that owns it.

PharmaceuticalAI Nutrition PWAPrivate deploymentWebPWA

What the client can do now.

A pharma field team wanted to talk about how acidic everyday food is, using the meal in front of them. The app had to be quick enough for a conversation and honest about what a photo can and can’t tell you.

  • Scan from the field

    Employees sign in with their ID and use the camera or a saved photo.

  • Name the food and portion

    Vision AI identifies up to five foods and estimates each portion.

  • Use published values

    Matched foods take their typical pH from a source-linked catalogue.

  • Label every estimate

    Foods outside the catalogue show a model estimate, clearly marked as one.

  • Show a range, not false precision

    Results are ranges with their own source label, with no calculated meal pH.

  • Keep a history

    Every scan is saved with its sources, and older readings stay labelled as earlier estimates.

Scan a meal

Open the camera, or start from the atlas.

The home screen shows scan counts, the last reading and a pH atlas of common plates, so the conversation can start before the camera opens. The scan accepts the camera or a photo from the gallery, and photos are resized before they are stored.

  • Employee-ID sign-in, no password
  • pH atlas of common plates
  • Camera or photo picker
Scan a meal: an Open camera button above a list of common plates by acidity, from lemon water to milk
Recreated from the product, with sample data.

Identify

AI names the food and the portion. That’s all.

Vision AI identifies up to five foods in the photo and estimates each portion. It doesn’t decide the pH: the food name is matched against the catalogue on exact food and preparation, with broad substring matching switched off so a composite dish isn’t mistaken for one ingredient.

  • Up to five foods per photo
  • Portion estimate for each food
  • Exact matching, no loose substring guesses
Camera view holding over a bowl, with the result card Identified: Curd rice, about 1 bowl (250 g)
Recreated from the product, with sample data.

The reading

A typical range, with its source.

The meter shows the typical pH range for the food, using the midpoint only to position the needle, and a chemical band around pH 7 rather than any clinical risk threshold. A note under every result says the value is typical, not measured from the photo.

  • Source label on each food
  • Chemical bands, no clinical thresholds
  • Retryable error instead of a fabricated default
Curd rice result: a pH meter at 4.4, mildly acidic, typical range 4.3 to 4.6, and recent lookups
Recreated from the product, with sample data.
For the technical folksHow it’s builtThe full feature list and the tools behind it.
  • Employee-ID sign-in, installable as a PWA
  • Camera or photo-picker scanning
  • AI identification of up to five foods with portion estimates
  • Typical pH from a source-linked catalogue of published values
  • Clearly labelled AI estimates for foods outside the catalogue
  • Ranges, not a calculated meal pH
  • Photos resized and stored in S3
  • Personal scan history with earlier estimates labelled
Next.jsReactTypeScriptOpenAIMongoDBMongooseAWS S3PWA

Building something with this level of complexity?

If you're planning a ai nutrition pwa with real delivery constraints, we can help you scope it, make the technical calls early, and ship it properly.

Direct technical conversations before scope gets expensive.
Full-stack product delivery from interface to backend to launch.
Clear tradeoffs and execution plans instead of vague agency promises.