Hero Studio

Install?

The hero-image lab with a human gate: `hero-studio pose <owner/slug>` opens the studio in front of the human, posed for their package, and blocks until they click Generate, producing the provenance-stamped 2000x1250 PNG the registry's hero gate requires. The image carries the title and artwork; the exported image also bakes the type pill (top right) and full wiki slug (bottom right); the page shows the hero bare, and only the homepage marquee overlays its own dynamic info. Every hero wears its PAGE OWNER's brand guide (<owner>/brand): colors, type, logo and background themes, Adom's included; an unresolved guide holds unbranded rather than borrowing Adom's look. Placement is fixed for all. The floating app window is the showcase: it auto-loads a real screenshot from the package's wiki page (screenshots/, docs/), takes a manual import, or a full-hero import (the human-ratified re-stamp path for existing heroes). The pose gate opens in verification mode: per-item checklist (title, subtitle, showcase, type match) and a Generate that unlocks only fully confirmed. Includes showcase bleeds, brand tile themes, gradient angles, pixel-faithful wiki marquee and index-card previews, and a component-hero mode with a photo/raytrace/phong fallback ladder.

adom-wiki pkg install adom/hero-studio

Latest: v0.23.3, published

Contents

README

markdown

Hero Studio

The hero-image lab with a human gate. Every wiki page's billboard (the 2000x1250 PNG at the top of its page) is minted here: a human walks a seven-step wizard with the hero rendering live above, clicks Generate, and the export carries a provenance stamp the registry's hero gate requires. An AI can pose, stage, and polish; a human approves.

The wizard

Package, Showcase image, Placement, Background, Headline and text, Finishing, Review and generate: one decision at a time, a dashed ring marking what each step edits, everything updating live. The classic full control panel is one header click away. The title always bakes (it IS the message) and its ink is pixel-anchored at any font size.

Quick start

hero-studio --ai-thread "<your conversation name>" pose <owner>/<slug> --surface webview
# blocks until the human clicks Generate; returns the stamped PNG path
adom-wiki repo push <owner>/<slug> --files docs/hero.png -m "new hero"
adom-wiki page hero <owner>/<slug> --image docs/hero.png

hero-studio doctor verifies both render paths (local headless Chrome, or the host browser via the desktop bridge) and prints exact fixes.

Circuit Trace Generators

The Background step and Classic controls include two options from Circuit Trace Generators:

  • Routed field (circuit-field): the v9 continuous router uses the rendered letter shapes, showcase, and badges as obstacles. Moving the showcase, changing the headline, or switching to a mirrored layout recomposes the field.
  • Seamless traces (circuit-tile): the torus router retains its repeating geometry, with a soft mask clearing those same content areas.

Both continue through open space at the bottom, use the page owner's primary/background colors (neutral ink until a guide resolves), and expose Density, Trace size, Strength, Clear space, a numeric Seed, and New pattern. The controls live below the theme picker; no imported full background is needed. The original Generated traces option remains unchanged.

hero-studio --ai-thread "hero circuit review" set theme=circuit-field circuitSeed=1234
hero-studio --ai-thread "hero circuit review" set circuit.density=0.8 circuit.scale=1.4 circuit.strength=0.22 circuit.clearance=8

Settings and seed survive snapshots, saved styles, and PNG provenance. Geometry is measured at the export size, then reused in the live hero, wiki marquee, and index cards. DOM Range measures actual wrapped text runs; Canvas paints their loaded fonts into a contour stencil. Empty column space remains available to the router. The homepage overlay supplies its own scrim, so no bottom strip is removed from the artwork. Font and showcase loading remeasure the composition. Full-hero imports hide the generators. These options render still artwork: the source playground's animation/reveal systems do not run behind a PNG preview.

The source engines are bundled, with their upstream revision recorded under public/vendor/circuit-trace-generators/README.md; previews need no external generator service. Run npm run test:traces with Hero Studio's usual Chrome and Puppeteer renderer dependencies for geometry, API, wizard, and export checks.

Scale: the human gates the style once

For fleets of similar pages, gate the LOOK, not every part: pose one representative, let the human Generate, hero-studio style save <name>, then hero-studio batch --style <name> --parts parts.json renders every part in that style locally, each PNG's provenance carrying the gate it inherited. A complete bulk pipeline (heroes, scaffold, lint, paced publish, resume) ships at docs/bulk-publish-reference.mjs.

Automated mode

The first Generate of a page each session is always human-clicked. After it, the driving AI may re-generate that page with a recorded attestation of the human's actual approval words; hard-fail layout lints lock every path. Full contract, drive verbs, and state reference: SKILL.md.