design-stack.pdf — opusjake_os RESOURCE

// OPUSJAKE RESOURCE · CLAUDE SETUP

THE DESIGN STACK

Three installs that stop Claude building websites that look like Claude built them. The design vocabulary, the reference library, and the analytics connection that lets it watch the page and fix what is not working.

Retro illustration of an analog design bench with a letterpress type case, a fanned color swatch book, a page proof under a modular grid, and a dial instrument reading the page

> boot opusjake_os

> resource: design-stack

> version: v1.0 · 2026-09-14

> status: ready_

Claude can already write the code. What it cannot do out of the box is decide. So it reaches for the same safe defaults every time and you get the page you have seen a thousand times. Three installs fix three different halves of that. Here is what each one actually does, the exact commands, and the parts nobody tells you.

THE THREE

One problem, three causes. Install all three or you only fix a third of it.

# Install What it fixes
1 impeccable No design vocabulary. It cannot name what is wrong.
2 taste No references. It averages the internet instead.
3 posthog MCP No feedback. It never finds out if the page worked.

WHY IT IS THREE AND NOT ONE

Generic output is not one failure. It is three.

The first is language. Ask for "make it look better" and Claude has nothing to reason with, so it adds a gradient. Impeccable hands it the words a designer would use, as commands you can run.

The second is reference. With nothing to point at, the model produces the average of everything it has seen, which is the definition of generic. Taste gives it specific things to point at, chosen by you.

The third is feedback. Design is a guess until someone uses it. PostHog closes that loop so the next pass is informed instead of decorative.

ONE: IMPECCABLE

Design fluency for AI harnesses. Built by Paul Bakaus. Apache 2.0, free, version 3.9.1 at time of writing.

claude plugin marketplace add pbakaus/impeccable
claude plugin install impeccable@impeccable

Inside a session use the slash version instead:

/plugin marketplace add pbakaus/impeccable
/plugin install impeccable

THE TWENTY THREE COMMANDS

Command What it does
craft Shape then build a feature end to end
shape Plan the UX before any code
init Capture PRODUCT.md and DESIGN.md
document Write DESIGN.md from code that exists
extract Pull tokens and components into a system
critique UX review with heuristic scoring
audit Accessibility, performance, responsive
polish Final pass before shipping
bolder Amplify a safe, bland design
quieter Calm an overstimulating one
distill Strip to the essence
harden Errors, i18n, edge cases
onboard First run, empty states, activation
animate Motion with a purpose
colorize Color into a monochrome UI
typeset Typography hierarchy and fonts
layout Spacing, rhythm, hierarchy
delight Personality and memorable touches
overdrive Past the conventional limit
clarify UX copy, labels, error messages
adapt Other devices and screen sizes
optimize Diagnose and fix UI performance
live Pick elements in the browser, get variants

THE FOUR YOU WILL ACTUALLY USE

/impeccable init once per project. It writes PRODUCT.md and DESIGN.md, and every other command reads them. Skip it and the rest run blind.

/impeccable craft to build. /impeccable audit before you ship. /impeccable polish when it works but feels cheap.

The rest are precision tools. Reach for typeset when the type is flat, layout when the spacing is arbitrary, quieter when you overdid it.

THE SLOP DETECTOR

The part that earns the install. Impeccable ships a local detector with a registry of named anti-patterns, forty six of them in 3.9.1, and it reads your actual HTML and CSS. No network, no npx, no upload.

These are real rule names out of that registry:

ai-color-palette      hero-eyebrow-chip
gradient-text         icon-tile-stack
cream-palette         nested-cards
dark-glow             oversized-h1
flat-type-hierarchy   overused-font
em-dash-overuse       single-font
low-contrast          tiny-text
marketing-buzzword    tight-leading
monotonous-spacing    wide-tracking

READ THAT LIST AGAIN

Every one of those is something an AI reaches for when it has no opinion. The purple to blue gradient headline. The little pill above the h1. The cards inside cards. One typeface doing every job. Body text at 13px because it looked tidier.

You have shipped half of these. I have shipped most of them. That is the point: the detector names the defaults, and a default you can name is a default you can delete.

gpt-thin-border-wide-shadow is in there as its own rule. So is em-dash-overuse. Somebody was paying attention.

TWO: TASTE

A Claude Code plugin for building with taste, in interfaces and in prose. Built by obakeng-develops. MIT, free.

claude plugin marketplace add obakeng-develops/taste
claude plugin install taste@taste
Command What it does
/taste The skill. Auto loads on design and frontend work.
/taste-learn Save a reference, with the reason.
/taste-audit One screen or passage, ranked findings, no edits.
/taste-sweep The whole codebase, ranked by scope.
/taste-help The reference card.

THE PART NOBODY TELLS YOU

The library is not full when you install it. It seeds a template at ~/.claude/taste/references.md and then it is yours to grow. Install it, ask for a premium page, and on day one it is still mostly guessing.

So do the twenty minutes. Open ten sites you actually admire and run /taste-learn on each one. Studio sites, product pages, whatever makes you jealous.

That file is the whole product. Everything else is plumbing.

WHAT TO WRITE DOWN

A bare link teaches nothing. Three fields per reference:

WHAT   what you are looking at
WHY    the specific reason it works
STEAL  the part you would take

"Nice site" is useless. "The hero is one sentence at 72px with nothing else above the fold, so the page has one job" is a rule Claude can apply to a page that looks nothing like it.

Steal structure, not pixels. Copy the pixels and you have made a different generic page.

THREE: POSTHOG MCP

The first two make the page look designed. This one tells you whether it worked. PostHog is product analytics, and the MCP is the official connection between it and Claude.

It is in the official marketplace, so this one is a single line:

claude plugin install posthog

Two other routes, same result:

npx @posthog/wizard mcp add

claude mcp add --transport http posthog \
  https://mcp.posthog.com/mcp -s user

You will be asked to log in to PostHog the first time you use it. The region routes off the account.

WHAT YOU CAN ASK IT

Once it is connected you stop opening dashboards and start asking questions.

Which section do people scroll past on the
landing page?

What are the top 5 errors this week, with the
stack trace for the worst one?

Create a feature flag for the new hero and
roll it out to 20%.

Error tracking, feature flags, experiments, HogQL queries, insights, session data. It reads and it writes.

THE LOOP

This is the reason it is in the stack.

Build with impeccable and taste. Ship. Ask PostHog where people leave. Feed that answer back into /impeccable craft as the brief for the next pass. The second version is informed. Every version after that is evidence.

Without this step you are redesigning on taste alone, which is fine right up until your taste and your buyers disagree.

THE ORDER

Paste this block, restart Claude Code, and you are set up.

claude plugin marketplace add pbakaus/impeccable
claude plugin install impeccable@impeccable

claude plugin marketplace add obakeng-develops/taste
claude plugin install taste@taste

claude plugin install posthog

THEN, IN THIS ORDER

/impeccable init

Answers a handful of questions, writes PRODUCT.md and DESIGN.md. Ten minutes, once, and every later command is better for it.

/taste-learn

Ten sites, three fields each. Do this before you ask for anything to be built, not after you dislike what you got.

/impeccable craft the landing page
/taste-audit
/impeccable audit
/impeccable polish

Craft builds it. Taste judges it against your references. Audit catches the accessibility and performance problems. Polish is the last pass.

Then ship it, let it run a week, and ask PostHog what happened.

WHAT IT WILL NOT DO

The honest page. Every one of these is a real limit, not a disclaimer.

IT DOES NOT GIVE YOU A BRAND

These three raise the floor. They do not raise the ceiling. They will reliably stop you shipping something embarrassing and they will not invent a point of view for you. Colors, name, voice, the thing you are actually saying: still yours.

TASTE IS ONLY AS GOOD AS WHAT YOU FEED IT

Said once already, worth saying twice, because it is the step everyone skips. An empty references file makes the plugin an expensive no-op.

THE MCP CAN WRITE

PostHog's MCP supports write operations across its products. It can create flags, change them, resolve issues. That is genuinely useful and it is also production. Read what it proposes before you approve it.

IT COSTS SOMETHING

Connecting the MCP is free. The AI powered tools inside it bill against PostHog AI spend, and your organization needs AI data processing turned on before they run at all. Check both before you promise a client a live analytics loop.

NONE OF IT CAN SEE YOUR SITE BY DEFAULT

Impeccable's audit and the detector read your files. live needs a dev server running to iterate in the browser. Taste judges what you point it at. If you never point them at the real rendered page, all three are reviewing your intentions rather than your work.

GET IT

Three links. All free.

impeccable by Paul Bakaus, Apache 2.0 github.com/pbakaus/impeccable · impeccable.style

taste by obakeng-develops, MIT github.com/obakeng-develops/taste

PostHog MCP, official posthog.com/docs/model-context-protocol

THE SHORT VERSION

Impeccable gives Claude the words. Taste gives it something to point at. PostHog tells it whether any of it worked.

Install all three, spend twenty minutes on your references, and stop accepting the first thing it builds.

// GET THE NEXT DROP

New resources go out to the list as they ship. One email, unsubscribe whenever.

STATUS · ONLINE · OPUSJAKE © OPUSJAKE // CRT V1