| --- |
| title: Shopfront — Product Photo Studio |
| emoji: 🛍️ |
| colorFrom: green |
| colorTo: gray |
| sdk: gradio |
| sdk_version: 5.49.1 |
| app_file: app.py |
| pinned: false |
| license: apache-2.0 |
| suggested_hardware: zero-a10g |
| short_description: Turn phone snaps into clean product photos on klein 4B |
| models: |
| - black-forest-labs/FLUX.2-klein-4B |
| - black-forest-labs/FLUX.2-klein-base-4B |
| tags: |
| - build-small-hackathon |
| - backyard-ai |
| - tiny-titan |
| - off-brand |
| - best-demo |
| - flux |
| - image-to-image |
| --- |
| |
| # 🛍️ Shopfront — Product Photo Studio |
|
|
| **Selling something handmade? Turn a plain phone snap into a clean product photo.** |
| Upload a photo of your product; Shopfront restages it on a well-lit scene — |
| marble, linen, a sunlit windowsill — **keeping the product itself intact** — and |
| hands you four variations to pick from. No prompt writing, no studio. Built for |
| the [Build Small Hackathon](https://huggingface.co/build-small-hackathon) |
| (🏡 *Backyard AI* track) on **FLUX.2 [klein] 4B**. |
|
|
| > ▶️ **Demo video:** _add link_ · 📣 **Social post:** _add link_ |
|
|
| ## How it works |
|
|
| 1. **Upload** a plain phone photo of your product. |
| 2. **Pick a scene** — *White marble, Linen flat-lay, Sunlit windowsill, Studio |
| grey, Botanical*. No prompt writing. |
| 3. Shopfront runs a guarded image-edit (*"keep the product, change only the |
| background and lighting"*) and returns a **4-variation grid** so you choose the |
| best shot. |
|
|
| It's a focused tool for one real user — a small seller — not a generic prompt box. |
|
|
| ## Idea & tech (Build Small write-up) |
|
|
| - **The problem.** Good product photography is expensive; most small sellers have |
| phone snaps on a cluttered table. Shopfront does the lighting and staging. |
| - **The model.** [`FLUX.2-klein-4B`](https://huggingface.co/black-forest-labs/FLUX.2-klein-4B) |
| — 4B params, **Apache 2.0**, open weights, runs on the Space GPU (~13 GB, |
| 4-step distilled), no token/gating. |
| - **The engine.** A `diffusers` `Flux2KleinPipeline` in **image→image** mode, |
| built on CPU at module scope and moved to GPU inside a `@spaces.GPU` call |
| (ZeroGPU). Inputs are snapped to a klein-legal size; the edit is called with |
| `pipe(prompt=…, image=…)` (keyword — `image` is positional-first). |
| - **The craft.** Scene presets are guarded edit prompts that change only |
| background/surface/light; four seeds give a pick-your-favourite grid. A custom |
| single-purpose UI replaces the stock starter tabs. |
| - **Renders reliably on Spaces.** System-font theme (no Google-Fonts fetch) and |
| `ssr_mode=False`. |
|
|
| ## Why it fits "Build Small" |
|
|
| | Rule / badge | How Shopfront delivers it | |
| | --- | --- | |
| | **REQ-01 · Models ≤ 32B** | klein **4B** — also ≤ 4B → 🏅 **Tiny Titan**. | |
| | **REQ-02 · Gradio app in the org** | A Gradio Space; deploy/duplicate into the Build Small HF org. | |
| | **REQ-03 · Demo video** | _add link above_ | |
| | **REQ-04 · Social post** | _add link above_ | |
| | **REQ-05 · ZeroGPU limit** | Single ZeroGPU Space (`zero-a10g`). | |
| | **REQ-06 · Tagged README** | Track + badge tags + this write-up. | |
| | 🎨 **Off Brand** | Purpose-built studio UI, not the stock tabs. | |
| | 🎬 **Best Demo** | A real seller's before→after sells on video. | |
|
|
| ## Submission checklist |
|
|
| - [x] Runs on klein 4B (≤ 32B, and ≤ 4B for Tiny Titan) |
| - [x] Gradio Space |
| - [ ] Demo video recorded + linked above |
| - [ ] One social post + linked above |
| - [ ] Space uploaded into the Build Small org |
| - [x] README tagged with track + badges + write-up |
|
|
| ## Push it further |
|
|
| Train a **brand LoRA** on ~20 of the seller's existing on-brand shots (see |
| `TRAIN_A_LORA.md` + `configs/my_lora_klein_4b.yaml`) so every staged scene matches |
| their aesthetic — load it with `pipe.load_lora_weights(...)`. |
|
|
| --- |
|
|
| **Links:** [FLUX.2 [klein]](https://huggingface.co/black-forest-labs/FLUX.2-klein-4B) |
| · [GitHub](https://github.com/black-forest-labs/flux2) |
| · [Docs](https://docs.bfl.ai) |
| · [Build Small Hackathon](https://huggingface.co/build-small-hackathon) |
|
|
| Built on the [klein Build Small starter](https://huggingface.co/spaces/stephenbtl/klein-build-small-starter). |
|
|
