I scream, you scream, we all scream at screenshots

Your product screenshots are doing less work than you think, and there are ways to make your features more exciting and understood.

Here are the biggest problems with using a screenshot to talk about a feature: it’s crowded and ugly.

To make one point about one feature, you the entire UI: the nav, the sidebar, the breadcrumb, other screen elements outside the scope of the feature.

The two things that actually matter are buried in forty things that don’t.

If ease of discernment wasn't enough, screenshots are also a pain to place well, it is rare to find a genuinely good-looking crop surface of your UI that also gets the information across.

Last point: it’s stale the moment you ship, which on a healthy product is constantly. You redesign a panel and now every marketing page is quietly lying about what the app looks like.

“So, record a video instead?”

Corey wrote this up on our blog as one of eight easy wins, and he’s right that a short recording beats a screenshot. Fifteen seconds of the product actually moving, shot in Screen Studio or Loom. When it works, it’s the best thing on the page.

But it’s a double edged sword.

A video only works if your product already looks great, because now it’s on screen for fifteen uninterrupted seconds instead of a static beat. You need a decent screen recorder and the skill to drive it cleanly. When your UI changes, the video is wrong, same as the screenshot, except reshooting is a production instead of a re-export.

And the big one: you cannot record over real customer data or the random junk in your own account. You need a demo account that’s been deliberately built, populated with clean, realistic, on-message inputs, and kept that way for every video you’ll ever shoot. It's a cool opportunity to showcase your brand personality by filling in the demo account with interesting character sets (I get a chuckle every time I see Michael Scott and the crew from the Office or Luke Skywalker and his companions, have fun with it).

But, that’s not a five minute job. It’s a standing piece of infrastructure. Sometimes it’s worth it. Often it’s the reason the video never gets made and the screenshot stays up for another year. Brands like Framer, Shopify, and Tailwind (in the photo below from Screen Studio's website) have dedicated product marketing teams whose sole job is to make stuff like this.

The middle ground is the winner

Abstract it. Pull the two elements that carry the point out of the interface, draw them big enough to read, drop everything else.

This used to be the expensive option and now it’s the cheap one because AI is genuinely good at it. The images above were made by hand in Figma, here is a completely code-generate abstraction of the terminal used for Corey's Marketing Skills website:

Hand it the screenshot, get back a clean, branded version of the same idea in your colors, with your typefaces, and the noise gone. Animated in a few seconds if you want motion.

No demo account, no reshoot, no recorder. When the UI changes you regenerate it in a minute and this becomes even easier if you can connect your product to the agent building your site. Might not even need to since the abstraction is still... abstracted.

It wasn't, and still isn't, a pixel-for-pixel representation of your UI.

Here's the prompt (fill in the brackets):

You are designing a branded feature abstraction for a marketing page, not a screenshot of the real UI. I’m attaching a screenshot of the actual product. Your job is to distill it, not reproduce it.

THE FEATURE

What it is: [one line, e.g. “automated invoice reminders”]
The ONE point this graphic must land: [e.g. “reminders send themselves on a schedule you set once”]
The 2–3 elements that carry that point: [e.g. “the schedule toggle, the reminder timeline, the ‘sent’ status”]
Everything else in the screenshot is noise. Drop the nav, sidebar, breadcrumbs, secondary controls, and any UI chrome not on that list.THE BRAND
Primary color: [#hex] Secondary/accent: [#hex]
Background: [#hex, e.g. off-white or dark]
Typeface: [e.g. Inter] — headings [weight], body [weight]
Radius / corner style: [e.g. 12px, soft] · Shadows: [subtle / none]
Overall feel: [e.g. “calm, confident, a little playful”]THE OUTPUT
Abstract, simplified, oversized. The 2–3 chosen elements should be readable from three feet away, not pixel-accurate to the app.
Use my brand colors and type. The primary color should be the loudest thing in the frame.
Composition and aspect ratio: [e.g. “16:9 hero, element left of center, breathing room around it”] so it drops cleanly into a marketing section.
Real, plausible sample content — no lorem ipsum, no customer data, nothing that looks like a bug or a placeholder.
Clean vector-style shapes, generous whitespace, one clear focal point.DO NOT
Recreate the full interface or copy the screenshot literally.
Add fake metrics, logos, or claims I didn’t give you.
Crowd the frame. If it has more than [3–4] distinct elements, cut.
Return it [as a single 16:9 image / as layered/editable so I can animate it].

What is the actual job of a feature page? It's not “show the UI.”

It’s “make someone understand what the feature does and want it.”

The abstraction conveys the feature without dragging along every pixel of the product to do it.

Screenshot, video, abstraction. One’s too crowded, one’s too expensive, and the third one is branded, fast to change, and still says the thing.

Abstractions are the GOAT

— Zach 😎