Subscription Analytics

Kometrics uses Templated to turn raw product captures into finished marketing screenshots and Open Graph images.

Kometrics (kometrics.com) is a subscription analytics platform that replays every invoice from Stripe and Creem into MRR movements. Its marketing site has to show the product itself, which means dozens of screenshots that go stale on every UI change. By splitting the pipeline in two, Playwright for the capture and the Image Automation API for the composition, Kometrics regenerates every framed shot and every OG image from one template set.

Industry: Subscription Analytics
Team: Solo Founder
Location: Global
Kometrics logo Kometrics dashboard

The challenge before using Templated

A product screenshot is two jobs, and a browser only does one of them

Kometrics sells a dashboard, so its marketing site is mostly pictures of that dashboard. A headless browser captures those pages perfectly well, but what it hands back is a bare viewport: no frame, no background, no caption, no logo. Turning 28 bare viewports into shots that look designed was manual work in an image editor, repeated in full every time a chart or a sidebar moved.

Every product surface ships in light and dark, so each design change invalidates 28 images at once

Raw viewport captures have no frame, background, or caption, so each one needed manual composition

Keeping the same crop, corner radius, and shadow across dozens of shots by hand is where consistency quietly breaks

Six Open Graph images were hand made PNGs that never reflected the page they belonged to

A screenshot pipeline built for a marketing site competes for time with the product itself

Capture and Composition, Split

One pipeline, two tools, each doing the part it is good at

28
Shots From One Template Set
Fourteen product surfaces, desktop and mobile, composed from a shared layout
2
Themes, One Layout
Light and dark differ by background and text color, not by a second design
6
Static OG Images Replaced
Hand made PNGs become renders driven by each page's own title

Why they chose Templated

"Capturing a screenshot and designing one are different jobs. A headless browser is excellent at the first and has no opinion about the second. Templated let me keep the capture step exactly as it was and move everything downstream of it into a template I can edit once."

— Pedro Campos

How Templated powers Kometrics

Playwright captures, Templated composes

Rather than replace the capture step, Kometrics kept it and handed off everything after it. The Playwright script still walks the demo workspace and shoots each page at a fixed viewport. From there the raw file becomes an image layer in a Templated template, which supplies the frame, the background, the headline, and the logo. The composition lives in a template instead of in a script, so restyling every shot on the site is one edit and one re-render.

Captures as Image Layers

Each raw capture is passed into a Templated template as an image layer. The template owns the frame, background, and padding, so the browser only ever has to produce the pixels of the product itself.

One Template Set, Both Themes

Light and dark variants share a layout and differ only in background and text color. A design change is made once on the template rather than re-exported across every shot.

Per-Page Open Graph Images

The static OG PNGs are replaced by renders driven from each page's own title and subtitle, so every page on the marketing site gets a preview that actually matches its content.

Consistency by Construction

Crop, corner radius, and shadow are properties of the template, not decisions repeated by hand per image, which is what kept a set this large visually coherent.

Rendering Off the Critical Path

Composition happens through the API instead of inside the capture script, so the screenshot run stays a thin capture step and the design work is versioned in Templated.

"The screenshots on a SaaS marketing site are never done, because the product keeps moving. Putting the composition in a template instead of a script is what made keeping them current a re-render rather than an afternoon."
Pedro Campos
Founder

Ready to achieve similar results?

Join Kometrics and hundreds of other companies using Templated to scale their visual content.

No credit card required
Get started for free