From Conference Booth to Reusable Template

At Next.js Conf and Ship AI, the Vercel team built an interactive activation that blended hands-on experimentation with a bit of retro fun. Before attendees even arrived, the online registration let them generate their own trading cards. On-site, an AI-powered photobooth captured a portrait, transformed it into a pixel-art rendering, and printed a collectible card on demand. Each card was sealed in a sleeve with a serialized grading label, turning a technical demo into a personalized keepsake.

The goal was a system that could scale to thousands of attendees without losing the personal touch. The resulting cards also became shareable artifacts, giving attendees a way to carry a piece of the event's identity into their own feeds.

The Generation Pipeline

Behind the quick turnaround from pose to printed card was a tightly orchestrated processing chain. The moment a photo was captured, it moved through several stages:

  1. Pixel art generation: The image was sent to the flux-kontext-lora model, paired with a custom LoRA trained on a 16-bit pixel art style. The output preserved the subject's likeness and featured a solid green background for easy post-processing.
  2. Background removal: BRIA's RMBG 2.0 model stripped out the green screen, isolating the character for compositing.
  3. Card assembly: The Canvas API layered the portrait with the event's background pattern and branding. A gradient map applied with the sharp image library set the final color identity for each specific event.
  4. Output: The finished PNG was sent to the on-site printer. The complete digital workflow took roughly six seconds. Attendees could also scan a QR code to grab a digital copy.

On the physical side, printed cards were hand die-cut to get the classic rounded-corner trading card profile. To keep the on-site flow fast, sequential grading labels were preprinted and applied to PSA-inspired acrylic sleeves ahead of the event. Staff could slide the card in and hand it off immediately.

Pixel Portraits in the Browser

To make the experience reproducible beyond the event, the team packaged the core idea into a v0 template, powered by the Vercel AI Gateway and the Fal integration. The workflow in the browser mirrors the on-site pipeline:

  1. Image input: Users upload, paste, or drag-drop an image, or take a photo with their webcam. The app crops it to a card-friendly ratio and converts it to a base64 data URL.
  2. Style reference: A pre-made pixel art reference (style_reference.png) is loaded and encoded the same way, serving as the visual anchor for the 16-bit aesthetic.
  3. Model edit: The GPT Image 1.5 Edit model receives the user image first, followed by the style reference. A prompt enforces constraints like limited colors, crisp pixels, and consistent framing.
  4. Compositing: The result is cleaned up via BRIA background removal, then composed onto branded card frames for the Next.js and Vercel variants.

The critical design choice is pairing the user image with a single, consistent style reference. That stable visual anchor keeps output predictable across varied inputs, while the prompt handles the constraint work to avoid generic pixelation and produce intentional sprite art. Everything else—background removal, frame layering, gradient mapping—is about presentation.

Vercelf Yourself

With the template in place, the same building blocks became the basis for a seasonal spin-off. Vercelf Yourself turns a photo into a festive 16-bit pixel portrait, using the same style-reference technique but extending it with multiple filters. Each filter—Vercelf, Comfy, Santa, Wham!—has its own reference image and tailored prompt, all pushing toward a strict greyscale aesthetic. The prompts control scale, crop, and framing while preserving recognizable traits from the source image.

The implementation relies on Gemini image generation through the Vercel AI Gateway and the AI SDK to keep the integration lean. The AI Gateway handles routing, authentication, and response formatting behind the scenes. Because the provider interface stays consistent, models can be swapped or updated later without a rewrite.

Reusable Patterns

Pixel Portraits grew from a physical activation into a set of portable patterns: strong visual anchors, tightly constrained prompts, simple processing chains, and minimal UI. Those same patterns now power a forkable v0 template and the festive Vercelf Yourself app, providing a foundation for whatever gets plugged into the pipeline next.