1. Gather Brand Basics - Name, description, primary use case
2. Define Colors - 10 color values for the complete system
3. Define Typography - Heading, body, and code fonts
4. Define Assets - Logo and icon paths
5. Discover Voice - Personality, vocabulary, sentence patterns
6. Create Design Philosophy - Core principles and signature elements
7. Generate Files - Create all four files with gathered information

The skill includes 5 example voice configurations to help you discover your own:

• Technical Educator - Enthusiastic expert who teaches by showing
• Calm Authority - Confident and measured, lets expertise speak through specifics
• Builder's Perspective - Developer-to-developer, unfiltered opinions backed by code
• Approachable Expert - Makes the complex accessible without dumbing it down
• Contrarian Thinker - Challenges conventional wisdom with evidence

Step 1: Copy the example config to create your own:

cp .claude/skills/mcp-client/references/example-mcp-config.json \
   .claude/skills/mcp-client/references/mcp-config.json

Step 2: Edit mcp-config.json with your API keys and servers.

The config format is identical to Claude Desktop's MCP config:

{
  "mcpServers": {
    "zapier": {
      "url": "https://mcp.zapier.com/api/v1/connect",
      "api_key": "YOUR_API_KEY_HERE"
    },
    "sequential-thinking": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-sequential-thinking"]
    }
  }
}

Transport types:

• url + api_key → Remote server with Bearer auth (Zapier)
• command + args → Local stdio server (npx, python, docker)
• url ending in /sse → SSE transport
• url ending in /mcp → Streamable HTTP

# List configured servers
python .claude/skills/mcp-client/scripts/mcp_client.py servers

# List tools from a server (with full schemas)
python .claude/skills/mcp-client/scripts/mcp_client.py tools zapier

# Call a tool
python .claude/skills/mcp-client/scripts/mcp_client.py call zapier <tool_name> '{"param": "value"}'

Important: After setting up MCP servers, ask Claude to test each tool and document any quirks. This saves time on future calls.

Add a section to your project's CLAUDE.md (or create one) - example:

## MCP Tool Notes

### Zapier
- `send_gmail_email`: The `to` field must be a single email, not an array
- `create_notion_page`: Requires `database_id`, not `page_id`
- Rate limit: 2 Zapier tasks per MCP call

### Sequential Thinking
- Always set `nextThoughtNeeded: true` until final thought
- `totalThoughts` is advisory, can be adjusted mid-process

Why this matters: MCP tools often have undocumented argument requirements or behaviors. Testing once and documenting saves context and prevents repeated errors.

Workflow:

1. Connect a new MCP server
2. Ask Claude: "List all tools from [server] and test each one with sample inputs"
3. Document any failures, required formats, or gotchas in CLAUDE.md
4. Claude will reference these notes on future calls

1. Slide Generation - Create 16:9 presentations with brand styling
2. Carousel Generation - Create square 1:1 LinkedIn carousels (exports to PDF)
3. Layout Management - Create, edit, and improve cookbook layouts

• 16 slide layout templates in the cookbook (title, content, stats, two-column, multi-card, floating-cards, circular-hero, quote, chart, code, and more)
• 5 carousel-specific layouts (hook, single-point, numbered-point, quote, CTA)
• Brand system with colors, fonts, and assets
• Batch generation (max 5 slides at a time) for reliability
• Variety enforcement rules to prevent repetitive layouts

Visual-first layout selection - content-slide is the LAST RESORT, not the default.

The skill includes a decision tree to transform bullets into visual layouts:

• 3-5 equal items → multi-card-slide
• 2-4 big numbers → stats-slide
• Comparing two things → two-column-slide
• Central concept with surrounding items → circular-hero-slide
• Powerful quote → quote-slide

Only use content-slide when none of the visual layouts fit.

• Tech/Engineering: Runbook, Deployment Playbook, Troubleshooting Guide, How-To, ADR
• Operations/Business: Process SOP, Checklist, Decision Tree, Handoff Doc
• Content/Creative: Production Workflow, Review Process, Publishing Checklist
• General: Standard SOP, Quick Reference, Onboarding Guide

1. Definition of Done (checklist - most important, put near the top)
2. When to Use This
3. Prerequisites
4. The Process (numbered steps)
5. Verify Completion
6. When Things Go Wrong
7. Questions?

• Be specific (numbers, names, thresholds - not "as needed" or "regularly")
• Action-first steps (verbs, not descriptions)
• Warnings come first (before the dangerous step, not after)
• Clear decision points (if X, then Y - not "handle based on priority")

1. Specialized workflows - Multi-step procedures for specific domains
2. Tool integrations - Instructions for working with specific file formats or APIs
3. Domain expertise - Company-specific knowledge, schemas, business logic
4. Bundled resources - Scripts, references, and assets for complex tasks

• Concise is Key - Only add context Claude doesn't already have
• Set Appropriate Degrees of Freedom - Match specificity to task fragility
• Progressive Disclosure - Metadata always in context, body when triggered, resources as needed

skill-name/
├── SKILL.md (required)
│   ├── YAML frontmatter (name, description)
│   └── Markdown instructions
└── Bundled Resources (optional)
    ├── scripts/     - Executable code
    ├── references/  - Documentation loaded as needed
    └── assets/      - Files used in output

1. Understand with concrete examples
2. Plan reusable contents
3. Initialize (run init_skill.py)
4. Edit and implement
5. Package (run package_skill.py)
6. Iterate based on real usage

Step 1: Create a new Remotion project:

npx create-video@latest

When prompted, select:

• Empty template
• Enable TailwindCSS (recommended)
• Install Skills (this adds the Remotion skill automatically)

Step 2: Start the development server:

cd my-video
npm install
npm run dev

This opens a browser preview where you'll see your video render in real-time.

Step 3: Point Claude to your project:

"Edit my Remotion project at /path/to/my-video"

Claude will read the project structure and edit the React components in src/.

The skill includes 28 modular rules covering:

• Animations - Interpolation, springs, easing curves
• Compositions - Multi-scene videos, dynamic duration
• Assets - Images, videos, audio, fonts, GIFs, Lottie
• Text - Typewriter effects, word highlights, measuring text
• Captions - TikTok-style captions, SRT import, transcription
• Charts - Animated bar charts, data visualization
• 3D - Three.js and React Three Fiber integration
• Transitions - Scene transitions, sequencing patterns
• Maps - Animated Mapbox maps

Good prompts describe what can be drawn in a web interface:

• "Create a 10-second intro with my logo fading in, then text typing out"
• "Add a bar chart that animates the values from 0 to their final state"
• "Make the title bounce in with a spring animation"

Don't asking Claude to produce an entire video - one composition at a time is the way to go.

These skills focus on universal principles and workflows that work for anyone. Use them immediately without any configuration.

1. Run npx create-video@latest to create a Remotion project
2. Select Empty template + TailwindCSS + Install Skills
3. Start npm run dev and tell Claude the project path

The skill provides domain knowledge - the project itself lives outside this repo.

1. Copy example-mcp-config.json to mcp-config.json
2. Add your API keys (Zapier, GitHub tokens, etc.)
3. Test each server's tools and document gotchas in your CLAUDE.md

The config format matches Claude Desktop, so you can reuse existing configs.

This skill requires a complete brand setup before generating slides. Use the Brand & Voice Generator skill to create these files interactively, or manually copy from the template folder.

Required files (in brands/your-brand-name/):

1. brand.json - Colors (10 values), fonts (3), and asset paths
2. config.json - Output directory, batch size, file naming
3. brand-system.md - Design philosophy, color rationale, typography rules, signature elements
4. tone-of-voice.md - Voice character, vocabulary patterns, do's and don'ts, example phrases

Setup steps:

1. Run the Brand & Voice Generator skill, OR
2. Copy brands/template/ to brands/your-brand-name/
3. Replace all REPLACE placeholders in each file
4. Add your logo to brands/your-brand-name/assets/
5. Test by generating a simple presentation

See brands/dynamous/ for a complete example of a configured brand.