pclshm/studio
↖ pclshm.dev
Menu
Not yet released pclshm / studio · internal tool · runs on 127.0.0.1

Never one-shot a design. Judge it on paper.

pclshm studio is a local workbench for design taste. It collects the work you admire, files every piece under a named style group, generates concepts in variants, rebuilds references head to head — and then hands the result to the Claude session building the real thing.

// one person · one machine · no accounts · no cloud by default

How it works Availability
Fig. 00 — every image on this page is processed, never raw: ordered dither, halftone, linework. Paints in the page's own ink
01 The loop

Find, file, build in variants, compare, hand off.

A design workflow made into features. Each step is a page in one of the apps, and each step's output is the next step's input — nothing is retyped between them.

  1. 01

    Find

    Save what you admire as it crosses your screen: an uploaded screenshot, a Dribbble, Pinterest or X link, or a screenshot with its source link on the same design.

    Rater · :4801
  2. 02

    File

    An agent opens the screenshot itself, files it under exactly one named style group, tags six facets — style, color, layout, mood, component, typography — and names it.

    Agentic labeling
  3. 03

    Wire

    Skills and external MCPs plug in: the suite's own MCP gateway exposes the library to Claude, and the Higgsfield connector renders imagery in the design's language.

    MCP gateway · :4899
  4. 04

    Build in variants

    A four-part prompt — Aesthetic · Reference · Intent · Guardrails — becomes N distinct HTML concepts side by side. Iterate on the favourites; promote the keepers back into the library.

    Generator · :4802
  5. 05

    Compare

    Rebuild one reference as an interactive showcase, once per generation skill and style family, on byte-identical input. Crown a winner; the scoreboard remembers.

    Bake-off · :4803
  6. 06

    Hand off

    Every design carries a paste-ready reference command, a demo-repair pass and a webpage asset kit — the routes by which it leaves the suite for the project that needs it.

    Reference command
02 The apps

Small apps, one ground, one library.

Three flagship web apps and a gateway share one design system, one SQLite file, one pluggable AI layer and one MCP surface. A launcher starts them all and keeps the dashboard on :4800.

Fig. 01 — the Rater gallery, redrawn Illustration · not live data

Design Rater

Collect · label · rediscover

Ingest screenshots and links, have an agent analyze and label them, then browse them grouped under the named style groups — rate, collect into sets, rediscover. Generated concepts land here too, filterable beside the inspiration that led to them.

Port
4801
Owns
the library

Concept Generator

Prompt · variants · promote

A four-part prompt builder — Aesthetic, Reference, Intent, Guardrails — that asks for several distinct HTML concepts at once, never one. Compare them side by side, iterate on a favourite, promote it back into the Rater.

Port
4802
Owns
briefs & variants

Design Bake-off

Rebuild · compare · crown

Rebuilds a collected design from its screenshot-derived spec as an interactive showcase — hero, features, gallery, demo, footer — per skill and per style family, so two approaches meet on the same brief.

Port
4803
Owns
renditions & scores

MCP Gateway

The suite, for Claude

Exposes the whole library to Claude over Streamable HTTP and stdio: read designs and screenshots, list the style groups, queue work, complete it. Its root page is the setup screen with the registration commands and the live tool inventory.

Port
4899
Transport
HTTP · stdio
03 Style groups

Not a mood board. A taxonomy with risks.

There is no filter bar of facets. Every design is filed under one named style group — a genre with one committed risk — or waits in Reference Styles until a pattern repeats and a new genre earns a name.

SG-01print-tech-paper

Print-Tech Paper

Crafted-document energy: warm paper grounds, halftone/CMYK texture, registration marks, mono data callouts. The page pretends it was printed and measured.

RISK Render the hero image entirely in halftone dots with visible registration marks

SG-02dither-mono

Dither Mono

One-bit conviction: imagery reduced to ordered dither, hard black-on-paper contrast, terminal type. The page pretends it runs on a 1984 machine that knows the future.

RISK Reduce every image to two colors through ordered dithering — no grayscale escape hatch

SG-03vast-quiet-cinematic

Vast Quiet Cinematic

Widescreen stillness: enormous negative space, one monumental line of type, imagery graded like a film frame. The page pretends it is the opening shot of a film.

RISK Let the hero be 90% empty — one line of type against a vast graded field

SG-04data-as-texture

Data-as-Texture

Numbers as material: tables, coordinates, tick marks and plots woven into the ground of the page. The page pretends the data leaked into the design.

RISK Use a live data artifact — table, plot, log — as the hero's background texture

SG-05classical-remix

Classical Remix

Old-master gravitas cut with modern precision: serif display, engraved artwork, sharp contemporary layout. The page pretends a museum hired a type foundry.

RISK Set an engraved classical artwork against ultra-modern grotesk data callouts

SG-06glitched-antiquity

Glitched Antiquity

Corrupted heritage: classical imagery run through scan errors, displacement and channel splits. The page pretends the archive got corrupted beautifully.

RISK Glitch a classical sculpture or engraving as the primary hero image

SG-07illustrated-storybook

Illustrated Storybook

Hand-drawn warmth: illustrated scenes, humane color, type that lives inside the artwork. The page pretends a picture book grew an interface.

RISK Commit to full-bleed illustration as the page's structural backbone, not decoration

◈ Holding penreference

Reference Styles

Unfiled inspiration: designs whose style matches no named group yet. When several references share one energy, that is a new style trying to be born — name it.

RISK Leave nothing here forever — every reference either joins a style or founds one

Always

  • One committed risk per style — a bold move every design in it must make
  • Imagery is processed, never raw — halftone, dither, grain, ASCII, linework
  • Technical marginalia — coordinates, IDs, ruler ticks, registration marks, timestamps
  • Type at extremes — monumental display or tiny labels, little middle
  • Near-monochrome ground + a single warm accent

Never

  • Glossy 3D SaaS blobs
  • Untextured stock photography
  • Rounded-everything friendliness
  • Icon-grid feature rows
  • Inter/system-font-only typography
  • Evenly-distributed colorful palettes

Adding a style

  1. Name it like a genre, not a technique — two or three words
  2. Describe the energy: what the page pretends to be
  3. RISK — the one bold move every design commits to
  4. DEPLOY FOR — which product types it serves
  5. VOCAB — 5–8 reusable phrases for tagging and prompting
  6. Re-run agentic labeling so existing designs regroup
04 Bake-off

Two skills, one brief, byte-identical input.

Deterministic craft against art direction, run through the same style groups on the same screenshot-derived spec. The only variable is the skill — so the result says something about the skill.

Impeccable

deterministic craft

Taste v2

art direction

Same input

Both renditions are built from one spec derived from one screenshot. Five style groups are drawn at random by default, or picked by hand.

Isolated previews

Each rendition paints in its own colors inside a neutral gutter. Switching this page to ink above does not recolor a single pixel inside the frames.

A scoreboard, not a vibe

Crown a winner per family; the skill scoreboard keeps count. Theme the demo with a scenario, promote a rendition back as a generation reference.

Fig. 02 — a bake-off pair, redrawn Illustration · not a real rendition
05 Terminal handoff

The browser queues. The terminal works.

Servers never shell out to an agent. Agentic work — variants, renditions, labeling, imagery, demo repairs — is queued in the browser and executed by an interactive agent session you can watch: Claude Code, Codex or Grok.

Every task is created instantly as a pending row. The launcher's handoff console lists each one with the exact contract the agent receives, and opens a terminal with the agent already running — on the whole queue or on one task.

Completion is validated, not trusted: a page that lost a section, a label set of the wrong shape or an image from a model other than the one requested is rejected with a precise reason, and the agent fixes it and tries again.

  • variant:<id>a concept variant from a four-part brief
  • rendition:<id>a bake-off showcase, one skill × one family
  • label:<id>visual analysis and filing of one design
  • image:<id>a cover or asset, rendered via the Higgsfield MCP
  • cleanup:<id>an in-place repair of a promoted demo page
terminal · pclshm-suite 
# start every server and the dashboard on :4800
$ bun run launcher

# see what the browser has queued
$ bun run handoff

# hand the queue to an agent session
$ claude "Run `bun run handoff brief` and follow it until the queue is empty."

# the runbook it follows
  list → show <task> → do the work → complete <task> --file <out>
✓ completion validated · result lands in SQLite · the page picks it up
06 Out of the suite

A design is meant to leave.

A library is only worth keeping if it reaches the thing you are actually building. Every design carries three routes into a Claude session running in another project.

i · text

The reference command

A paste-ready block on every design page: what the design is, every route to the actual pixels, and the rule that keeps a reference a reference. It never lets prose stand in for the design — the first instruction is always to go and look.

Use pclshm design #42 — “Horizon Study” —
as the design reference for this work.

## Look at it first
- `get_design` { "designId": 42 }, then read
  `screenshot://118` — open it, do not
  design from this text alone

## How to use it
- Borrow the visual language.
- Never copy its literal copy.

Example · abridged · design #42 is illustrative

ii · repair

Demo cleanup

A generated page can be right in every decision and sloppy in execution. Cleanup is a repair, never a redesign: the agent edits the page in place, and completion refuses anything that dropped what made it the design.

  • fixoverflow · grids · spacing
  • fixcontrast · stacking · dead handlers
  • keeppalette · typefaces · layout concept
  • keepthe copy and every <section>
  • keepthe pre-pass HTML, for revert
iii · imagery

Webpage asset kit

The imagery a real page is built from, generated in the design's language and written to a folder with stable file names, a manifest and its own wiring command.

hero.png16:9
og.png16:9
mark.png1:1
texture.png1:1
feature.png4:3
portrait.png3:4
Marketing covers — a structure per design, never one template: Poster Bleed Split Editorial Masthead Specimen Artboard Mosaic Immersive Terrace
07 Availability
Not yet released

Nothing to download here. That's deliberate.

Studio is a personal tool, built for one person's design practice. It has no public build and its repository is private, so this page has no install button — there is nothing it could honestly point to.

It is one of several internal tools collected at pclshm.dev. If a public build ever ships, it will be listed there first, with checksums beside the link.

  • Runs onYour own machine. Bun, servers on 127.0.0.1 ports 4800–4899, an optional native launcher window.
  • DataOne SQLite file and its screenshots under ~/.pclshm-suite/. Nothing is uploaded anywhere.
  • AIAgent CLIs bring their own auth; local vision servers are the offline fallback. No API keys live in the suite.
  • AccountsNone. Single user, no sign-in, no telemetry.
  • ImageryOptional, through the Higgsfield MCP connector on your own account — billed to it, never assumed.

Not a hosted service.There is no studio.pclshm.dev app — this page is the whole public surface.

Not a team tool.One library, one person, one machine.

Not a drawing tool.It collects, judges and hands off design; it does not draw it.

Not one-shot.Variants, bake-offs and repairs — never a single take.