Website Development Case Study: AI Portrait Platform

Skip to main content
Case Study: Web Development
AI-Powered E-Commerce

A custom AI platform.
Built from zero.

How Goliath Raider designed and engineered a full-stack AI portrait generation and print fulfillment platform for Alter8 — a product category that didn't exist in any template.

40+
Portrait themes across 4 subject types
~30s
Generation time per AI portrait
3
Integrated third-party systems
100%
Automated order-to-ship pipeline
Client
Alter8
Industry
AI / E-Commerce / Print
Service
Full-Stack Web Development
Platform
WordPress + Custom Plugin
Fulfillment
Printful (Print-on-Demand)
Status
Live & Ready to Scale

The Brief

A bold idea.
No template for it.

Alter8's founder came to Goliath Raider with a concept: let anyone upload a photo, transform it into a professional illustrated portrait in a theme of their choice — Samurai, Cyberpunk, Viking, Royalty, and dozens more — then order it printed on canvas, metal, or framed luster paper, shipped directly to their door.

This wasn't a Shopify store with a product catalog. It was a generative AI application with a commerce layer on top — a product that required custom engineering from the ground up. No off-the-shelf solution existed.

The platform needed to handle image uploads, AI generation via a third-party model, watermarking and preview delivery, Stripe payment processing, automated print order placement, real-time address validation, and customer email notifications — all as a seamless experience the customer never sees the complexity of.

Alter8 homepage showing the brand logo, hero headline Your Portrait Infinite Worlds, and Transform My Portrait CTA button
Alter8 homepage — "Your Portrait, Infinite Worlds." Clean, brand-forward, conversion-focused.
What We Built

Every layer.
Custom engineered.

The platform runs on WordPress with a purpose-built plugin (alter8-core) handling all business logic. Nothing was borrowed from a page builder. Everything was written specifically for this product.

🎨
AI Portrait Generation
Grok via Replicate generates each portrait from a cropped face photo and a hand-crafted theme prompt. Real-ESRGAN upscales to 4096×4096 for print DPI requirements. Generation completes in ~30 seconds.
🖼️
40+ Themed Styles
Warriors, Adventurers, Power figures, Culture icons, Cinematic styles, and a full Children's range — each with dedicated AI prompts for Male, Female, Group, and Pet subjects.
💳
Stripe Payment System
Digital download packs, single prints, multi-product bundles, and collection bundles. Full Stripe Checkout integration with webhook-driven fulfillment and idempotency guards to prevent double-processing.
📦
Printful Fulfillment
Orders placed automatically via Printful API after payment. Canvas, framed luster (black, white, red oak), and glossy metal prints — with pre-checkout address validation to catch delivery issues before the customer pays.
📧
Automated Email Pipeline
Order confirmation fires immediately on purchase. Tracking email fires automatically when Printful ships, via a custom webhook handler — no manual steps, no third-party email platform.
🔒
Preview & Download System
Up to 10 free watermarked previews per theme. Purchase unlocks full-resolution downloads via signed tokens. Session gallery tracks all previews. Idempotency guards prevent abuse via back-button replay attacks.
🖥️
Live Product Mockup Compositor
When ordering a print, customers see their actual generated portrait composited onto the real Printful product mockup in real time — canvas frame, metal, or framed luster in their chosen color — before they pay.
📱
Mobile-Optimized UX
The full generation-to-checkout flow works on mobile. In-browser photo cropping, polling with iOS Safari tab-visibility resume, and responsive modals throughout. No app download required.
Alter8 Shop page showing Explore Themes section with Cyberpunk male portrait selected and theme chips for Warriors, Adventurers, Power, and Culture arcs
Theme gallery — 40+ styles with Male, Female, Group, and Pet previews.
Alter8 Products page showing Canvas Print at 64.99, Framed Luster Print at 89.99, and Glossy Metal Print at 124.99 with size selectors
Products page — canvas, framed luster, and metal print options with live pricing.
The Technical Pipeline

Upload to doorstep.
Fully automated.

Every step from photo upload to physical print delivery happens automatically. The customer interacts with a clean UI. The complexity is invisible.

📸
Upload
In-browser crop
🤖
Generate
Grok via Replicate
🔍
Preview
Watermarked
💳
Purchase
Stripe Checkout
⬆️
Upscale
Real-ESRGAN 4K
📦
Print Order
Printful API
🚚
Ships
Tracking email auto-sent

Printful does not automatically notify customers when orders are placed through the raw API — that feature only exists for native storefront integrations. We built a custom Printful webhook handler that fires a branded tracking email the moment an order ships, from info@usealter8.com, with carrier and tracking number. Zero manual steps.

Alter8 portrait generation flow on mobile showing face crop tool with purple bounding box and Confirm Crop button for Mafia theme
Generation flow — face crop with real-time circle overlay guide before AI transform.
Alter8 order complete page on mobile showing Mad Scientist and Superhero portraits downloaded with green download complete status indicators
Order complete — multi-theme download unlocked with per-portrait download tracking.
Technology

Purpose-built.
Not patched together.

Every tool was chosen to solve a specific problem. Nothing was included because it was familiar — everything was included because it was right for this product.

WordPress + WPEngine Custom PHP Plugin Grok (xai/grok-imagine-image) Replicate API Real-ESRGAN Upscaling Stripe Checkout Stripe Webhooks Printful Order API Printful Webhooks Cloudflare CDN Kadence Theme Cropper.js HTML5 Canvas API WP REST API MySQL (Custom Tables) wp_mail + SMTP
  • No page builder dependency — the entire shop and generation flow is hand-coded HTML, CSS, and JavaScript embedded in WordPress HTML blocks, giving full control over every interaction and zero plugin conflicts.
  • Cloudflare-aware architecture — error responses use HTTP 400 instead of 500 to prevent Cloudflare from intercepting them; sleep() calls avoided in request handlers to prevent 502 gateway timeouts.
  • WPEngine constraint handling — SFTP unavailable on WPEngine; all file edits routed through WP File Manager. Base64 image encoding used to bypass WPEngine hotlinks protection on Replicate input images.
  • dbDelta workaround — WordPress's native table creation utility is unreliable for post-activation column additions; a custom /repair-db endpoint forces table updates on demand.
  • iOS Safari tab-visibility polling fix — generation polling resumes immediately when the tab becomes visible again after a background switch, preventing the appearance of a failed generation on mobile.
Gmail inbox showing Alter8 order confirmation email with subject Your Alter8 order is confirmed listing Glossy Metal Print 12x12 and Canvas Print 12x12
Automated order confirmation email — fires from info@usealter8.com immediately after every purchase, listing all products ordered.
The Result

A full product.
Ready to scale.

Alter8 launched as a complete, production-ready platform. Every component of the customer journey — from first preview to physical delivery — runs without manual intervention.

  • AI generation pipeline live — 40+ themes across Warriors, Adventurers, Power, Culture, Cinematic, and Children arcs. Each with hand-crafted prompts for Male, Female, Group, and Pet subjects.
  • Three print products — Canvas (12×12, 16×16, 20×20), Framed Luster (black, white, red oak frame in 12×12 and 16×16), and Glossy Metal (12×12). Eight bundle SKUs combining digital downloads with physical prints.
  • Fully automated fulfillment — Printful orders fire automatically on payment. Customers receive a branded confirmation email immediately, and a tracking email the moment Printful ships.
  • Fraud and abuse prevention — preview attempt limits enforced per email per theme, signed download tokens, Stripe webhook signature verification, replay attack protection, and idempotency guards on all fulfillment paths.
  • Address validation before payment — shipping addresses are validated against Printful's live API before the customer reaches Stripe, preventing failed orders on bad addresses after payment has already cleared.
  • Real-time mockup compositor — customers see their actual portrait composited onto the product template (canvas, metal, or framed luster in their chosen frame color) before they pay, using HTML5 Canvas rendering in the browser.
Work With Goliath Raider

Have a complex idea?
Let's build it.

Whether you need an SEO-driven content site, a custom web application, or something that doesn't fit a template — Goliath Raider builds it right.

Start a Conversation →