An interview work sample for AIVM, built independently See the code
Carousel Engine Get the repo

An automated carousel system for AIVM

Nobody designed these carousels.
A system generated them.

Write the copy, pick a layout, and finished carousel slides come out the other end, on brand every time.

Try the editor Install it Prototype, not a brand rollout

Why this exists

One side of the group ships
constantly. The other starves.

Look at the public accounts and the pattern is hard to miss. The crypto side posts often and gets read. The enterprise side posts rarely and gets ignored, and the difference is not the quality of the thinking. It is that nobody has time to make the assets.

That is a throughput problem, not a design problem, which is why the answer here is a system rather than a set of posts.

The work

Four sample carousels.
All of them editable.

01 / 13

Try it

This is not a preview
of the system. It is the system.

Pick any slide above and it opens here. The editor runs the same code as the command line, across all three engines, so a slide from the earliest system edits exactly like one from the newest. Anyone on the marketing team can drive it, and nothing they touch can take a slide off brand.

01

Live. Every edit changes the same JSON the command line reads.

How it works

Four moving parts.
None of them is a designer.

  1. 01

    Write a spec

    A post is a JSON object: copy, layout, ground, object placement. Versioned, diffable, and reviewable before anything renders.

    { "kind": "poster", "bg": "tile",
      "head": "How agent actions<br>flow through <b>AIVM</b>",
      "obj": [{ "of": "flow", "opacity": 0.92 }] }
  2. 02

    Tokens become CSS

    Every colour and size lives in one brand.json, authored against a 1080px frame and scaled per format. A story crop is not a second design.

  3. 03

    Objects are traced, not drawn

    Codex generates a 3D render on black. The converter turns it into a field of cells by tracing its edges, which is what makes it read as line art rather than a silhouette.

  4. 04

    Chromium renders it

    Headless, at 2x, straight to PNG. Same output every run, so a post can be regenerated months later and come back identical.

    node src/render.js --only aivm-matrix
    → output/aivm-matrix/portrait/*.png
The original 3D render, before conversion
cells render
Drag it. The converter traces the render's edges rather than its brightness, which is what makes the result read as line art instead of a silhouette.

What it produces

Ask for a carousel.
Get finished files.

Formats

Portrait 1080×1350 is tuned and shipping. The renderer also emits square and story from the same spec, but object placement is authored against the 4:5 frame, so those crops still need per-format tuning before they are worth posting. One flag, then a pass of real work.

--formats portrait,square,story

Layouts

Distinct page architectures, not variants of one block.

New objects on demand

If a slide needs a form the library does not have, one command generates it, converts it, and prints the line to paste. It uses whichever generator you have: an OpenAI key, the Codex CLI, or any render you hand it as a file.

node src/gen-object.js --name shield \
  --brief "two curved overlapping plates"

Guardrails

Every factual claim traces to aivm.io or brain.aivm.io and carries the date it was checked. A claim that is not in the registry, or a phrase on the blocked list, stops the render before a file is written. Nothing reaches a slide that has not already been verified against the source.

Install

Your team runs this
from Claude.

Two pastes. The first sets it up, once. The second is what anyone on the team types every time they want a carousel.

1 Set it up
Clone https://github.com/Arnav23apr/carousel-engine into a folder
and run `npm run setup` inside it.

Paste into Claude Code. It clones, installs dependencies, fetches the browser the renderer needs, and drops the skill file where Claude looks for it. Once only.

2 Ask for what you need
Make me a five slide AIVM carousel about runtime policy
enforcement. Use the ledger layout for the proof beat,
and show me the PNGs when you are done.

Every time after that, this is the whole interaction. Claude reads the skill file, writes the spec, renders it, and hands back finished slides. Swap the topic for anything.

If a slide needs an object the library does not have

One command generates it, converts it to a cell field, and prints the line to paste into the spec. It uses whichever image generator the team already has, picked automatically:

OpenAI Set OPENAI_API_KEY. Nothing to install.
Codex CLI Signed in locally. No API key needed.
Higgsfield, or anything else Generate the render however you like, then hand it over with --from render.png.
node src/gen-object.js --name shield --brief "two thick curved plates overlapping to form a guard"

Whichever route runs, the same style contract goes in and the same converter runs after, so an object made three different ways still reads as one library.

Prefer to run the commands yourself?

1 Install

git clone https://github.com/Arnav23apr/carousel-engine
cd carousel-engine && npm run setup

Node 20 or newer. Generating new objects also wants Python with Pillow and numpy; setup tells you if it is missing.

2 Render

cd core
node src/render.js --only aivm-matrix

Output lands in output/<id>/portrait/. Every sample in the picker above renders the same way.

What is honest about this

This is a prototype, not a finished system, and nothing here has been approved by anyone at AIVM. The display face is Outfit standing in for licensed Articulat. Several rows in the access log and two card headings are adapted from aivm.io, and the rest of the copy is mine and unreviewed. The browser export rasterises client-side for convenience; the command line produces the shipping files. What it is meant to show is the shape of the thing and how much of the carousel pipeline can be automated.