Development of Pixel Harbor - AI-Powered Product Image Pipeline by Leo HöslDevelopment of Pixel Harbor - AI-Powered Product Image Pipeline by Leo Hösl

Development of Pixel Harbor - AI-Powered Product Image Pipeline

Leo Hösl

Leo Hösl

Pixel Harbor - A Complete AI-Powered Product Image Pipeline

Collect -> Edit -> Optimize -> Manage -> Export
One platform that handles the full product image lifecycle. Crawl any website for product images, edit them with conversational AI, optimize file sizes by up to 98%, track every transformation in a visual version tree, and export platform-ready for Amazon, Shopify, eBay, Etsy, and Walmart.
Built as a solo developer from scratch in 3 months. Production SaaS running on serverless AWS with credit-based billing.

Typical User Flows

Fashion brand preparing a Shopify launch. Point the crawler at the existing website, pull all product images in one scan. Remove backgrounds in batch. Generate lifestyle shots with AI ("place on a marble countertop in soft morning light"). Create virtual model shots using AI-generated models matching the brand aesthetic. Export everything Shopify-ready in the correct dimensions and format.
Agency managing 20 e-commerce clients. Use the batch processor to resize, compress, and convert thousands of product images to WebP in seconds, cutting file sizes by up to 98% while maintaining visual fidelity. Export per-platform ZIPs for Amazon, eBay, and Etsy with each marketplace's exact spec requirements met automatically.
Product photographer after a shoot. Upload the full shoot via folder drag-and-drop. Use the AI Studio to remove ghost mannequins from clothing shots, generate drop shadows, upscale to 4K, and color-correct across the entire set. Branch different versions in the version tree to compare edits before committing.

Collect

A Playwright-based crawler discovers images from any URL using four sources simultaneously: network interception, DOM extraction (reads currentSrc for actual rendered images, not just src), CSS background images, and direct fetch as fallback.
Dual-viewport scanning runs mobile (iPhone 14 Pro) and desktop viewports in parallel to capture responsive image variants. Handles bot protection (Cloudflare, reCAPTCHA, Sucuri) with fingerprint rotation and session pooling. Supports authenticated crawling for password-protected sites via stored domain credentials.
Folder and multi-file upload supports up to 10,000 files (300MB each), preserves directory structure, and auto-filters system files. Real-time upload progress with per-file status tracking. Supports JPEG, PNG, WebP, AVIF, TIFF, and HEIC/HEIF.
Built on AWS ECS Fargate with scale-to-zero.

Edit (AI Studio)

Users describe edits in plain English ("change this jacket to burgundy", "place this on a marble countertop") and iterate through follow-ups. The system shows contextual suggestions and users accept or reject each preview before it becomes a new version.
Capabilities: background removal, pure white backgrounds, AI background generation, upscaling to 4K, ghost mannequin removal, shadow generation, color correction, object removal, and image expansion. Brush-based object removal lets users paint the area to modify. Hold 'O' to instantly toggle between original and current edit. Zoom/pan controls throughout.
Prompt library with saved templates for frequently used edits, so teams can reuse proven prompts across collections.

Virtual Models

For fashion and apparel. Users create custom AI-generated models matching their brand aesthetic and reuse them across products. Select a model, provide a clothing image, and the system generates the product worn on the model. Pre-built models with different styles and body types, plus the ability to create custom ones.

Batch Processing

Non-AI operations (resize, compress, format convert) run on AWS Lambda and process thousands of images in parallel in seconds, maintaining visual fidelity while cutting file sizes by up to 98%.
AI batch operations use a sample-before-commit workflow: test the edit on a single image first, only then apply to the remaining hundreds. A 6-state state machine manages the full lifecycle with session persistence, so users can close the browser and pick up where they left off. Failed images can be retried individually without re-running the entire batch.

Asset Management

Projects contain collections, collections contain versioned images.
A dynamic image data table with 12 columns (preview, filename, version, format, dimensions, source viewport, created date, file size with color-coded warnings, processing status, tags, actions). Sorting, filtering by device/tag/size range/status, and full-text search. Switch between grid view, list view, or grouped-by-page view.
Cross-collection media library for browsing and importing assets across all collections. Tagging system with inline creation and autocomplete.

Image Compare and Preview

Before/after comparison with stats overlay showing file size reduction, dimension changes, and savings percentage. Full image detail modal with zoom/pan/pinch, keyboard navigation between images, and a metadata sidebar with file info, processing duration, version history, and quick-action AI operations.
For batch processing, users select a sample image and preview the result with estimated savings before committing to the full batch.

Version Control

Every edit creates a new version in a DAG (directed acyclic graph). Branch off any version to A/B test different edits without losing anything.
The tree is visualized interactively with auto-layout via Dagre and React Flow. Platform-branded nodes (Amazon, Shopify), color-coded edges by operation type, per-version stats (image count, size savings, processing status). Bulk selection for combining or deleting version branches.

Export

Platform presets handle the exact specs for Amazon, Shopify, eBay, Etsy, and Walmart. Resize, convert format, and ZIP download in one step.

Real-Time Activity Tracking

Floating activity timeline showing all running operations with elapsed time, progress, and cancel/dismiss controls. Persisted to the database so state survives page reloads.

Tech

Serverless AWS backend: Lambda for burst processing, ECS Fargate for crawling (scale-to-zero), SQS with separate queues for AI vs transform workloads, S3 with intelligent tiering.
Frontend: Next.js 16, React 19, TypeScript, Tailwind CSS, Radix UI, ReactFlow, Framer Motion.
Supabase for auth, database (PostgreSQL with RLS), and realtime subscriptions. Stripe for fixed monthly plans with credit-based metered usage on top. PostHog for analytics. Resend for transactional emails.
Like this project

Posted Jan 27, 2026

Developed an AI-powered image processing platform for e-commerce use.