> ## Documentation Index
> Fetch the complete documentation index at: https://docs.anotherwrapper.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Vision

> AI calorie tracking app that analyzes meal photos and returns nutrition data

<Info>
  This is a **calorie tracking app** powered by vision AI. Upload a meal photo, get estimated calories and macro breakdowns. It's a clean example of the "image in, structured data out" product pattern.
</Info>

## What Your Users See

From the user's perspective, this app is wonderfully simple:

<Steps>
  <Step title="Snap or upload a meal photo">
    Take a photo or upload one from your device.
  </Step>

  <Step title="Let the AI analyze it">
    The vision model examines the image and identifies food items.
  </Step>

  <Step title="Get nutrition data">
    See estimated calories, macro breakdowns, and per-item analysis.
  </Step>

  <Step title="Review recent analyses">
    Revisit saved results and use the dashboard shell as a starting point for day-level tracking if you want to build that out.
  </Step>
</Steps>

A practical computer-vision UX -- not just "describe this image."

## What the App Tracks

* Estimated total calories
* Macro breakdowns (protein, carbs, fat)
* Individual meal item analysis
* Meal type context
* Recent history
* A styled daily dashboard shell you can replace with real aggregation logic

It's a great example of turning raw model output into something that feels useful to a normal person.

## What Powers It

* A **vision-capable model** for image understanding
* **Schema-based structured output** -- the AI returns typed data, not free-form text
* **Object storage** for uploaded meal photos
* **Better Auth + PostgreSQL** for auth and saved analyses
* The **shared credit system**

The tool configuration brands the app as **CalorieVision** and uses a vision model from the shared AI layer.

## What You Need

<CardGroup cols={2}>
  <Card title="Better Auth + PostgreSQL" icon="database" href="/services/better-auth-postgresql">
    Auth, saved analyses, and account data
  </Card>

  <Card title="Google" icon="microchip" href="/providers/google">
    Default vision-model path for this app
  </Card>
</CardGroup>

<Card title="Storage" icon="hard-drive" href="/services/storage">
  Uploaded meal photos
</Card>

## How It Works Under the Hood

<Steps>
  <Step title="Upload">
    The user uploads a food photo.
  </Step>

  <Step title="Store">
    The file goes to object storage.
  </Step>

  <Step title="Vision API call">
    The image plus a structured prompt are sent to the selected vision model.
  </Step>

  <Step title="Structured response">
    The model returns typed nutrition data that matches the defined schema -- not random text.
  </Step>

  <Step title="Save">
    The result is saved so the user can review it later.
  </Step>

  <Step title="Render">
    The UI renders the analysis in a clean, product-friendly format.
  </Step>
</Steps>

## The Schema Pattern

This is one of the most reusable patterns in the repo. The app defines a schema for the expected output, and the AI is forced to return data that matches it. Here are the key files:

* `app/(apps)/vision/schema.ts` -- defines what the AI must return
* `app/(apps)/vision/prompt.ts` -- tells the AI how to analyze the image
* `app/(apps)/vision/toolConfig.ts` -- app configuration and model selection

## Great Starting Point For...

Even if you don't want to build a calorie tracker, this app gives you a reusable pattern:

**Upload image -> Run vision analysis -> Force structured output -> Store results -> Show polished UI**

That pattern works for:

* Skincare analysis
* Receipt parsing
* Product identification
* Packaging analysis
* Inspection workflows
* Any "upload image, get structured answer" product

## Files to Customize

Turn this into your own vision app by editing:

* `app/(apps)/vision/toolConfig.ts`
* `app/(apps)/vision/prompt.ts`
* `app/(apps)/vision/schema.ts`
* `app/(apps)/vision/components/*`

The prompt and schema define what the AI returns. The components define how that data looks in your product.

<Warning>
  This app is a product demo, not medical advice. The calorie and macro estimates are approximate AI outputs, not clinically reliable nutrition measurements.
</Warning>
