Experimenting with impeccable skills

[katinthehatsite]

Related issues

Related to STU-1438

How AI was used in this PR

It was used to identify and implement skills that would be most useful.

Proposed Changes

This PR adds the following slash commands skills from the impeccable skills:

• design-setup/ — adapted from teach-impeccable; explores the active WordPress
  theme, asks WordPress-specific questions (block vs classic, page builder,
  etc.), writes .impeccable.md to the site root
• polish/ — systematic final quality pass covering alignment, typography,
  contrast, interactions, forms, responsiveness
• typeset/ — typography improvements with WordPress-specific guidance
  (theme.json fontFamilies, fontSizes)
• animate/ — purposeful animations with timing/easing guide and mandatory
  prefers-reduced-motion support
• arrange/ — layout, spacing, and visual rhythm with WordPress spacing scale
  via theme.json
• bolder/ — visual amplification with explicit "AI slop trap" warning (no
  cyan/purple gradients, glassmorphism)
• overdrive/ — technically ambitious effects with mandatory
  proposal-before-coding workflow

Testing Instructions

• Pull the changes from this branch
• Run npm run cli:build
• Run node apps/cli/dist/cli/main.mjs ai
• First, run /design-setup
• Provide site details of the site you want to polish
• Once the design file is ready, try other commands such as arrange or polish

This is the site that I was able to achieve by running these skills:

Screen.Recording.2026-04-08.at.10.02.42.AM.mov

I did not do any manual work there. I liked that it highlighted design improvements for me, for example, adding accents to the shopping button.

Some screenshots from how the skills work:

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[katinthehatsite]

I am experimenting if these skills are working nicely etc. - not ready for review yet, leaving as draft.

[wpmobilebot]

📊 Performance Test Results

Comparing 2a6e7f1 vs trunk

app-size

Metric	trunk	2a6e7f1	Diff	Change
App Size (Mac)	1252.02 MB	1252.06 MB	+0.04 MB	⚪ 0.0%

site-editor

Metric	trunk	2a6e7f1	Diff	Change
load	1917 ms	1824 ms	93 ms	🟢 -4.9%

site-startup

Metric	trunk	2a6e7f1	Diff	Change
siteCreation	8109 ms	8104 ms	5 ms	⚪ 0.0%
siteStartup	4016 ms	4044 ms	+28 ms	⚪ 0.0%

---

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

[gcsecsey]

Nit: After creating the site, but not explicitly running the /design-setup skill, I noticed that there's no .impeccable.md created for the site. The agent didn't run it for me either when calling /animate, but it still managed to work through the task:

I'm just wondering what we could do to make these steps more explicit to the agent. 🤔

[gcsecsey]

Thanks @katinthehatsite for working on this, the new skills look good! 👍

I tested creating a new site and running these skills: