ShopShot AI · Generative e-commerce product studio
Shotsmith
Turns one raw product photo into marketplace-ready images and multilingual ad copy: cut-outs, AI scenes, magic edits, upscaling and one-click exports.
My role: Design and full-stack development: studio UI, AI pipeline, billing ledger and exports
- Gen AI
- Nuxt 4
- Gemini
- fal.ai
- Inngest

Overview
Shotsmith (live as ShopShot AI) automates the post-production pipeline for e-commerce sellers and DTC brands. From a single upload, sellers remove backgrounds, place the product in photorealistic lifestyle scenes, magic-edit regions with a brush, upscale for high-DPI displays, generate ad copy in several tones and languages, and export marketplace-ready bundles.
The challenge
Small e-commerce sellers need many images per product: a white-background main image for Amazon, lifestyle shots for Instagram, square crops for Shopify and banners for their site, plus listing copy. Studio photography and manual editing for every product is slow and expensive.
Shotsmith had to turn one raw product photo into all of that, without distorting the product or its label, while keeping AI costs under control and never charging users for a generation that failed.
How it works
- 1Product photo
- 2BiRefNet cut-out
- 3Gemini scenes ×4
- 4Magic Edit / upscale
- 5Ad copy (Gemini Vision)
- 6Marketplace ZIP
Architecture
The studio is a Nuxt 4 app with a responsive canvas: zoom, pan, a transparency checkerboard and a before/after slider. The Magic Edit brush is built on vue-konva, with brush sizes, an eraser, an undo stack and a natural-language instruction for what to change in the masked area. A results strip shows the newest outputs first with lineage, progress and elapsed time.
Background removal uses fal.ai's BiRefNet through its queue, with webhooks and polling, and falls back to a local Sharp engine that flood-fills from the edges for zero-cost development runs. Scene generation calls Gemini image models to produce four variations per run from presets or a custom prompt. Gemini Vision describes the product and writes a title, description, five Amazon bullets, an Instagram caption and hashtags in several tones and languages. ESRGAN handles 2× and 4× upscaling.
Every generation runs as a durable Inngest job with retries and step recovery. Credits live in an atomic ledger in Neon PostgreSQL with Drizzle: they are deducted before a job and refunded automatically if it fails. Exports are produced with Sharp for Amazon Main (2000×2000, white, 85% fill), Instagram post and story, Shopify square and web banners, and zipped with archiver. Upstash Redis rate limits, Better Auth sessions and a strict Content Security Policy protect the app.
What I built
Multi-provider image pipeline
fal.ai BiRefNet background cut-outs via webhooks and polling, with a local Sharp flood-fill engine as a zero-cost fallback for offline and dev runs.
Scene generation
Gemini image models produce 4 variations per run from presets (Minimalist Studio, Luxury Slate Marble, Warm Sunset Glow, Cyber Neon) or a custom prompt.
Magic Edit brush
A vue-konva canvas brush with sizes, eraser, undo stack and natural-language instructions for inpainting specific regions.
AI copywriting
Gemini Vision describes the product, then writes a title, description, 5 Amazon bullets, an Instagram caption and hashtags in multiple tones and languages.
Credit ledger that refunds
Atomic credit accounting in Neon Postgres with Drizzle: credits are deducted up front and refunded automatically when a generation job fails.
Marketplace exports
Sharp builds Amazon Main (2000×2000, white, 85% fill), Instagram Post/Story, Shopify square and web banner presets, zipped for one-click download; 2×/4× ESRGAN upscaling.
Engineering decisions
- Run every generation as a durable Inngest job so long image calls never hit serverless timeouts, with retries and step recovery.
- Deduct credits before a job and refund on failure in the same ledger, so users never pay for a broken result.
- Keep a local Sharp fallback for background removal so development and demos cost nothing.
Results
- Live at shotsmith-theta.vercel.app with free credits and a demo login.
- Four scene variations per run, plus inpainting, upscaling and multilingual copy from one upload.
- Failed jobs refund credits automatically through the ledger.
- 24/24 unit and integration tests passing, with Playwright end-to-end tests.
Stack
- Frontend
- Nuxt 4 (Vue 3, TypeScript), Tailwind CSS v4, vue-konva, Pinia, TanStack Query
- Runtime
- Nitro / H3 on Vercel, Node.js 20+
- Generative AI
- Google Gemini (image, text, vision) via Vercel AI SDK, fal.ai BiRefNet, ESRGAN, Sharp
- Jobs
- Inngest (durable multi-step jobs, retries, scheduling)
- Data
- Neon PostgreSQL, Drizzle ORM, Upstash Redis rate limiting
- Security & QA
- Better Auth, CSP headers, Vitest (24/24 passing), Playwright
Related services
Need something like this?
I can build a version of this for your product, your data and your stack.
Start a project