Peridio Blog Image Pipeline

The Problem

Marketing needed blog hero art and teaser images at the pace editorial moves — without opening a ticket queue for design on every article. The bar was high: a recognizable Peridio look, not stock gradients, and previews that still read when a link hits Slack or X.

What I Built

A small internal generator that hands off creation and management of the graphic style: a shader-driven look with controlled pixelation and the theme baked into the pipeline, so output stays consistent even when non-designers run it. It covers blog hero images and teaser / social images in one flow.

The approach was built entirely with AI-assisted workflows — from iteration on the visual language to the glue code — similar in spirit to how I automate file ops with small scripts, but here the output is rendered imagery, not repo files. Examples of the live output ship with Peridio’s blog posts.

How It Works

The generator is intentionally small. A TypeScript service reads the article title and a few parameters, then renders a WebGL scene: a base composition driven by brand tokens, a shader pass that applies the Peridio look, and a controlled pixelation stage that keeps output recognizable instead of generic. Because the theme is encoded in the pipeline rather than in a designer’s head, the same inputs always produce on-brand output — even when the person running it has never opened a design tool.

The token layer is what keeps it honest. Colors, type treatment, and spacing come from the same brand system the product and marketing site use, so a blog hero, a social card, and the product UI read as the same company. This is the image-generation cousin of the semantic, JSON-first token system I built for Peridio and Avocado OS: one source of truth, many surfaces, no manual transcription between them.

Why a Designer Builds Tooling Instead of Templates

A template still needs a human to open it, place the art, and export at the right size. This pipeline removes that step entirely, which is the difference between “faster design work” and “design work that no longer sits in the critical path.” Encoding taste into software is how one design leader produces output across marketing, product, and social without becoming the bottleneck — the same leverage argument behind using Figma MCP templates to scale company collateral.

Production Track Record

It has been in production for almost three years with a proven track record: the team ships graphics without waiting on design, and the blog has been able to differentiate from competitors when links are shared — the social preview is not a generic placeholder.

What’s Next

Tightening presets as the brand evolves, and documenting the prompt + pipeline patterns so other teams can reuse the model for their own “tiny software” workflow tools.

Related

• Peridio and Avocado OS: semantic tokens and AI-native design systems — The token architecture this pipeline pulls its brand language from.

• AI for design directors: sales decks, reports, and marketing assets — The same principle applied to the wider set of business surfaces a design leader owns.