moodforge

v0.4.1

Published

21 days ago

One-command installer for a curated Claude Code design skill stack PLUS the 11-agent moodforge hive-mind with strict state.json discipline. Ships moodforge (7-step pipeline) + pbakaus/impeccable (23 craft skills) + emilkowalski/skill (motion playbook) + g

Turn Claude into a senior UI/UX designer that deeply understands your product, shows you real screens before committing to anything, uses GSAP for production animations, maps every component to shadcn/ui, and tracks state so rejected directions never come back.

This package is the installer. It downloads 36 skills onto your machine in three to five seconds. Zero npm dependencies, roughly 14 source files, ~70 KB packed.

Quick start

npx moodforge

One question -- global or project -- then pip the pixel mascot walks across a progress bar while 36 skills install:

  ██  M O O D F O R G E  ██   a curated Claude Code design skill stack
  ─────────────────────────────────────────────────────────────────────

  install the design stack, where to?

    ●  global    ~/.claude/skills    available in every Claude Code session
    ○  project   ./.claude/skills    lives next to your repo, easy to commit

  → global

Pick with arrow keys, press Enter, and watch it run:

                            ▄▄▄   ◦ ● ◦
                            ◔ ◔   ● ◉ ●
                            ▀▄▀   ◦ ● ◦
  ▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱▱   58%

  ✓ 1  preflight                   skills dir ready
  ✓ 2  moodforge (local)           ~/.claude/skills/moodforge
  ⠹ 3  pbakaus/impeccable          installing 14 of 23 · normalize
  ·  4  emilkowalski/skill
  ·  5  greensock/gsap-skills
  ·  6  shadcn/ui
  ·  7  design-stack-coordinator
  ·  8  plugin checks

  fetching pbakaus/impeccable · main

While a GitHub tarball downloads, pip stops walking, switches to a thinking face, and a small morphing amoeba blob appears next to him -- the terminal equivalent of Claude's fluttering "thinking" indicator.

When it finishes:

  scope global  ·  target ~/.claude/skills  ·  36 installed

  ◆ open Claude Code and say "design me an app"

Then open Claude Code and say "design me an app".

The pipeline

Every artifact opens in your browser automatically. Every round is logged. Every rejection is remembered.

What gets installed

| Package | Skills | What it does | |:---|:---:|:---| | moodforge | 1 | The 7-step pipeline. Senior UI/UX designer voice, state tracking, visual companion. Bundled in this package. | | pbakaus/impeccable | 23 | bolder delight audit polish arrange typeset colorize harden clarify extract optimize critique onboard normalize quieter distill overdrive animate adapt shape frontend-design impeccable teach-impeccable | | emilkowalski/skill | 1 | emil-design-eng -- the canonical animation + UI craft playbook | | greensock/gsap-skills | 8 | gsap-core gsap-timeline gsap-scrolltrigger gsap-plugins gsap-performance gsap-react gsap-frameworks gsap-utils | | shadcn/ui | 1 | Component architecture, registry integration, composable UI primitives | | design-stack-coordinator | 1 | Orchestration rules: which skill fires when, loading order, anti-patterns. Written at install time. |

After install, the installer scans ~/.claude/plugins/cache for the Anthropic plugin skills (frontend-design, brainstorming, figma-use, figma-generate-library) and reports which are present. If a plugin is missing, it tells you the exact /plugin install command to run inside Claude Code.

36 skills installed. One question asked. No flags to remember.

Example session

You: I want to design a mobile app for a coffee subscription service.

Claude: [analyzes the product -- subscription model, coffee enthusiasts,
        recurring purchases, discovery + ritual]

Claude: I've analyzed your product. Coffee subscriptions are about
        ritual and discovery. Open the browser -- 4 directions:

        A. "Slow Roast" -- warm cream, hand-lettered, slow morning vibe
        B. "Third Wave" -- clinical white, mono numerals, science-of-coffee
        C. "Hearth" -- deep ember, serif display, evening wind-down
        D. "Bean Counter" -- moss green, grid-heavy, subscription tracker UX

You: C, but quieter.

Claude: [builds 2 key screens -- home feed + roaster detail]
Claude: Here's your home screen and roaster detail. Does this look good?

You: Yes. Build the brand kit.

Claude: [full brand kit with tokens, shadcn/ui components, GSAP motion,
        WCAG-verified colors, 11-section visual brand book]

Per-project state means the next time you say "let's keep working on the coffee sub app", Claude reads the state file and resumes from exactly where you left off.

The rules

These are non-negotiable. Every agent enforces them.

| # | Rule | |:---:|:---| | 1 | Understand the product first. You are a senior UI/UX designer, not a theme picker. | | 2 | Never re-propose rejected directions. Verbatim rejections bind future sessions. | | 3 | Show screens before committing. Validate with 1-2 real screens before building a brand kit. | | 4 | Real data, not placeholders. Real merchants, real amounts, real timestamps. | | 5 | Never ship "normal and okay". Every creation skill is paired with bolder, overdrive, or delight. | | 6 | Motion follows emil-design-eng, powered by GSAP. Rules from emil, tooling from GSAP. | | 7 | Show screens one at a time. Individual approval, not a 20-screen dump. | | 8 | Always preview on localhost. Auto-open the browser. Never ask permission. | | 9 | Read state first, every session. Resume from where you left off. |

Utility commands

npx moodforge doctor              # check stack health, list manifests
npx moodforge list                # list installed skills with descriptions
npx moodforge add <owner/repo>    # install any other skill repo from GitHub

The add command supports:

| Flag | Default | What it does | |:---|:---|:---| | --ref <ref> | main | git ref to install from | | --skill <name> | (all) | install only one skill from the repo | | --force | off | overwrite an existing install | | --dry-run | off | preview without writing files |

npx moodforge add anthropics/skills --skill code-review --force

Requirements

Node >= 18 (uses native fetch and fs.cp)
tar on PATH (default on macOS, Linux, modern Windows)

Zero npm dependencies. Roughly 14 source files, ~70 KB packed.

installer/
├── bin/
│   └── design-pipeline.js       CLI entry, routes to commands/
├── lib/
│   ├── commands/
│   │   ├── interactive.js       default flow, one question
│   │   ├── init.js              the install runner, drives PipFrame
│   │   ├── doctor.js            stack health check
│   │   ├── list.js              list installed skills
│   │   └── add.js               ad-hoc skill install from a GitHub repo
│   ├── install/
│   │   ├── copy-skill.js        copies a skill dir, writes .skill-manifest.json
│   │   ├── fetch-tarball.js     downloads + extracts a GitHub tarball
│   │   ├── find-skills.js       walks an extracted tree looking for SKILL.md
│   │   └── frontmatter.js       parses YAML frontmatter, zero-dep
│   ├── util/
│   │   ├── log.js               warm amber editorial UI: masthead, PipFrame,
│   │   │                        pip sprite, glyphs, spinner, finalAction
│   │   └── paths.js             SKILLS_HOME, PLUGIN_CACHE, source resolution
│   ├── interactive.js           raw-mode arrow-key TUI: select, checkbox,
│   │                            confirm, with persistent pip header
│   └── coordinator-skill-content.js  design-stack-coordinator SKILL.md
│                                     written at install time
├── scripts/
│   └── bundle-skill.js          prepublish hook: copies parent skill source
│                                into installer/skill-source/ for npm pack
└── package.json                 name: moodforge, bin: { moodforge: bin/* }

Two modes for the skill source

The installer needs to find the moodforge skill files (SKILL.md, references/, templates/, projects/). It looks in two places:

Dev mode (running from a clone of the repo): DESIGN_PIPELINE_SRC resolves to the parent of installer/, which is the repo root.
Published mode (running via npx moodforge after npm publish): DESIGN_PIPELINE_SRC resolves to installer/skill-source/, populated by scripts/bundle-skill.js during the prepublishOnly hook.

Same code, both modes work.

lib/util/log.js is intentionally over-designed. It uses:

One warm amber accent. No cyan-purple AI slop.
ANSI BOLD for the wordmark. Never hard-coded ink color, so it reads correctly on both light and dark terminals.
A pixel mascot named pip (▄▄▄ / ◉ ◉ / ▀▄▀) with a full expression set:
- idle -- standing still, eyes open
- walk1-4 -- a proper 4-frame walk cycle the sprite cycles through while pip crosses the progress bar
- thinking (◔ ◔) -- worn while waiting on a network fetch
- happy (◕ ◕ / ▀▀▀) -- final frame when the install finishes
- sad (✕ ✕ / ╶┬╴) -- shown on abort / failure
Amoeba blob companion. During long network waits (the GitHub tarball fetches for pbakaus/impeccable, emilkowalski/skill, greensock/gsap-skills, shadcn/ui), a small 3×5 blob appears to pip's right and morphs through a 4-frame cycle (· · · → ◦ ● ◦ → ● ◉ ● → ◦ ● ◦) on a ~180 ms tick. The UI never looks frozen even when the network is.
Strict glyph roles: · info, ◆ peak-end CTA, › info bullet, ! warn, ✓ done, ✗ fail, - skip, ▰▱ bar.
Exponential decel motion: ease-out-quart on pip's walk, the masthead character reveal, and the finish animation.
Bulletproof in-place redraw. Every frame rewrite does cursorUp(height) + \x1b[J (erase from cursor to end of screen) before rewriting. Belt-and-braces against the classic TUI drift bug where a line soft-wraps and the next redraw leaves orphan sprite rows stranded above the frame. Every frame line is also ANSI-aware truncated to COLUMNS - 1 so wrapping is physically impossible.

All animations honor NO_COLOR, CI, non-TTY, and TERM=dumb with quiet, correct fallbacks.

If npx is not available:

git clone https://github.com/om13rajpal/moodforge
cd moodforge
node installer/bin/design-pipeline.js

Or install everything by hand:

git clone https://github.com/pbakaus/impeccable
cp -r impeccable/.claude/skills/* ~/.claude/skills/

git clone https://github.com/emilkowalski/skill
cp -r skill/skills/* ~/.claude/skills/

npx skills add https://github.com/greensock/gsap-skills -y
npx skills add shadcn/ui -y

git clone https://github.com/om13rajpal/moodforge
cp -r moodforge ~/.claude/skills/moodforge

Then write ~/.claude/skills/design-stack-coordinator/SKILL.md using the content from lib/coordinator-skill-content.js.

cd installer
npm version patch                        # or minor / major
npm publish --otp=XXXXXX                 # 2FA required

The prepublishOnly hook automatically runs scripts/bundle-skill.js, which copies SKILL.md, references/, templates/, projects/, and README.md from the parent directory into installer/skill-source/ so the published tarball is self-contained.

Changelog

0.4.0

New: GSAP integration via greensock/gsap-skills (8 skills). GSAP handles complex motion choreography (staggered reveals, scroll-driven animations, timeline scrubbing) while emil-design-eng governs the rules. Steps 2, 3, 3.5, 4, and 6 load GSAP skills.
New: shadcn/ui integration via shadcn/ui (1 skill). Brand-kit components map to shadcn primitives (Button, Dialog, Sheet, Toast, Tabs, Input) with CSS variable overrides. Steps 3, 4, and 6 load shadcn.
New: Step 4 (Animation Review) is a dedicated GSAP-powered approval gate before screen generation.
New: Handoff spec (Step 6) now includes GSAP appendix and Component appendix alongside the Motion appendix.
Skill count: 26 → 36. Install table, coordinator, and all agent definitions updated.

0.3.0

11-agent moodforge hive-mind with strict state.json discipline. The orchestrator dispatches specialist workers (theme-explorer, brand-architect, motion-director, screen-designer, handoff-engineer, figma-pusher, state-keeper, preview-server, inspiration-scout) and holds the state file as the single source of truth.

0.1.3

Fix: eliminated a drift bug where a soft-wrapped status line could leave an orphan ▄▄▄ sprite row stranded above the install frame with a large blank gap below it. PipFrame.draw() now unconditionally erases from cursor to end of screen on every redraw, and every frame line is truncated to the terminal width before writing.
New: 4-frame walk cycle for pip (up from a 2-frame leg toggle). The whole sprite now bobs as he crosses the progress bar.
New: amoeba blob companion next to pip during GitHub tarball fetches, morphing through a 4-frame breathing loop so the UI has a living "thinking" indicator during network waits.
New: thinking face (◔ ◔) and blink pose added to pip's expression set.
Breathing interval slowed from 320 ms hard toggle to a 180 ms organic pulse.
dismissPipHeader() and walkPipHeader() also adopted the cursor-up + erase-down pattern for drift-free header transitions.

0.1.2

Initial public release of the moodforge installer.