Behind the scenes

Design Decisions

Behind the scenes of CraftView — a free mockup generator built as a satellite app for Creative Fabrica.

Product Vision

A mockup generator is a strong satellite app for Creative Fabrica because it sits at the intersection of search demand, user value, and conversion potential.

●

High search volume — "free t-shirt mockup generator" and similar queries attract POD sellers, Etsy entrepreneurs, and designers who are already Creative Fabrica's core audience.

●

Natural upsell — users who create mockups need designs to put on them. CF's library of 47,000+ graphics, fonts, and templates is the perfect complement.

●

Viral loops built in — mockups are inherently shareable. Every shared mockup becomes a branded landing page that drives new users into the funnel.

Growth Strategy

SEO Surface Area

Every template and category gets its own indexed page with unique content, schema markup, and internal links. This creates dozens of entry points for long-tail search queries like "free Bella Canvas 3001 mockup" or "business card mockup generator."

/apparel-mockup-generator category pages with FAQPage + ItemList schema

/mockups/bella-canvas-3001 template pages with HowTo + BreadcrumbList schema

/sitemap.xml auto-generated from template registry

Viral Loops

●

Shareable mockup links — unique URL shows rendered mockup on branded page with "Create your own" CTA

●

Social export presets — one-click sizing for Instagram, Pinterest, Etsy

●

Post-download prompt — "Share your mockup and unlock more high-res downloads"

Sharing as a Growth Engine

Every shared mockup is a micro-marketing moment. The share URL renders the mockup on a branded CraftView page with a prominent "Create Your Own" CTA — turning every viewer into a potential user. Here's why this compounds:

●

"Should I print this?" social posts — POD sellers share mockups to Instagram Stories, Reddit, and Facebook groups to get feedback before committing to a print run. Every share puts CraftView in front of their peers — who are also POD sellers.

●

Influencer & tutorial amplification — YouTubers and TikTokers creating "how to start a POD business" content need mockup tools to demo. CraftView being free and instant makes it the obvious pick for tutorials, each of which drives thousands of viewers to the tool.

●

Etsy & marketplace listings — Sellers use mockups directly in their product listings. Watermarked or branded mockups keep CraftView visible to buyers who want to create their own products.

Affiliate Links

Affiliate links turn every user into a distribution channel. When a user shares a mockup link, it can include their affiliate tracking code. If the viewer signs up for Creative Fabrica through that link, the original sharer earns a commission. This creates a direct financial incentive to share mockups widely.

●

Built-in referral program — Each user gets a unique referral code. Shared mockup links automatically append it. Earnings tracked in the dashboard.

●

Creator economy alignment — POD sellers and designers already think in terms of affiliate revenue. Giving them a way to earn by sharing a tool they already use is frictionless adoption.

●

Compounding reach — A tutorial creator who earns affiliate revenue from CraftView links will keep featuring it in new content. One relationship creates ongoing, organic distribution.

Technical Decisions

Choice	Why
SvelteKit + Cloudflare Pages	SSR for SEO, edge rendering for speed, Workers for server-side compositing
Custom displacement mapping (Sharp)	Cost-free, full control, fast iteration. Adobe API is a fallback if quality insufficient
PSD pre-processing at build time	34GB of raw PSDs become ~145MB of web-optimized WebP + displacement PNGs. No runtime PSD parsing
Supabase auth (separate from CF)	Self-contained POC. Email/password with built-in verification. Easy to swap for CF OAuth later
Client-side canvas for preview	Instant feedback without server round-trips. Server-side Sharp for final high-quality render
Tailwind v4	Light theme matching CF Studio aesthetic. Utility-first for rapid iteration

Conversion Funnel

1 Search traffic lands on category/template page (free, no auth)

2 Upload design + customize mockup (free, no auth)

3 Low-res download (free, no auth)

4 Full-res download → signup gate

5 Post-download CF upsell → subscription

Why gate at full-res, not earlier: Give value first, build trust. Users who've already created something they like are far more motivated to sign up than users who haven't invested time yet.

UX Rationale

Inline editor vs. separate app

The editor lives on the template page itself, not behind a route change. This keeps pages SEO-friendly (content below the fold) and reduces friction — users see what they came for immediately.

Slider controls vs. drag-on-canvas

Sliders are simpler to implement, work identically on mobile and desktop, and avoid the complexity of canvas hit-testing. A drag-on-canvas experience is planned for the full editor phase.

Light theme

Matches CF Studio's existing aesthetic (studio.creativefabrica.com). White background, subtle gray sections, rounded cards, purple/green accent colors. Feels like part of the CF family.

What I'd Do Next

CF API integration — browse and place CF assets directly in the editor

Server-side Sharp rendering — full displacement mapping pipeline for production-quality output

A/B test editor layouts — inline (current) vs. 3-panel power editor

Product color picker — apparel color swatches

AI-generated backgrounds — lifestyle scenes behind mockups using CF's AI tools

3D/video mockups — animated product rotations

Embeddable widget — "Try this template" for POD blogs

Metrics I'd Track

Template page views

SEO effectiveness

Design upload rate

Engagement quality

Download rate

Value delivered

Signup conversion

Funnel effectiveness

Share rate

Viral coefficient

CF click-through

Revenue potential