lhumina_code/hero_slides

Fork 0

Theme overlays: attach logo/image to be reproduced on every slide #66

New issue

Open

opened 2026-05-14 03:24:40 +00:00 by despiegk · 0 comments

despiegk commented

2026-05-14 03:24:40 +00:00

Owner

Goal

Allow a user to attach an image (e.g. a company logo) to a theme and specify where it should appear on every slide (e.g. top-right corner). The image is passed directly to the AI image generation model — no image compositing crates.

Approach

1. Theme markdown — overlay section

Add an [overlays] block to the theme text:

[overlays]
- file: bg/logos/company_logo.png
  position: top-right
  size: 120px
  mode: copy

mode: copy means the AI is instructed to reproduce the image exactly at that position. mode: style keeps the existing extract-style behaviour.

2. Storage

Logo/overlay images are stored under content/background/ (already indexed by find_background_files()). A logos/ subfolder is the natural home. No new infrastructure needed.

3. Theme editor UI

When a user pastes or uploads an image in the theme editor, offer two options:

Extract style — existing AI analysis path, produces theme text
Use as overlay — saves the file to bg/logos/, inserts the overlay block into the theme textarea with position/size fields the user can adjust

Images show inline in the editor as they do today.

4. Image generation — AI receives the logo

When generating a slide image, any overlay images referenced in the theme are read from disk and included as additional image inputs in the multimodal prompt (alongside the slide content and theme). The prompt instructs the model to place the logo exactly at the specified position and size.

The theme prompt wrapper is updated to say: "Place the following image exactly at [position] — do not alter or stylise it."

5. No compositing step

All reproduction is handled by the AI. No image crate or post-processing pipeline.

Files to touch

hero_slides_lib/src/generator.rs — pass overlay images to image generation prompt
hero_slides_lib/src/prompts/system_extract_theme_from_image.md — update theme extraction prompt
hero_slides_lib/src/prompts/generator_slide_image.md — add overlay placement instruction
hero_slides_admin/static/js/dashboard.js — UI: paste → choose mode, insert overlay block
hero_slides_admin/templates/index.html — UI adjustments for overlay option

## Goal Allow a user to attach an image (e.g. a company logo) to a theme and specify where it should appear on every slide (e.g. top-right corner). The image is passed directly to the AI image generation model — no image compositing crates. ## Approach ### 1. Theme markdown — overlay section Add an `[overlays]` block to the theme text: ``` [overlays] - file: bg/logos/company_logo.png position: top-right size: 120px mode: copy ``` `mode: copy` means the AI is instructed to reproduce the image exactly at that position. `mode: style` keeps the existing extract-style behaviour. ### 2. Storage Logo/overlay images are stored under `content/background/` (already indexed by `find_background_files()`). A `logos/` subfolder is the natural home. No new infrastructure needed. ### 3. Theme editor UI When a user pastes or uploads an image in the theme editor, offer two options: - **Extract style** — existing AI analysis path, produces theme text - **Use as overlay** — saves the file to `bg/logos/`, inserts the overlay block into the theme textarea with position/size fields the user can adjust Images show inline in the editor as they do today. ### 4. Image generation — AI receives the logo When generating a slide image, any overlay images referenced in the theme are read from disk and included as additional image inputs in the multimodal prompt (alongside the slide content and theme). The prompt instructs the model to place the logo exactly at the specified position and size. The theme prompt wrapper is updated to say: "Place the following image exactly at [position] — do not alter or stylise it." ### 5. No compositing step All reproduction is handled by the AI. No `image` crate or post-processing pipeline. ## Files to touch - `hero_slides_lib/src/generator.rs` — pass overlay images to image generation prompt - `hero_slides_lib/src/prompts/system_extract_theme_from_image.md` — update theme extraction prompt - `hero_slides_lib/src/prompts/generator_slide_image.md` — add overlay placement instruction - `hero_slides_admin/static/js/dashboard.js` — UI: paste → choose mode, insert overlay block - `hero_slides_admin/templates/index.html` — UI adjustments for overlay option

image.png

281 KiB

casper-stevens changed title from ~~ability to attach context e.g. logo to theme~~ to Theme overlays: attach logo/image to be reproduced on every slide

2026-05-15 14:13:29 +00:00

No labels

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

lhumina_code/hero_slides#66

No description provided.

Rows
Columns