ui-animation
mblode/agent-skills · skills.sh
Open source Repository Open in the app JSON README (API)
About
Skill publicada por mblode/agent-skills no skills.sh. Instale com: npx skills add mblode/agent-skills@ui-animation
Details
- Kind
- Agent skills
- Topic
- No topic detected
- Publisher
- mblode
- Origin
- skillssh
- Category
- ferramentas
- Stars
- 102
- Forks
- 9
- Last push
- 2026-09-05T05:59:05Z
- Repository state
- ativo
- Language
- Shell
- License
- MIT
- Added
- 2026-08-30 15:21:20
- Updated
- 2026-09-08 15:02:15
- Origin id
mblode/agent-skills/ui-animation
README
<div align="center">
# Agent Skills
**UI audits, typography, docs, PR review, and releases, loaded on demand by your coding agent**
26 skills for the parts of shipping that code review never covers: the loading states, the type scale, and whether half the diff is AI slop.
<p align="center">
<a href="https://www.skills.sh/mblode/agent-skills">
<img src="https://img.shields.io/endpoint?url=https%3A%2F%2Fwww.skills.sh%2Fapi%2Fbadge%2Fmblode%2Fagent-skills&label=installs" />
</a>
<a href="https://github.com/mblode/agent-skills/blob/main/LICENSE.md">
<img src="https://img.shields.io/github/license/mblode/agent-skills?style=flat&colorA=000000&colorB=000000" />
</a>
</p>
</div>
## Install
```bash
npx skills add mblode/agent-skills -g --agent claude-code codex cursor -y
```
`--agent` takes a space-separated list. A comma-separated one is rejected whole as a single invalid name.
The bundle is listed at [skills.sh](https://www.skills.sh/mblode/agent-skills).
Agents: these skills. Humans: [Taste Training](https://blode.co/taste-training), a course on spotting and fixing AI slop. First unit free.
### Cloud agents
A cloud agent runs on a fresh VM that never sees your machine's `~/.claude/skills` or `~/.agents/skills`, and Cursor's Sync Skills toggle covers only `~/.cursor/skills`. Nothing you install locally reaches them.
**Claude Code cloud, Cowork, and routines.** This repo is a plugin marketplace. On claude.ai, open **Customize > Plugins > Add > Add marketplace > Add from a repository**, enter `mblode/agent-skills`, and install the Agent skills plugin. Every cloud session gets all the skills with no per-repo config, and Sync automatically keeps them current whenever the repo changes on GitHub.
To scope it to one repository instead, declare the marketplace there and Claude installs it at session start:
```jsonc
// .claude/settings.json
{
"extraKnownMarketplaces": {
"mblode-agent-skills": {
"source": { "source": "github", "repo": "mblode/agent-skills" }
}
},
"enabledPlugins": { "agent-skills@mblode-agent-skills": true }
}
```
**Cursor cloud agents.** Cursor has no account-level equivalent, so install on the VM at build time:
```jsonc
// .cursor/environment.json
{ "install": "npx skills add mblode/agent-skills -g --agent cursor -y" }
```
That lands in the VM's `~/.agents/skills`, which Cursor loads, and leaves nothing untracked in the agent's diff.
## Skills
### Architecture
- **[codebase-architecture](./skills/codebase-architecture/SKILL.md)**: Design a structure, deepen an existing one, or harden it with guardrails.
- **[scaffold-nextjs](./skills/scaffold-nextjs/SKILL.md)**: Next.js turborepo with Blode UI, Ultracite, GitHub, and Vercel.
- **[scaffold-cli](./skills/scaffold-cli/SKILL.md)**: TypeScript CLI package: ESM, tsdown, vitest, changesets, CI.
- **[multi-tenant-architecture](./skills/multi-tenant-architecture/SKILL.md)**: Tenant isolation, routing, and custom domains on Cloudflare or Vercel.
### Design
- **[product-design](./skills/product-design/SKILL.md)**: What the interface should do, before anyone builds it.
- **[ui-design](./skills/ui-design/SKILL.md)**: Visual direction, design-system extraction, Tailwind builds, screenshot to markup, dark mode, responsive, and a React and Next.js UX audit with a ship verdict.
- **[ui-verification](./skills/ui-verification/SKILL.md)**: Boots the app in a headless browser and runs nine probes that turn inferred UI defects into measured ones, then proves the fix cleared.
- **[ui-animation](./skills/ui-animation/SKILL.md)**: Springs, gestures, easing, and curves pulled from a screen recording.
- **[presentation-creator](./skills/presentation-creator/SKILL.md)**: Decks with a story spine, speaker notes, and a contrast-checked QA pass, as Marp markdown, a web app, or a handoff to pptx.
### Writing
- **[eli5](./skills/eli5/SKILL.md)**: Session talk in plain language: optional analogy, exact technical terms, and house vocabulary without forced templates.
- **[docs-writing](./skills/docs-writing/SKILL.md)**: Diataxis doc types, 51 rules, audit and writing modes, agent-readable docs.
- **[readme-creator](./skills/readme-creator/SKILL.md)**: Type-aware README from the manifests: one install, a runnable quickstart, badges only where published.
- **[seo-program](./skills/seo-program/SKILL.md)**: Keyword and prompt-volume research, writer briefs, AEO question maps, Search Console monitoring.
Personal voice, blog posts, and voice evaluation live in [ghostwriter](https://github.com/mblode/ghostwriter).
### Quality
- **[ax-audit](./skills/ax-audit/SKILL.md)**: Agentic experience audit: 27 rules for tool parity, approval gates, and escape hatches, ship verdict.
- **[dx-audit](./skills/dx-audit/SKILL.md)**: Libraries, CLIs, SDKs, npm packages: 38 rules, agent-friendly checks, root-cause findings.
- **[typography-audit](./skills/typography-audit/SKILL.md)**: 78 rules: punctuation, fonts, sizing, spacing, hierarchy, pairing.
- **[optimise-seo](./skills/optimise-seo/SKILL.md)**: Next.js App Router SEO: sitemaps, metadata, structured data, redirects, hreflang, AI-crawler policy, Core Web Vitals.
### Shipping
- **[planning](./skills/planning/SKILL.md)**: Writes and reviews executable plans with repository evidence, vertical slices, and explicit acceptance criteria.
- **[pr-reviewer](./skills/pr-reviewer/SKILL.md)**: Read-only diff review: bugs, structure, AI slop, security.
- **[tidy](./skills/tidy/SKILL.md)**: Applies diff-scoped simplifications, preserving necessary guards and existing edits.
- **[pr-creator](./skills/pr-creator/SKILL.md)**: PRs with short human descriptions, Linear IDs, templates, drafts, tidied commits.
- **[pr-babysitter](./skills/pr-babysitter/SKILL.md)**: Watches an open PR: conflicts, CI, comments. Fixes what it can.
- **[autoship](./skills/autoship/SKILL.md)**: npm releases with changesets: fix loop, CI watch, Version Packages merge, OIDC publish verify.
### Authoring
- **[agents-md](./skills/agents-md/SKILL.md)**: Wires a repo so Claude Code, Codex and Cursor read the same instructions, then audits and refactors AGENTS.md and CLAUDE.md, with grades.
- **[agent-skills-creator](./skills/agent-skills-creator/SKILL.md)**: Creates and audits skills by their added value, with portable workflows, a validator, and regression scenarios.
- **[save-md](./skills/save-md/SKILL.md)**: Writes a named source as a markdown file the next turn can reread.
## Maintaining the collection
Skills retain house preferences, operational contracts, and repeatable audit rubrics. Generic coaching belongs to the model and host. Every skill includes authored regression scenarios; these are not claims of measured improvement across models.
Run `skills/agent-skills-creator/scripts/validate.sh --all` for portable format requirements and separate house conventions covering references, counts, and scenario structure. Authoring follows the [Agent Skills specification](https://agentskills.io/specification) and [best practices](https://agentskills.io/skill-creation/best-practices). The [collection audit](./maintenance/2026-09-05-skill-audit.md) records changes, retained value, and verification limits.
## License
MIT
---
Crafted by [<img src="https://blode.co/avatar-circle.png" width="20" align="top" />](https://blode.co) [Matthew Blode](https://blode.co)
## Company identity and copy
Branding, copywriting, and product judgment now live in the separate [Brandwriter repository](https://github.com/mblode/brandwriter). It maintains company identity kits and reads company profiles independently of personal Ghostwriter profiles. Install with `npx skills add mblode/brandwriter --agent codex claude-code -y` (repository access required).