Launching soon

JIMMYCLIX

Custom 3D-printed name fidget clickers — spell it, color it, click it. Full product site and interactive builder are live; checkout flips on when Stripe goes live.

Project Overview

JIMMYCLIX is a first-party commerce brand for custom mechanical-feel name clickers. Every letter is a real keycap seated in a recessed base — customers configure colors and name in a 3D builder, drop designs in a cart, and check out through Stripe.

VERTEKS.AI designed and engineered the full stack: marketing SEO pages, performance-first landing experience, procedural 3D configurator, cart, Stripe Checkout + webhooks, and Discord order notifications. The product path is complete; production orders start once the Stripe API key is configured.

Launch status: site and builder ship without a secret key; /api/checkout returns a friendly 503 until STRIPE_SECRET_KEY is set. That's the only remaining gate to accepting paid orders.

What we shipped

Performance-first marketing site

Static landing with zero Three.js in the initial bundle. CSS hero, self-hosted fonts, SEO landings for custom name keychains, teacher gifts, and related product terms — LCP is the headline, not a 3D canvas.

Procedural 3D builder

react-three-fiber configurator generates base geometry from the name (2–10 characters) with real recessed slots per letter. Keycaps press with damped spring motion; base, caps, and legends each pick from real filament swatches. Live pricing: base + per-letter.

Cart & Stripe Checkout

Zustand cart persisted to localStorage. Checkout re-validates and re-prices every line server-side, creates a Stripe Checkout Session, and attaches full config (name, filament choices) as product metadata so orders can print straight from Stripe or a webhook payload. Discord notifications on paid sessions.

Background preload path

Landing page warms the builder chunk and typeface on idle so the route transition usually resolves immediately when customers hit Build.

Technical stack

Frontend

  • • Next.js App Router + TypeScript
  • • Tailwind CSS 4
  • • react-three-fiber + drei + Three.js
  • • Zustand (persisted cart)

Commerce & ops

  • • Stripe Checkout + webhooks
  • • Server-side reprice & validation
  • • Discord order notifications
  • • Vercel deployment

Preview the brand and builder live.

jimmyclix.com →