# Banatie Lab Banatie Lab is the browser UI for working with the Banatie API: generating images, browsing the gallery of created images, managing prompts, aliases, and flows. It is referenced on the landing page as "Web Lab". The Lab will be built **from scratch**. This folder collects everything that was previously designed or documented, so the ideas are not lost. ## Documents in this folder | Document | Origin | Purpose | |----------|--------|---------| | [design-system.md](design-system.md) | `feature/lab-design` / `feature/lab-frontend` branches (`apps/landing/src/app/(lab)/CLAUDE.md`) | Full design system and layout architecture for the Lab UI | | [legacy-workbench.md](legacy-workbench.md) | `apps/landing/WORKBENCH_DOCUMENTATION.md` (main) | Text-to-Image workbench — predecessor of the Generate page (MinimizedApiKey badge, PromptReuseButton) | | [legacy-expanded-image-view.md](legacy-expanded-image-view.md) | `apps/landing/src/components/shared/EXPANDED_IMAGE_VIEW.md` (main) | Full-size image modal with metadata — building block for the gallery | ## Planned feature set (from design-system.md) Pages that were planned in the abandoned `feature/lab-*` branches: - `/lab/generate` — generation workbench (prompt, references, parameters) - `/lab/images` — gallery of generated images with filters - `/lab/live` — live URL / prompt-URL testing - `/lab/upload` — file upload interface Additional concepts mentioned in the design doc: alias management and flow control. ## API capabilities the UI must expose The functional scope is defined by the existing API documentation: - [../api/image-generation.md](../api/image-generation.md) — basic generation - [../api/image-generation-advanced.md](../api/image-generation-advanced.md) — reference images, aliases (`@hero`), flows, flow-scoped aliases (`@best`), dynamic aliases (`@last`, `@first`, `@upload`), regeneration - [../api/live-url.md](../api/live-url.md) — CDN architecture, live URLs (`/live/{scope}?prompt=...`), prompt-based caching - [../api/images-upload.md](../api/images-upload.md) — uploads - [../api/admin.md](../api/admin.md) — API key management ## Design direction (summary) - Work-focused tool, not marketing — compact typography, tight spacing, like Google AI Studio - Dual color system: zinc for layout chrome, slate for forms/cards; purple→cyan accent gradient - Lucide React icons only, no emojis - Scroll-aware collapsing header, left filter sidebar, contextual footer - Responsive 768px–1920px+ See [design-system.md](design-system.md) for the complete spec. ## What does NOT exist There is no PRD with a detailed feature list (gallery filters, prompt list, flow list behavior). The pages above plus the API docs are the only recorded ideas. A proper PRD should be written here before implementation starts.