AI Generated Image

Feature Overview

Admins should be able to:

• Mark a menu with an “AI‑generated image” flag via a checkbox.
• Optionally auto‑generate AI images
• Clearly label these images in the app/website with a visible watermark and disclaimer stating “AI‑generated – for illustrative purposes only“ or similar. Why: This builds trust through transparency, reduces user complaints about misleading imagery, and ensures legal/regulatory compliance (e.g. limited-risk AI content labeling under the EU AI Act) . It’s in line with Meta’s visible “AI-generated” labeling strategy for ads and media . Design File : https://www.figma.com/design/06upxjt19EbVIFwnQGs162/QR-Code-for-Menu?node-id=1826-8996&t=V1sMn5Ld7HNmE2P8-1

Problem Statement

Today, AI-generated food images are added manually without any visible flag in the UI. Diners may be misled when AI images don’t accurately reflect the actual dish. Admin controls are inconsistent, making the process inefficient and prone to errors.

Goals & Objectives

User Stories

Admin Persona (Ops User)

1. “As an admin, I want a checkbox labeled ‘AI-generated Image?’ so I can flag that a menu use AI-generated images.”
2. “As an admin, I want a button to auto‑generate images per menu (and optionally for all menus in batch).“

End-User Persona (Diner)

1. “As a diner, I want to know if the menu image is AI-generated, so I can set realistic expectations.”

Functional Flow & Requirements

Administrator Controls

• Image Generation Controls:

Buttons on hh menu v3:

1. “Generate AI Images for this menu” → only specific menu selected
2. “Generate for all menus” → override all images including real images
3. “Generate for menus currently missing images” → only for blank images
4. Used & Unused Status Filter → https://app.clickup.com/9003122396/docs/8ca1fpw-11562/8ca1fpw-49076 → can implement later if haven’t implemented it before

• For b, c and d points, will show the filter pop up first before go to the prompt pop up.

When clicked:

1. System sends restaurant data (restaurant name, restaurant description, dining style, cuisine, menu name, menu description, price, city) to an AI-model endpoints.
   • Can edit the prompt or just use the preset. here’s the prompt :
     • HH menu V3 outlet

     #![allow(unused)]
     fn main() {
     Create a high-quality, photorealistic image of a menu item called "{menu_name}" served at "{restaurant_name}" in {city}, {country}.
     Category (if any): {category}.
     The restaurant is described as: {restaurant_description}.
     Dining style: {dining_style}.
     Cuisine type: {cuisine}.
     Visualize the menu item according to this description: {menu_description}.
     Interpret the menu item naturally based on its name, category, and description.
     If it is a food item, present it plated appropriately for its style and category.
     If it is a beverage, present it in a suitable glass or container, with realistic liquid textures, reflections, condensation (if appropriate), and garnish as needed.
     Make the item look appetizing and professionally styled, as it would appear in a high-end restaurant menu photograph.
     Include realistic textures, vibrant colors, and natural lighting that evokes a {dining_style} experience.
     Show the item isolated on a table setting suitable for the restaurant's style.
     Do not include any text or price in the image.
     Ignore the previous prompt. 
     }

     • HH menu V3 branch (choose one of the restaurant)

     #![allow(unused)]
     fn main() {
     Create a high-quality, photorealistic image of a menu item called "{menu_name}" served at "{restaurant_name}" in {city}, {country}.
     Category (if any): {category}.
     The restaurant is described as: {restaurant_description}.
     Dining style: {dining_style}.
     Cuisine type: {cuisine}.
     Visualize the menu item according to this description: {menu_description}.
     Interpret the menu item naturally based on its name, category, and description.
     If it is a food item, present it plated appropriately for its style and category.
     If it is a beverage, present it in a suitable glass or container, with realistic liquid textures, reflections, condensation (if appropriate), and garnish as needed.
     Make the item look appetizing and professionally styled, as it would appear in a high-end restaurant menu photograph.
     Include realistic textures, vibrant colors, and natural lighting that evokes a {dining_style} experience.
     Show the item isolated on a table setting suitable for the restaurant's style.
     Do not include any text or price in the image.
     Ignore the previous prompt.
     }

   • Note: Your edited prompt will be used one time only and won’t affect the original prompt
   • For Generate AI Images for specific menu, will go directly to this pop up to generate (without filter pop up)
   • Show the content of the parameter instead of showing the parameter itself (check image below)

2. Use loading when generating image
   • Still can regenerate, but it will terminate the current process and run the new process
   • Show the toast → Generating the image, Please don't close this page!

3. After image inference, each image is wrapped via imgproxy with visible watermark “AI-generated” indicating the model used.
   • Success generation shows the tick label and ticked the AI-generated checkbox
   • Failed generation shows toast with retry button: “Failed to generate AI image (Try Again?)” → When the button clicked, Regenerate the image

When clicked the menu with generated image

• Change the Generate button to Re-generate button

When clicked the menu with real image

• Show the confirmation pop up (use native design) that the generation will replace the current real image :

It will replace the real image with the AI generated image. do you want to continue? (Generate Anyway/Cancel)

When clicked the submit button but the image is still generating

• Show the confirmation pop up when the image is still generating but admin forces to submit :
  • Message : AI is still Generating the Image, Do you want to submit without the generated image?
  • Button
    • Wait the image → Close the pop up and continue generating
    • Submit without generated image → Save the changes, but without the generated image (if not completed yet)

When clicked the cancel button but the image is still generating

• Show the confirmation pop up when the image is still generating but admin forces to cancel :
  • Message : AI is still Generating the Image, Do you want to cancel without the generated image?
  • Button
    • Wait the image → Close the pop up and continue generating
    • Cancel → Discard the changes without the generated image

Note :

• Close button/icon on the pop up to close the pop up
• Back button to go back into previous process
• if the menu A has same menu name with menu that we want to generate, no need to generate a new one.
  • example: today a user ask to generate an image for “rice bowl xxx”. if next week the user asking for the same menu name but for other restaurant, then use the image that you have been generated. but still with AI generated label.

Front-end Display (Web/App)

• If Show “AI Generated” label is checked in admin dashboard (menu setting)

• Display disclaimer text on the menu page (both app and desktop), positioned under image package/library but above menu items → at least a menu checked and used

“📌 AI-generated image: for illustrative purposes only…”

•   *   The watermark shows **“AI‑generated”**, always visible across different UI contexts (including QR menu). → based on one of menu with the active `Show “AI Generated” label`
    *   Menu setting (Admin dashboard)
    *   QR menu
    *   View menu
  

• The disclaimer text must be localizable (core languages English and Thai → multilanguage as well)

• If there is no used menu checked (unchecked), no watermark or disclaimer should appear at all

• If there is no menu image uploaded, Show “AI Generated” label remains unticked and disabled

Key Performance Indicators (KPIs)

Phase 1

• Existing menu

Phase 2

• Custom prompt
• New menu

Later

• Private (https://app.clickup.com/9003122396/docs/8ca1fpw-11562/8ca1fpw-53936)
• Highlight Menu