design-agent-skills 1.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +380 -0
- package/VERSION +1 -0
- package/bin/cli.mjs +45 -0
- package/bootstrap.sh +32 -0
- package/install.sh +689 -0
- package/package.json +36 -0
- package/skills/accessibility-agents/SKILL.md +52 -0
- package/skills/accessibility-agents/stub.yaml +5 -0
- package/skills/accessibility-catalogue/SKILL.md +45 -0
- package/skills/accessibility-catalogue/stub.yaml +3 -0
- package/skills/addyosmani-quality/SKILL.md +72 -0
- package/skills/addyosmani-quality/stub.yaml +6 -0
- package/skills/ai-graphic-design-skill/SKILL.md +65 -0
- package/skills/ai-graphic-design-skill/stub.yaml +5 -0
- package/skills/algorithmic-art/SKILL.md +59 -0
- package/skills/algorithmic-art/stub.yaml +5 -0
- package/skills/animate-css-skill/SKILL.md +55 -0
- package/skills/animate-css-skill/stub.yaml +5 -0
- package/skills/animate-skill/SKILL.md +64 -0
- package/skills/animate-skill/stub.yaml +5 -0
- package/skills/anthropics-skills/SKILL.md +72 -0
- package/skills/anthropics-skills/stub.yaml +12 -0
- package/skills/antvis-chart-skills/SKILL.md +61 -0
- package/skills/antvis-chart-skills/stub.yaml +6 -0
- package/skills/apple-hig-skills/SKILL.md +66 -0
- package/skills/apple-hig-skills/stub.yaml +6 -0
- package/skills/baseline-ui/SKILL.md +54 -0
- package/skills/baseline-ui/stub.yaml +5 -0
- package/skills/bencium-ux-designer/SKILL.md +54 -0
- package/skills/bencium-ux-designer/stub.yaml +5 -0
- package/skills/brand-design-md/SKILL.md +65 -0
- package/skills/brand-design-md/stub.yaml +5 -0
- package/skills/callstack-agent-skills/SKILL.md +56 -0
- package/skills/callstack-agent-skills/stub.yaml +6 -0
- package/skills/cc-slidev/SKILL.md +54 -0
- package/skills/cc-slidev/stub.yaml +5 -0
- package/skills/claud3/SKILL.md +54 -0
- package/skills/claud3/stub.yaml +5 -0
- package/skills/claude-pm-skills/SKILL.md +53 -0
- package/skills/claude-pm-skills/stub.yaml +5 -0
- package/skills/claude-wireframe-skill/SKILL.md +63 -0
- package/skills/claude-wireframe-skill/stub.yaml +5 -0
- package/skills/claude2figma/SKILL.md +54 -0
- package/skills/claude2figma/stub.yaml +5 -0
- package/skills/claudedesignskills/SKILL.md +59 -0
- package/skills/claudedesignskills/stub.yaml +5 -0
- package/skills/cloudai-threejs/SKILL.md +51 -0
- package/skills/cloudai-threejs/stub.yaml +6 -0
- package/skills/cloudflare-web-perf/SKILL.md +60 -0
- package/skills/cloudflare-web-perf/stub.yaml +5 -0
- package/skills/color-expert/SKILL.md +62 -0
- package/skills/color-expert/stub.yaml +5 -0
- package/skills/composio-artifacts/SKILL.md +63 -0
- package/skills/composio-artifacts/stub.yaml +5 -0
- package/skills/content-catalogue/SKILL.md +105 -0
- package/skills/content-catalogue/stub.yaml +3 -0
- package/skills/coreyhaines-marketing/SKILL.md +59 -0
- package/skills/coreyhaines-marketing/stub.yaml +6 -0
- package/skills/creative-director/SKILL.md +60 -0
- package/skills/creative-director/stub.yaml +5 -0
- package/skills/css-animation-skill/SKILL.md +63 -0
- package/skills/css-animation-skill/stub.yaml +5 -0
- package/skills/d3js-skill/SKILL.md +58 -0
- package/skills/d3js-skill/stub.yaml +5 -0
- package/skills/data-analysis-skill/SKILL.md +64 -0
- package/skills/data-analysis-skill/stub.yaml +5 -0
- package/skills/data-viz-agent/SKILL.md +60 -0
- package/skills/data-viz-agent/stub.yaml +5 -0
- package/skills/deanpeters-pm-skills/SKILL.md +76 -0
- package/skills/deanpeters-pm-skills/stub.yaml +6 -0
- package/skills/design-auditor/SKILL.md +62 -0
- package/skills/design-auditor/stub.yaml +5 -0
- package/skills/design-brief/SKILL.md +58 -0
- package/skills/design-brief/stub.yaml +5 -0
- package/skills/design-catalogue/SKILL.md +346 -0
- package/skills/design-catalogue/stub.yaml +3 -0
- package/skills/design-consultation/SKILL.md +58 -0
- package/skills/design-consultation/stub.yaml +5 -0
- package/skills/design-engineering-catalogue/SKILL.md +92 -0
- package/skills/design-engineering-catalogue/stub.yaml +3 -0
- package/skills/design-for-ai/SKILL.md +58 -0
- package/skills/design-for-ai/stub.yaml +5 -0
- package/skills/design-html/SKILL.md +59 -0
- package/skills/design-html/stub.yaml +5 -0
- package/skills/design-lab/SKILL.md +54 -0
- package/skills/design-lab/stub.yaml +5 -0
- package/skills/design-review-garrytan/SKILL.md +58 -0
- package/skills/design-review-garrytan/stub.yaml +5 -0
- package/skills/design-tokens-skill/SKILL.md +68 -0
- package/skills/design-tokens-skill/stub.yaml +5 -0
- package/skills/design-with-claude/SKILL.md +51 -0
- package/skills/design-with-claude/stub.yaml +5 -0
- package/skills/designer-skills/SKILL.md +52 -0
- package/skills/designer-skills/stub.yaml +5 -0
- package/skills/digidai-pm/SKILL.md +60 -0
- package/skills/digidai-pm/stub.yaml +5 -0
- package/skills/distinctive-frontend/SKILL.md +55 -0
- package/skills/distinctive-frontend/stub.yaml +5 -0
- package/skills/email-html-mjml/SKILL.md +54 -0
- package/skills/email-html-mjml/stub.yaml +5 -0
- package/skills/emilkowalski-skill/SKILL.md +60 -0
- package/skills/emilkowalski-skill/stub.yaml +7 -0
- package/skills/excalidraw-agents365/SKILL.md +56 -0
- package/skills/excalidraw-agents365/stub.yaml +5 -0
- package/skills/excalidraw-diagram/SKILL.md +58 -0
- package/skills/excalidraw-diagram/stub.yaml +5 -0
- package/skills/expo-skills/SKILL.md +56 -0
- package/skills/expo-skills/stub.yaml +21 -0
- package/skills/extract-design-md/SKILL.md +58 -0
- package/skills/extract-design-md/stub.yaml +5 -0
- package/skills/extract-design-system/SKILL.md +53 -0
- package/skills/extract-design-system/stub.yaml +5 -0
- package/skills/fal-ai-skills/SKILL.md +56 -0
- package/skills/fal-ai-skills/stub.yaml +6 -0
- package/skills/figma-catalogue/SKILL.md +57 -0
- package/skills/figma-catalogue/stub.yaml +3 -0
- package/skills/figma-official-skills/SKILL.md +80 -0
- package/skills/figma-official-skills/stub.yaml +6 -0
- package/skills/figma-skill/SKILL.md +52 -0
- package/skills/figma-skill/stub.yaml +5 -0
- package/skills/figma-variables-tokens-generator/SKILL.md +54 -0
- package/skills/figma-variables-tokens-generator/stub.yaml +5 -0
- package/skills/fixing-accessibility/SKILL.md +54 -0
- package/skills/fixing-accessibility/stub.yaml +5 -0
- package/skills/fixing-motion-performance/SKILL.md +54 -0
- package/skills/fixing-motion-performance/stub.yaml +5 -0
- package/skills/framer-motion-skills/SKILL.md +55 -0
- package/skills/framer-motion-skills/stub.yaml +5 -0
- package/skills/frontend-design/SKILL.md +65 -0
- package/skills/frontend-design/stub.yaml +5 -0
- package/skills/frontend-slides/SKILL.md +59 -0
- package/skills/frontend-slides/stub.yaml +5 -0
- package/skills/generative-media-skills/SKILL.md +56 -0
- package/skills/generative-media-skills/stub.yaml +4 -0
- package/skills/google-fonts-skill/SKILL.md +69 -0
- package/skills/google-fonts-skill/stub.yaml +4 -0
- package/skills/google-stitch-skills/SKILL.md +71 -0
- package/skills/google-stitch-skills/stub.yaml +6 -0
- package/skills/gsap-skills/SKILL.md +55 -0
- package/skills/gsap-skills/stub.yaml +5 -0
- package/skills/guizang-ppt/SKILL.md +58 -0
- package/skills/guizang-ppt/stub.yaml +5 -0
- package/skills/hand-drawn-diagrams/SKILL.md +57 -0
- package/skills/hand-drawn-diagrams/stub.yaml +5 -0
- package/skills/hig-doctor/SKILL.md +59 -0
- package/skills/hig-doctor/stub.yaml +6 -0
- package/skills/huashu-design/SKILL.md +64 -0
- package/skills/huashu-design/stub.yaml +5 -0
- package/skills/hyperframes/SKILL.md +60 -0
- package/skills/hyperframes/stub.yaml +5 -0
- package/skills/impeccable/SKILL.md +75 -0
- package/skills/impeccable/stub.yaml +8 -0
- package/skills/ink-google/SKILL.md +58 -0
- package/skills/ink-google/stub.yaml +5 -0
- package/skills/interface-design-dammyjay/SKILL.md +55 -0
- package/skills/interface-design-dammyjay/stub.yaml +5 -0
- package/skills/liquid-glass-skill/SKILL.md +54 -0
- package/skills/liquid-glass-skill/stub.yaml +5 -0
- package/skills/logo-designer-skill/SKILL.md +56 -0
- package/skills/logo-designer-skill/stub.yaml +5 -0
- package/skills/make-interfaces-better/SKILL.md +60 -0
- package/skills/make-interfaces-better/stub.yaml +5 -0
- package/skills/markdown-viewer-skills/SKILL.md +70 -0
- package/skills/markdown-viewer-skills/stub.yaml +6 -0
- package/skills/marp-slide-quality/SKILL.md +63 -0
- package/skills/marp-slide-quality/stub.yaml +5 -0
- package/skills/marp-slides/SKILL.md +63 -0
- package/skills/marp-slides/stub.yaml +5 -0
- package/skills/mastepanoski-skills/SKILL.md +52 -0
- package/skills/mastepanoski-skills/stub.yaml +5 -0
- package/skills/microsoft-skills/SKILL.md +51 -0
- package/skills/microsoft-skills/stub.yaml +6 -0
- package/skills/mobile-app-design/SKILL.md +67 -0
- package/skills/mobile-app-design/stub.yaml +5 -0
- package/skills/mobile-app-ui-design/SKILL.md +65 -0
- package/skills/mobile-app-ui-design/stub.yaml +5 -0
- package/skills/motion-catalogue/SKILL.md +69 -0
- package/skills/motion-catalogue/stub.yaml +3 -0
- package/skills/motion-design-skill/SKILL.md +55 -0
- package/skills/motion-design-skill/stub.yaml +5 -0
- package/skills/nanobanan-ppt/SKILL.md +64 -0
- package/skills/nanobanan-ppt/stub.yaml +5 -0
- package/skills/neo-user-journey/SKILL.md +62 -0
- package/skills/neo-user-journey/stub.yaml +5 -0
- package/skills/nimbalyst-skills/SKILL.md +59 -0
- package/skills/nimbalyst-skills/stub.yaml +7 -0
- package/skills/open-design/SKILL.md +55 -0
- package/skills/open-design/stub.yaml +4 -0
- package/skills/openai-skills/SKILL.md +67 -0
- package/skills/openai-skills/stub.yaml +6 -0
- package/skills/p5js-hermes/SKILL.md +62 -0
- package/skills/p5js-hermes/stub.yaml +5 -0
- package/skills/phuryn-pm-skills/SKILL.md +56 -0
- package/skills/phuryn-pm-skills/stub.yaml +6 -0
- package/skills/plan-design-review/SKILL.md +58 -0
- package/skills/plan-design-review/stub.yaml +5 -0
- package/skills/platform-design-skills/SKILL.md +52 -0
- package/skills/platform-design-skills/stub.yaml +6 -0
- package/skills/pm-skills/SKILL.md +55 -0
- package/skills/pm-skills/stub.yaml +5 -0
- package/skills/react-doctor/SKILL.md +55 -0
- package/skills/react-doctor/stub.yaml +5 -0
- package/skills/remotion/SKILL.md +59 -0
- package/skills/remotion/stub.yaml +5 -0
- package/skills/revealjs-skill/SKILL.md +54 -0
- package/skills/revealjs-skill/stub.yaml +5 -0
- package/skills/shadcn-ui/SKILL.md +54 -0
- package/skills/shadcn-ui/stub.yaml +5 -0
- package/skills/shader-dev/SKILL.md +60 -0
- package/skills/shader-dev/stub.yaml +5 -0
- package/skills/simota-agent-skills/SKILL.md +53 -0
- package/skills/simota-agent-skills/stub.yaml +5 -0
- package/skills/sleek-design-mobile-apps/SKILL.md +56 -0
- package/skills/sleek-design-mobile-apps/stub.yaml +4 -0
- package/skills/slidev-skill/SKILL.md +54 -0
- package/skills/slidev-skill/stub.yaml +5 -0
- package/skills/softaworks-agent-toolkit/SKILL.md +58 -0
- package/skills/softaworks-agent-toolkit/stub.yaml +6 -0
- package/skills/software-mansion-skills/SKILL.md +63 -0
- package/skills/software-mansion-skills/stub.yaml +11 -0
- package/skills/superdesign-skill/SKILL.md +53 -0
- package/skills/superdesign-skill/stub.yaml +4 -0
- package/skills/swiftui-claude-skills/SKILL.md +54 -0
- package/skills/swiftui-claude-skills/stub.yaml +5 -0
- package/skills/swiftui-patterns/SKILL.md +54 -0
- package/skills/swiftui-patterns/stub.yaml +5 -0
- package/skills/taste-design-stitch/SKILL.md +58 -0
- package/skills/taste-design-stitch/stub.yaml +5 -0
- package/skills/taste-skill/SKILL.md +74 -0
- package/skills/taste-skill/stub.yaml +5 -0
- package/skills/threejs-claude-skill-package/SKILL.md +54 -0
- package/skills/threejs-claude-skill-package/stub.yaml +5 -0
- package/skills/threejs-ecs-ts/SKILL.md +54 -0
- package/skills/threejs-ecs-ts/stub.yaml +5 -0
- package/skills/tui-design-skill/SKILL.md +56 -0
- package/skills/tui-design-skill/stub.yaml +5 -0
- package/skills/ui-craft/SKILL.md +58 -0
- package/skills/ui-craft/stub.yaml +5 -0
- package/skills/ui-ux-pro-max/SKILL.md +64 -0
- package/skills/ui-ux-pro-max/stub.yaml +7 -0
- package/skills/ux-designer-skill/SKILL.md +62 -0
- package/skills/ux-designer-skill/stub.yaml +5 -0
- package/skills/ux-ui-mastery/SKILL.md +53 -0
- package/skills/ux-ui-mastery/stub.yaml +5 -0
- package/skills/vercel-skills/SKILL.md +65 -0
- package/skills/vercel-skills/stub.yaml +6 -0
- package/skills/wcag-ai-skill/SKILL.md +52 -0
- package/skills/wcag-ai-skill/stub.yaml +5 -0
- package/skills/wcag-audit-patterns/SKILL.md +53 -0
- package/skills/wcag-audit-patterns/stub.yaml +5 -0
- package/skills/webgpu-claude-skill/SKILL.md +54 -0
- package/skills/webgpu-claude-skill/stub.yaml +5 -0
- package/skills/wiggle-claude-skill/SKILL.md +63 -0
- package/skills/wiggle-claude-skill/stub.yaml +5 -0
- package/skills/wireframe-skill/SKILL.md +63 -0
- package/skills/wireframe-skill/stub.yaml +5 -0
- package/skills/wireframer/SKILL.md +59 -0
- package/skills/wireframer/stub.yaml +5 -0
- package/skills/wondelai-skills/SKILL.md +57 -0
- package/skills/wondelai-skills/stub.yaml +11 -0
- package/skills/work-with-design-systems/SKILL.md +67 -0
- package/skills/work-with-design-systems/stub.yaml +5 -0
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: claudedesignskills
|
|
3
|
+
description: |
|
|
4
|
+
22-skill package across 5 bundles covering Three.js, GSAP ScrollTrigger, React Three
|
|
5
|
+
Fiber, Framer Motion, Babylon.js, A-Frame, PixiJS, Locomotive Scroll, Barba.js, React
|
|
6
|
+
Spring, Magic UI, AOS, Anime.js, Lottie, Rive, Spline, and Blender pipeline. The
|
|
7
|
+
broadest motion/creative suite available.
|
|
8
|
+
triggers:
|
|
9
|
+
- "claudedesignskills"
|
|
10
|
+
- "Babylon.js"
|
|
11
|
+
- "A-Frame"
|
|
12
|
+
- "PixiJS"
|
|
13
|
+
- "React Spring"
|
|
14
|
+
- "Locomotive Scroll"
|
|
15
|
+
- "Spine"
|
|
16
|
+
- "Rive"
|
|
17
|
+
das:
|
|
18
|
+
type: package
|
|
19
|
+
category: motion-animation
|
|
20
|
+
upstream: "https://github.com/freshtechbro/claudedesignskills"
|
|
21
|
+
version: latest
|
|
22
|
+
install: false
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
# claudedesignskills
|
|
26
|
+
|
|
27
|
+
> Catalogue stub — full package: [freshtechbro/claudedesignskills](https://github.com/freshtechbro/claudedesignskills)
|
|
28
|
+
|
|
29
|
+
## Decision tree
|
|
30
|
+
|
|
31
|
+
1. **Is the package already installed?**
|
|
32
|
+
Check: your agent's skills directory contains `claudedesignskills` with content beyond this stub.
|
|
33
|
+
- Yes → invoke `claudedesignskills` and proceed
|
|
34
|
+
- No → go to step 2
|
|
35
|
+
|
|
36
|
+
2. **Which agent are you on?**
|
|
37
|
+
- Claude Code → `/plugin marketplace add freshtechbro/claudedesignskills`
|
|
38
|
+
- Cursor → `/plugin marketplace add freshtechbro/claudedesignskills`
|
|
39
|
+
- Other → `/plugin marketplace add freshtechbro/claudedesignskills` or see [GitHub README](https://github.com/freshtechbro/claudedesignskills)
|
|
40
|
+
|
|
41
|
+
## Install command
|
|
42
|
+
|
|
43
|
+
```bash
|
|
44
|
+
/plugin marketplace add freshtechbro/claudedesignskills
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
## Invoke after install
|
|
48
|
+
|
|
49
|
+
- Skill name: `claudedesignskills`
|
|
50
|
+
- Trigger phrases: "claudedesignskills", "Babylon.js", "A-Frame", "PixiJS", "React Spring", "Locomotive Scroll", "Rive"
|
|
51
|
+
|
|
52
|
+
## What it does
|
|
53
|
+
|
|
54
|
+
The broadest motion and creative coding skill suite available — 22 individual skills organised across 5 bundles. Covers: Three.js 3D scenes, GSAP ScrollTrigger, React Three Fiber, Framer Motion, Babylon.js game/XR rendering, A-Frame WebXR, PixiJS 2D WebGL, Locomotive Scroll smooth scrolling, Barba.js page transitions, React Spring physics-based animation, Magic UI component animations, AOS (Animate On Scroll), Anime.js, Lottie playback, Rive interactive animation, Spline 3D, and a Blender-to-web pipeline. Use this package when a project spans multiple animation frameworks or when you're unsure which toolchain will be needed.
|
|
55
|
+
|
|
56
|
+
## When NOT to use
|
|
57
|
+
|
|
58
|
+
- When you only need one framework — use its dedicated skill instead (`gsap-skills`, `framer-motion-skills`, etc.) for a lighter footprint
|
|
59
|
+
- Backend or non-visual work
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: cloudai-threejs
|
|
3
|
+
description: |
|
|
4
|
+
Three.js skills for creating interactive 3D elements and experiences on the web.
|
|
5
|
+
Covers scene setup, geometries, materials, lighting, cameras, animations,
|
|
6
|
+
and WebGL rendering best practices.
|
|
7
|
+
triggers:
|
|
8
|
+
- "Three.js"
|
|
9
|
+
- "threejs"
|
|
10
|
+
- "3D web"
|
|
11
|
+
- "WebGL 3D"
|
|
12
|
+
- "3D scene"
|
|
13
|
+
- "3D animation"
|
|
14
|
+
das:
|
|
15
|
+
category: creative-3d
|
|
16
|
+
upstream: "https://github.com/CloudAI-X/threejs-skills"
|
|
17
|
+
version: latest
|
|
18
|
+
install: false
|
|
19
|
+
---
|
|
20
|
+
|
|
21
|
+
# cloudai-threejs
|
|
22
|
+
|
|
23
|
+
> Catalogue stub — full package: [CloudAI-X/threejs-skills](https://github.com/CloudAI-X/threejs-skills)
|
|
24
|
+
|
|
25
|
+
## Decision tree
|
|
26
|
+
|
|
27
|
+
Run this before any Three.js or 3D web development:
|
|
28
|
+
|
|
29
|
+
1. **Is the Three.js skill already installed?**
|
|
30
|
+
Check: `~/.design-agent-skills/skills/threejs/SKILL.md` exists.
|
|
31
|
+
- Yes → invoke `threejs` and proceed
|
|
32
|
+
- No → go to step 2
|
|
33
|
+
|
|
34
|
+
2. **Do you have shell access?**
|
|
35
|
+
- Yes → run the install command below, then invoke the skill
|
|
36
|
+
- No → show the user the install command, ask them to run it, then proceed once confirmed
|
|
37
|
+
|
|
38
|
+
## Install command
|
|
39
|
+
|
|
40
|
+
```bash
|
|
41
|
+
npx skills add CloudAI-X/threejs-skills
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Invoke after install
|
|
45
|
+
|
|
46
|
+
- Skill name: check installed skill names with `ls ~/.design-agent-skills/skills/`
|
|
47
|
+
- Trigger phrases: "Three.js", "3D web", "WebGL 3D", "3D scene"
|
|
48
|
+
|
|
49
|
+
## What it does
|
|
50
|
+
|
|
51
|
+
Three.js skill suite for building interactive 3D elements and experiences on the web. Covers the complete Three.js pipeline: scene and renderer setup, geometries and materials, lighting rigs, camera controls, object animations, and WebGL performance best practices. Use for product visualizations, interactive backgrounds, and immersive web experiences.
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: cloudflare-web-perf
|
|
3
|
+
description: |
|
|
4
|
+
Audit Core Web Vitals and render-blocking resources. Official Cloudflare skill
|
|
5
|
+
for identifying and fixing LCP, INP, CLS, TTFB issues with Cloudflare-specific
|
|
6
|
+
optimization strategies.
|
|
7
|
+
triggers:
|
|
8
|
+
- "web performance"
|
|
9
|
+
- "Core Web Vitals"
|
|
10
|
+
- "LCP"
|
|
11
|
+
- "CLS"
|
|
12
|
+
- "INP"
|
|
13
|
+
- "render blocking"
|
|
14
|
+
- "cloudflare performance"
|
|
15
|
+
das:
|
|
16
|
+
category: accessibility-quality
|
|
17
|
+
upstream: "https://github.com/cloudflare/skills"
|
|
18
|
+
upstream_path: "skills/web-perf/SKILL.md"
|
|
19
|
+
version: latest
|
|
20
|
+
install: true
|
|
21
|
+
---
|
|
22
|
+
|
|
23
|
+
# cloudflare-web-perf
|
|
24
|
+
|
|
25
|
+
> Catalogue stub — full skill: [cloudflare/skills](https://github.com/cloudflare/skills/blob/main/skills/web-perf/SKILL.md)
|
|
26
|
+
|
|
27
|
+
## Decision tree
|
|
28
|
+
|
|
29
|
+
1. **Is the full skill already installed?**
|
|
30
|
+
Check whether the skill at this location still has a `das:` block:
|
|
31
|
+
- Global: `grep -q "^das:" ~/.agents/skills/cloudflare-web-perf/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
32
|
+
- Project: `grep -q "^das:" .agents/skills/cloudflare-web-perf/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
33
|
+
- No `das:` block → full skill installed, invoke it and proceed
|
|
34
|
+
- `das:` block present → go to step 2
|
|
35
|
+
|
|
36
|
+
2. **Detect scope, then install:**
|
|
37
|
+
|
|
38
|
+
To detect scope:
|
|
39
|
+
```bash
|
|
40
|
+
[ -e ~/.agents/skills/cloudflare-web-perf ] && echo "global" || echo "project"
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
**Global** (installed with `-g`):
|
|
44
|
+
```bash
|
|
45
|
+
npx skills add cloudflare/skills --skill cloudflare-web-perf -g -y
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
**Project** (installed without `-g`):
|
|
49
|
+
```bash
|
|
50
|
+
npx skills add cloudflare/skills --skill cloudflare-web-perf -y
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## Invoke after install
|
|
54
|
+
|
|
55
|
+
- Skill name: `cloudflare-web-perf`
|
|
56
|
+
- Trigger phrases: "web performance", "Core Web Vitals", "LCP", "CLS", "render blocking"
|
|
57
|
+
|
|
58
|
+
## What it does
|
|
59
|
+
|
|
60
|
+
Official Cloudflare skill for auditing and fixing Core Web Vitals — LCP (Largest Contentful Paint), INP (Interaction to Next Paint), CLS (Cumulative Layout Shift), and TTFB. Identifies render-blocking resources, unoptimized images, and layout instability causes. Includes Cloudflare-specific fixes using Workers, Cache Rules, and Image Optimization.
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: color-expert
|
|
3
|
+
description: |
|
|
4
|
+
286K words of color science applied to UI/UX design. Covers OKLCH/OKLAB color spaces,
|
|
5
|
+
palette generation, accessibility contrast ratios, color naming, pigment mixing,
|
|
6
|
+
and historical color theory. By meodai, creator of color-names.
|
|
7
|
+
triggers:
|
|
8
|
+
- "color expert"
|
|
9
|
+
- "colour expert"
|
|
10
|
+
- "OKLCH"
|
|
11
|
+
- "OKLAB"
|
|
12
|
+
- "color palette"
|
|
13
|
+
- "colour palette"
|
|
14
|
+
- "color science"
|
|
15
|
+
- "color theory"
|
|
16
|
+
- "contrast ratio"
|
|
17
|
+
das:
|
|
18
|
+
category: visual-components
|
|
19
|
+
upstream: "https://github.com/meodai/skill.color-expert"
|
|
20
|
+
upstream_path: "SKILL.md"
|
|
21
|
+
version: latest
|
|
22
|
+
install: true
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
# color-expert
|
|
26
|
+
|
|
27
|
+
> Catalogue stub — full skill: [meodai/skill.color-expert](https://github.com/meodai/skill.color-expert)
|
|
28
|
+
|
|
29
|
+
## Decision tree
|
|
30
|
+
|
|
31
|
+
1. **Is the full skill already installed?**
|
|
32
|
+
Check whether the skill at this location still has a `das:` block:
|
|
33
|
+
- Global: `grep -q "^das:" ~/.agents/skills/color-expert/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
34
|
+
- Project: `grep -q "^das:" .agents/skills/color-expert/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
35
|
+
- No `das:` block → full skill installed, invoke it and proceed
|
|
36
|
+
- `das:` block present → go to step 2
|
|
37
|
+
|
|
38
|
+
2. **Detect scope, then install:**
|
|
39
|
+
|
|
40
|
+
To detect scope:
|
|
41
|
+
```bash
|
|
42
|
+
[ -e ~/.agents/skills/color-expert ] && echo "global" || echo "project"
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
**Global** (installed with `-g`):
|
|
46
|
+
```bash
|
|
47
|
+
npx skills add meodai/skill.color-expert --skill color-expert -g -y
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
**Project** (installed without `-g`):
|
|
51
|
+
```bash
|
|
52
|
+
npx skills add meodai/skill.color-expert --skill color-expert -y
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
## Invoke after install
|
|
56
|
+
|
|
57
|
+
- Skill name: `color-expert`
|
|
58
|
+
- Trigger phrases: "color expert", "OKLCH", "color palette", "color science", "contrast ratio"
|
|
59
|
+
|
|
60
|
+
## What it does
|
|
61
|
+
|
|
62
|
+
Brings 286K words of color science into design decisions. Covers perceptually uniform color spaces (OKLCH, OKLAB), palette generation algorithms, WCAG accessibility contrast, color naming conventions, pigment mixing theory, and the history of color in art and design. Ideal for building color systems, choosing palettes with correct contrast, or understanding why certain color combinations feel wrong.
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: composio-artifacts
|
|
3
|
+
description: |
|
|
4
|
+
Build interactive Claude artifacts with Composio tools. Connects artifacts to
|
|
5
|
+
real external services (GitHub, Slack, Linear, Notion) via Composio's 250+
|
|
6
|
+
tool integrations. Requires a Composio account and API key.
|
|
7
|
+
triggers:
|
|
8
|
+
- "composio artifacts"
|
|
9
|
+
- "interactive artifact"
|
|
10
|
+
- "artifact with tools"
|
|
11
|
+
- "artifact with GitHub"
|
|
12
|
+
- "composio"
|
|
13
|
+
das:
|
|
14
|
+
category: official-suites
|
|
15
|
+
upstream: "https://github.com/ComposioHQ/awesome-claude-skills"
|
|
16
|
+
upstream_path: "artifacts-builder/SKILL.md"
|
|
17
|
+
version: master
|
|
18
|
+
install: true
|
|
19
|
+
---
|
|
20
|
+
|
|
21
|
+
# composio-artifacts
|
|
22
|
+
|
|
23
|
+
> Catalogue stub — full skill: [ComposioHQ/awesome-claude-skills](https://github.com/ComposioHQ/awesome-claude-skills/blob/master/artifacts-builder/SKILL.md)
|
|
24
|
+
|
|
25
|
+
## Decision tree
|
|
26
|
+
|
|
27
|
+
1. **Is the full skill already installed?**
|
|
28
|
+
Check whether the skill at this location still has a `das:` block:
|
|
29
|
+
- Global: `grep -q "^das:" ~/.agents/skills/composio-artifacts/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
30
|
+
- Project: `grep -q "^das:" .agents/skills/composio-artifacts/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
31
|
+
- No `das:` block → full skill installed, invoke it and proceed
|
|
32
|
+
- `das:` block present → go to step 2
|
|
33
|
+
|
|
34
|
+
2. **Detect scope, then install:**
|
|
35
|
+
|
|
36
|
+
To detect scope:
|
|
37
|
+
```bash
|
|
38
|
+
[ -e ~/.agents/skills/composio-artifacts ] && echo "global" || echo "project"
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
**Global** (installed with `-g`):
|
|
42
|
+
```bash
|
|
43
|
+
npx skills add ComposioHQ/awesome-claude-skills --skill composio-artifacts -g -y
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
**Project** (installed without `-g`):
|
|
47
|
+
```bash
|
|
48
|
+
npx skills add ComposioHQ/awesome-claude-skills --skill composio-artifacts -y
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## Invoke after install
|
|
52
|
+
|
|
53
|
+
- Skill name: `composio-artifacts`
|
|
54
|
+
- Trigger phrases: "composio artifacts", "interactive artifact", "artifact with GitHub"
|
|
55
|
+
|
|
56
|
+
## What it does
|
|
57
|
+
|
|
58
|
+
Builds Claude artifacts that interact with real external services via Composio's 250+ tool integrations. Artifacts can read/write GitHub issues, send Slack messages, update Linear tickets, query Notion databases — all from within a Claude artifact. Requires a Composio account and `COMPOSIO_API_KEY` configured.
|
|
59
|
+
|
|
60
|
+
## When NOT to use
|
|
61
|
+
|
|
62
|
+
- Static artifacts with no external service interaction
|
|
63
|
+
- When you don't have a Composio account
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: content-catalogue
|
|
3
|
+
description: |
|
|
4
|
+
Domain navigator for presentations, diagrams, wireframes, data visualization,
|
|
5
|
+
design review, product strategy, and communication design skills. Routes to
|
|
6
|
+
the right skill for slides, charts, UX strategy, PM frameworks, and email.
|
|
7
|
+
triggers:
|
|
8
|
+
- "presentation skills"
|
|
9
|
+
- "slides skill"
|
|
10
|
+
- "diagram skills"
|
|
11
|
+
- "wireframe skills"
|
|
12
|
+
- "data visualization skills"
|
|
13
|
+
- "PM skills"
|
|
14
|
+
- "product skills"
|
|
15
|
+
- "design review skills"
|
|
16
|
+
- "UX strategy skills"
|
|
17
|
+
- "email design skills"
|
|
18
|
+
---
|
|
19
|
+
|
|
20
|
+
# content-catalogue
|
|
21
|
+
|
|
22
|
+
Domain navigator for presentations, diagrams, data viz, design review, strategy, and PM skills.
|
|
23
|
+
Activate when the user asks for a skill in communicating design or managing product decisions.
|
|
24
|
+
|
|
25
|
+
→ For the full catalogue across all domains: use `design-catalogue`.
|
|
26
|
+
|
|
27
|
+
## When to use
|
|
28
|
+
|
|
29
|
+
Activate when the user:
|
|
30
|
+
- Needs to create slides, presentations, or pitch decks
|
|
31
|
+
- Wants wireframes, diagrams, or flowcharts
|
|
32
|
+
- Needs data visualization or chart generation
|
|
33
|
+
- Asks about design review, critique, or UX strategy
|
|
34
|
+
- Needs PM frameworks, PRD templates, or product strategy tools
|
|
35
|
+
|
|
36
|
+
## Presentations & Slides
|
|
37
|
+
|
|
38
|
+
| Skill | Best for |
|
|
39
|
+
|-------|----------|
|
|
40
|
+
| [`nanobanan-ppt`](../nanobanan-ppt/SKILL.md) | AI-powered PPT with document analysis and image generation |
|
|
41
|
+
| [`guizang-ppt`](../guizang-ppt/SKILL.md) | Structured PowerPoint from outline (no API deps) |
|
|
42
|
+
| [`frontend-slides`](../frontend-slides/SKILL.md) | Animation-rich HTML presentations |
|
|
43
|
+
| [`revealjs-skill`](../revealjs-skill/SKILL.md) | Reveal.js: themes, Chart.js, speaker notes, PDF export |
|
|
44
|
+
| [`marp-slides`](../marp-slides/SKILL.md) | MARP + 22 example decks, SVG charts, dashboard components |
|
|
45
|
+
| [`slidev-skill`](../slidev-skill/SKILL.md) | Official Slidev: developer presentations in Markdown with Vue + animations |
|
|
46
|
+
| [`cc-slidev`](../cc-slidev/SKILL.md) | Slidev plugin with evidence-based design guardrails for tech talks |
|
|
47
|
+
| [`marp-slide-quality`](../marp-slide-quality/SKILL.md) | SlideGauge scoring: overflow, contrast, density checks before render |
|
|
48
|
+
|
|
49
|
+
## Diagrams & Wireframing
|
|
50
|
+
|
|
51
|
+
| Skill | Best for |
|
|
52
|
+
|-------|----------|
|
|
53
|
+
| [`excalidraw-diagram`](../excalidraw-diagram/SKILL.md) | Excalidraw with visual validation loop (3.2k stars) |
|
|
54
|
+
| [`hand-drawn-diagrams`](../hand-drawn-diagrams/SKILL.md) | Quick hand-drawn sketch diagrams |
|
|
55
|
+
| [`excalidraw-agents365`](../excalidraw-agents365/SKILL.md) | Excalidraw tuned for coding agent workflows |
|
|
56
|
+
| [`wireframer`](../wireframer/SKILL.md) | Low-fidelity wireframes, structure-first |
|
|
57
|
+
| [`softaworks-agent-toolkit`](../softaworks-agent-toolkit/SKILL.md) | 40+ skills: mermaid, excalidraw, draw-io, C4, marp |
|
|
58
|
+
| [`nimbalyst-skills`](../nimbalyst-skills/SKILL.md) | Excalidraw with MCP tools, mockups, data models |
|
|
59
|
+
| [`wireframe-skill`](../wireframe-skill/SKILL.md) | NL → wireframe JSON + interactive HTML with drag/drop, undo/redo |
|
|
60
|
+
| [`claude-wireframe-skill`](../claude-wireframe-skill/SKILL.md) | 5 UX approaches as interactive prototypes — B&W first then color variants |
|
|
61
|
+
|
|
62
|
+
## Data Visualization & Charts
|
|
63
|
+
|
|
64
|
+
| Skill | Best for |
|
|
65
|
+
|-------|----------|
|
|
66
|
+
| [`antvis-chart-skills`](../antvis-chart-skills/SKILL.md) | 7 AntV skills: 26+ chart types, 98.2% accuracy |
|
|
67
|
+
| [`markdown-viewer-skills`](../markdown-viewer-skills/SKILL.md) | 14 skills: Vega, PlantUML, JSON Canvas, infographics |
|
|
68
|
+
| [`d3js-skill`](../d3js-skill/SKILL.md) | D3.js: data binding, scales, transitions, interactive charts |
|
|
69
|
+
| [`data-viz-agent`](../data-viz-agent/SKILL.md) | Multi-library agent: D3/Chart.js/Plotly/Matplotlib |
|
|
70
|
+
| [`claud3`](../claud3/SKILL.md) | D3 v7 + Tufte principles: 80+ chart types, dark theme, annotations |
|
|
71
|
+
| [`data-analysis-skill`](../data-analysis-skill/SKILL.md) | Multi-expert parallel analysis → HTML reports + PowerPoint export |
|
|
72
|
+
|
|
73
|
+
## Design Review & UX Strategy
|
|
74
|
+
|
|
75
|
+
| Skill | Best for |
|
|
76
|
+
|-------|----------|
|
|
77
|
+
| [`creative-director`](../creative-director/SKILL.md) | 20+ ideation methods, Cannes/D&AD evaluation |
|
|
78
|
+
| [`design-brief`](../design-brief/SKILL.md) | Structured design briefs from loose requirements |
|
|
79
|
+
| [`design-consultation`](../design-consultation/SKILL.md) | Complete design system from scratch |
|
|
80
|
+
| [`design-review-garrytan`](../design-review-garrytan/SKILL.md) | Visual audit + atomic fix commits |
|
|
81
|
+
| [`plan-design-review`](../plan-design-review/SKILL.md) | Scored critique (0–10) with AI slop detection |
|
|
82
|
+
| [`design-html`](../design-html/SKILL.md) | Implement designs as production HTML/CSS |
|
|
83
|
+
| [`ux-ui-mastery`](../ux-ui-mastery/SKILL.md) | 19 skills: cognitive psych, spatial UX, ambient UI, iOS 26, WCAG 3.0 |
|
|
84
|
+
| [`designer-skills`](../designer-skills/SKILL.md) | 91 skills, 28 commands: design research, systems, ux-strategy, critique |
|
|
85
|
+
| [`design-with-claude`](../design-with-claude/SKILL.md) | 38 design slash commands: dashboards, b2b SaaS, healthcare UX, onboarding |
|
|
86
|
+
| [`ux-designer-skill`](../ux-designer-skill/SKILL.md) | Synthesizes 19 authoritative UX sources (NNG, Laws of UX) — 2026 best practices |
|
|
87
|
+
| [`wondelai-skills`](../wondelai-skills/SKILL.md) | Book-derived: Refactoring UI, Design of Everyday Things, Sprint, Lean UX |
|
|
88
|
+
| [`digidai-pm`](../digidai-pm/SKILL.md) | Senior PM: 30+ frameworks, SaaS metrics |
|
|
89
|
+
|
|
90
|
+
## Product & PM
|
|
91
|
+
|
|
92
|
+
| Skill | Best for |
|
|
93
|
+
|-------|----------|
|
|
94
|
+
| [`deanpeters-pm-skills`](../deanpeters-pm-skills/SKILL.md) | 9 skills: journey maps, OST, story mapping, PRD |
|
|
95
|
+
| [`phuryn-pm-skills`](../phuryn-pm-skills/SKILL.md) | 6 skills: JTBD personas, interview scripts, PRD |
|
|
96
|
+
| [`coreyhaines-marketing`](../coreyhaines-marketing/SKILL.md) | 3 CRO skills: onboarding, page, signup flow |
|
|
97
|
+
| [`pm-skills`](../pm-skills/SKILL.md) | 63 skills: Triple Diamond, 30 phases, Design Sprint, Foundation Sprint |
|
|
98
|
+
| [`claude-pm-skills`](../claude-pm-skills/SKILL.md) | Product thinking, discovery, prioritization, launch |
|
|
99
|
+
|
|
100
|
+
## Email & Terminal
|
|
101
|
+
|
|
102
|
+
| Skill | Best for |
|
|
103
|
+
|-------|----------|
|
|
104
|
+
| [`email-html-mjml`](../email-html-mjml/SKILL.md) | MJML 4.x → cross-client HTML email, WCAG 2.1 AA, Outlook-safe |
|
|
105
|
+
| [`tui-design-skill`](../tui-design-skill/SKILL.md) | Terminal UI design: Bubble Tea (Go), Ratatui (Rust), Textual (Python), Ink (TS) |
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: coreyhaines-marketing
|
|
3
|
+
description: |
|
|
4
|
+
3 CRO (conversion rate optimization) skills by Corey Haines: optimize post-signup
|
|
5
|
+
onboarding and activation, improve conversion rates on marketing pages, and
|
|
6
|
+
optimize signup and trial activation flows.
|
|
7
|
+
triggers:
|
|
8
|
+
- "CRO"
|
|
9
|
+
- "conversion optimization"
|
|
10
|
+
- "onboarding optimization"
|
|
11
|
+
- "signup flow"
|
|
12
|
+
- "marketing page conversion"
|
|
13
|
+
- "activation rate"
|
|
14
|
+
das:
|
|
15
|
+
category: product-pm
|
|
16
|
+
upstream: "https://github.com/coreyhaines31/marketingskills"
|
|
17
|
+
version: latest
|
|
18
|
+
install: false
|
|
19
|
+
---
|
|
20
|
+
|
|
21
|
+
# coreyhaines-marketing
|
|
22
|
+
|
|
23
|
+
> Catalogue stub — full package: [coreyhaines31/marketingskills](https://github.com/coreyhaines31/marketingskills)
|
|
24
|
+
|
|
25
|
+
## Decision tree
|
|
26
|
+
|
|
27
|
+
Run this before any conversion rate optimization work:
|
|
28
|
+
|
|
29
|
+
1. **Is a Corey Haines skill already installed?**
|
|
30
|
+
Check: `~/.design-agent-skills/skills/onboarding-cro/SKILL.md` exists.
|
|
31
|
+
- Yes → invoke the specific skill by name and proceed
|
|
32
|
+
- No → go to step 2
|
|
33
|
+
|
|
34
|
+
2. **Do you have shell access?**
|
|
35
|
+
- Yes → run the install command below, then invoke the skill
|
|
36
|
+
- No → show the user the install command, ask them to run it, then proceed once confirmed
|
|
37
|
+
|
|
38
|
+
## Install command
|
|
39
|
+
|
|
40
|
+
```bash
|
|
41
|
+
npx skills add coreyhaines31/marketingskills
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
Or install individually:
|
|
45
|
+
```bash
|
|
46
|
+
npx skills add coreyhaines31/onboarding-cro
|
|
47
|
+
npx skills add coreyhaines31/page-cro
|
|
48
|
+
npx skills add coreyhaines31/signup-flow-cro
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## Invoke after install
|
|
52
|
+
|
|
53
|
+
- `onboarding-cro` — "onboarding optimization", "activation rate", "post-signup"
|
|
54
|
+
- `page-cro` — "marketing page conversion", "landing page CRO"
|
|
55
|
+
- `signup-flow-cro` — "signup flow", "trial activation", "signup conversion"
|
|
56
|
+
|
|
57
|
+
## What it does
|
|
58
|
+
|
|
59
|
+
3 CRO skills targeting the core SaaS conversion funnel: improving post-signup onboarding activation, optimizing marketing page conversion rates, and tightening signup/trial flows. By Corey Haines, founder of Swipefiles.
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: creative-director
|
|
3
|
+
description: |
|
|
4
|
+
Senior Creative Director skill with 20+ ideation methodologies (SIT, TRIZ, SCAMPER,
|
|
5
|
+
Bisociation, Synectics) and a 3-axis evaluation framework calibrated against
|
|
6
|
+
Cannes Lions, D&AD, and HumanKind award standards.
|
|
7
|
+
triggers:
|
|
8
|
+
- "creative director"
|
|
9
|
+
- "creative strategy"
|
|
10
|
+
- "ideation"
|
|
11
|
+
- "campaign concept"
|
|
12
|
+
- "creative brief"
|
|
13
|
+
- "SCAMPER"
|
|
14
|
+
- "TRIZ"
|
|
15
|
+
das:
|
|
16
|
+
category: design-review
|
|
17
|
+
upstream: "https://github.com/smixs/creative-director-skill"
|
|
18
|
+
upstream_path: "SKILL.md"
|
|
19
|
+
version: latest
|
|
20
|
+
install: true
|
|
21
|
+
---
|
|
22
|
+
|
|
23
|
+
# creative-director
|
|
24
|
+
|
|
25
|
+
> Catalogue stub — full skill: [smixs/creative-director-skill](https://github.com/smixs/creative-director-skill)
|
|
26
|
+
|
|
27
|
+
## Decision tree
|
|
28
|
+
|
|
29
|
+
1. **Is the full skill already installed?**
|
|
30
|
+
Check whether the skill at this location still has a `das:` block:
|
|
31
|
+
- Global: `grep -q "^das:" ~/.agents/skills/creative-director/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
32
|
+
- Project: `grep -q "^das:" .agents/skills/creative-director/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
33
|
+
- No `das:` block → full skill installed, invoke it and proceed
|
|
34
|
+
- `das:` block present → go to step 2
|
|
35
|
+
|
|
36
|
+
2. **Detect scope, then install:**
|
|
37
|
+
|
|
38
|
+
To detect scope:
|
|
39
|
+
```bash
|
|
40
|
+
[ -e ~/.agents/skills/creative-director ] && echo "global" || echo "project"
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
**Global** (installed with `-g`):
|
|
44
|
+
```bash
|
|
45
|
+
npx skills add smixs/creative-director-skill --skill creative-director -g -y
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
**Project** (installed without `-g`):
|
|
49
|
+
```bash
|
|
50
|
+
npx skills add smixs/creative-director-skill --skill creative-director -y
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## Invoke after install
|
|
54
|
+
|
|
55
|
+
- Skill name: `creative-director`
|
|
56
|
+
- Trigger phrases: "creative director", "creative strategy", "ideation", "campaign concept"
|
|
57
|
+
|
|
58
|
+
## What it does
|
|
59
|
+
|
|
60
|
+
Applies senior creative director thinking with 20+ proven ideation methodologies including SIT, TRIZ, Bisociation, SCAMPER, and Synectics. Evaluates ideas on a 3-axis framework (originality, relevance, craft) calibrated against Cannes Lions, D&AD, and HumanKind award standards. Useful for campaign strategy, brand positioning, and breaking out of generic creative solutions.
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: css-animation-skill
|
|
3
|
+
description: |
|
|
4
|
+
Four-phase workflow — scrapes your live app's design language, interviews you about
|
|
5
|
+
what to animate, produces a brief and self-contained HTML/CSS animation file, then
|
|
6
|
+
iterates. Requires Claude-in-Chrome MCP for live scraping.
|
|
7
|
+
triggers:
|
|
8
|
+
- "CSS animation"
|
|
9
|
+
- "custom animation"
|
|
10
|
+
- "animation from live app"
|
|
11
|
+
- "css-animation-skill"
|
|
12
|
+
das:
|
|
13
|
+
type: skill
|
|
14
|
+
category: motion-animation
|
|
15
|
+
upstream: "https://github.com/neonwatty/css-animation-skill"
|
|
16
|
+
upstream_path: "SKILL.md"
|
|
17
|
+
version: latest
|
|
18
|
+
install: true
|
|
19
|
+
---
|
|
20
|
+
|
|
21
|
+
# css-animation-skill
|
|
22
|
+
|
|
23
|
+
> Catalogue stub — full skill: [neonwatty/css-animation-skill](https://github.com/neonwatty/css-animation-skill)
|
|
24
|
+
|
|
25
|
+
## Decision tree
|
|
26
|
+
|
|
27
|
+
1. **Is the full skill already installed?**
|
|
28
|
+
Check whether the skill at this location still has a `das:` block:
|
|
29
|
+
- Global: `grep -q "^das:" ~/.agents/skills/css-animation-skill/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
30
|
+
- Project: `grep -q "^das:" .agents/skills/css-animation-skill/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"`
|
|
31
|
+
- No `das:` block → full skill installed, invoke it and proceed
|
|
32
|
+
- `das:` block present → go to step 2
|
|
33
|
+
|
|
34
|
+
2. **Detect scope, then install:**
|
|
35
|
+
|
|
36
|
+
To detect scope:
|
|
37
|
+
```bash
|
|
38
|
+
[ -e ~/.agents/skills/css-animation-skill ] && echo "global" || echo "project"
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
**Global** (installed with `-g`):
|
|
42
|
+
```bash
|
|
43
|
+
npx skills add neonwatty/css-animation-skill --skill css-animation-skill -g -y
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
**Project** (installed without `-g`):
|
|
47
|
+
```bash
|
|
48
|
+
npx skills add neonwatty/css-animation-skill --skill css-animation-skill -y
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## Invoke after install
|
|
52
|
+
|
|
53
|
+
- Skill name: `css-animation-skill`
|
|
54
|
+
- Trigger phrases: "CSS animation", "custom animation", "animation from live app", "css-animation-skill"
|
|
55
|
+
|
|
56
|
+
## What it does
|
|
57
|
+
|
|
58
|
+
Runs a four-phase animation creation workflow: (1) scrapes your live app using Claude-in-Chrome MCP to extract the existing design language — colours, fonts, spacing, motion style; (2) interviews you about what element to animate, desired feel, and constraints; (3) produces an animation brief and a self-contained HTML/CSS output file with the custom `@keyframes` animation; (4) iterates based on feedback until the result is approved. Produces bespoke keyframe animations matched to your app's visual identity rather than off-the-shelf library classes.
|
|
59
|
+
|
|
60
|
+
## When NOT to use
|
|
61
|
+
|
|
62
|
+
- Library-based animations where custom keyframes aren't needed (use `animate-css-skill` or `framer-motion-skills`)
|
|
63
|
+
- Video or Lottie output (use `wiggle-claude-skill`)
|