skill-creator
The Skill Creator guides users through building modular packages that extend AIPex's capabilities with specialized knowledge, workflows, tool integrations, and bundled resources. Use this skill when developing new skills or updating existing ones to add domain expertise, multi-step procedures, API integrations, or reusable scripts to AIPex's ecosystem.
git clone --depth 1 https://github.com/AIPexStudio/AIPex /tmp/skill-creator && cp -r /tmp/skill-creator/packages/browser-runtime/src/skill/built-in/skill-creator-browser ~/.claude/skills/skill-creatorSKILL.md
# Skill Creator
This skill provides guidance for creating effective skills.
## About Skills
Skills are modular, self-contained packages that extend AIPex's capabilities by providing
specialized knowledge, workflows, and tools. Think of them as "onboarding guides" for specific
domains or tasks—they transform AIPex from a general-purpose agent into a specialized agent
equipped with procedural knowledge that no model can fully possess.
### What Skills Provide
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 and repetitive tasks
### Anatomy of a Skill
Every skill consists of a required SKILL.md file and optional bundled resources:
```
skill-name/
├── SKILL.md (required)
│ ├── **YAML frontmatter metadata** (required)
│ │ ├── name: (required)
│ │ └── description: (required)
│ └── Markdown instructions (required)
└── Bundled Resources (optional)
├── scripts/ - Executable code (JavaScript/Browser/etc.)
├── references/ - Documentation intended to be loaded into context as needed
└── assets/ - Files used in output (templates, icons, fonts, etc.)
```
#### SKILL.md (required)
**Metadata Quality:** The `name` and `description` in YAML frontmatter determine when AIPex will use the skill. Be specific about what the skill does and when to use it. Use the third-person (e.g. "This skill should be used when..." instead of "Use this skill when...").
#### Bundled Resources (optional)
##### Scripts (`scripts/`)
Executable code (JavaScript/Browser/etc.) for tasks that require deterministic reliability or are repeatedly rewritten.
- **When to include**: When the same code is being rewritten repeatedly or deterministic reliability is needed
- **Example**: `scripts/rotate_pdf.js` for PDF rotation tasks
- **Benefits**: Token efficient, deterministic, may be executed without loading into context
- **Main function requirement**: Every script must export a `main` function or have a `main` function as the entry point. This function serves as the standard interface for executing the script's functionality.
- **Export examples**:
```javascript
// Option 1: Direct export
function main(args) {
// script logic here
}
module.exports = main;
// Option 2: Object export
function main(args) {
// script logic here
}
module.exports = { main };
```
- **Note**: Scripts may still need to be read by AIPex for patching or environment-specific adjustments
##### References (`references/`)
Documentation and reference material intended to be loaded as needed into context to inform AIPex's process and thinking.
- **When to include**: For documentation that AIPex should reference while working
- **Examples**: `references/finance.md` for financial schemas, `references/mnda.md` for company NDA template, `references/policies.md` for company policies, `references/api_docs.md` for API specifications
- **Use cases**: Database schemas, API documentation, domain knowledge, company policies, detailed workflow guides
- **Benefits**: Keeps SKILL.md lean, loaded only when AIPex determines it's needed
- **Best practice**: If files are large (>10k words), include grep search patterns in SKILL.md
- **Avoid duplication**: Information should live in either SKILL.md or references files, not both. Prefer references files for detailed information unless it's truly core to the skill—this keeps SKILL.md lean while making information discoverable without hogging the context window. Keep only essential procedural instructions and workflow guidance in SKILL.md; move detailed reference material, schemas, and examples to references files.
##### Assets (`assets/`)
Files not intended to be loaded into context, but rather used within the output AIPex produces.
- **When to include**: When the skill needs files that will be used in the final output
- **Examples**: `assets/logo.png` for brand assets, `assets/slides.pptx` for PowerPoint templates, `assets/frontend-template/` for HTML/React boilerplate, `assets/font.ttf` for typography
- **Use cases**: Templates, images, icons, boilerplate code, fonts, sample documents that get copied or modified
- **Benefits**: Separates output resources from documentation, enables AIPex to use files without loading them into context
### Progressive Disclosure Design Principle
Skills use a three-level loading system to manage context efficiently:
1. **Metadata (name + description)** - Always in context (~100 words)
2. **SKILL.md body** - When skill triggers (<5k words)
3. **Bundled resources** - As needed by AIPex (Unlimited\*)
\*Unlimited because scripts can be executed without reading into context window.
## Browser Environment Usage
This skill creator is designed to work in browser environments (such as Chrome Extensions) using memfs for file operations and JSZip for packaging. The scripts are browser-compatible and can be used with virtual filesystems.
### Function Signatures
```javascript
// Initialize a new skill
const result = initSkill(skillName, basePath, fs)
// Write a file to the file system
const writeResult = await writeFile({
path: "/skills/my-skill/SKILL.md",
content: "YAML frontmatter and Markdown content"
})
// Delete a file or directory from the file system
const deleteResult = await deleteFile({ path: "/skills/my-skill/old-file.md" })
// Package an existing skill and trigger download
const result = await packageSkill(skillPath)
// Validate a skill
const validation = validateSkill(skillPath, fs)
```
#### writeFile
Write content to a file in the file system. Creates parent directories if they don't exist.
**Parameters:**
- `path` (required): Absolute path to the file to write
- `content` (required): Content to write to the file
**ReturMinimalist UX/Interaction Audit Expert that deconstructs complex interactions through cognitive load and operational efficiency lenses. Use this skill when you need to perform a UX walkthrough audit on a Figma prototype or web interface, evaluating usability based on principles like fewer clicks, less UI elements, no hidden logic, and self-explanatory design.
WCAG 2.2 Accessibility Audit skill that systematically evaluates web pages against 8 core Success Criteria (1.1.1, 1.4.3, 1.4.11, 2.1.1, 2.1.2, 2.4.3, 2.4.7, 4.1.2) using accessibility tree inspection and visual analysis. Use this skill when you need to perform accessibility testing/auditing on a live webpage.
AI-powered browser automation using the AIPex Chrome Extension via MCP bridge. Use this skill when the agent needs to control a Chrome browser — navigating pages, clicking elements, filling forms, capturing screenshots, managing tabs, or downloading content — by connecting to the AIPex MCP bridge.