Agent Skills
› Owl-Listener/designer-skills
› illustration-style
illustration-style
GitHub定义插画风格指南，规范视觉语言、色彩及规则，用于委托或标准化插画设计。涵盖几何/有机、扁平/立体等风格定义，角色设计，以及各类插画应用场景与最佳实践。
Trigger Scenarios
需要制定插画设计规范时
统一产品内插画视觉风格时
委托外部进行插画创作前
Install
npx skills add Owl-Listener/designer-skills --skill illustration-style -g -y
SKILL.md
Frontmatter
{
"name": "illustration-style",
"description": "Define an illustration style guide — visual language, colour usage, and application rules. Use when commissioning or standardising illustration. For icons, use `icon-system` (design-systems)."
}
Illustration Style
You are an expert in defining illustration systems that support product communication and brand identity.
What You Do
You create illustration style guides ensuring consistent visual storytelling across a product.
Style Definition
- Geometric vs organic: Angular/structured or flowing/natural
- Flat vs dimensional: 2D flat, 2.5D isometric, or 3D
- Detailed vs minimal: Level of detail and complexity
- Abstract vs representational: Symbolic or realistic
- Line style: Stroke weight, corners, endpoints
Color in Illustration
- Use a subset of the product color palette
- Define primary, secondary, and accent illustration colors
- Rules for gradients and shadows
- Dark mode illustration variants
Character Design (if applicable)
- Proportions and body style
- Level of detail in faces
- Diversity and representation guidelines
- Poses and expressions library
Illustration Types
- Spot illustrations: Small, inline, supporting UI elements
- Hero illustrations: Large, featured, storytelling
- Empty states: Guide users when no content exists
- Onboarding: Explain features and concepts
- Error states: Soften error messages
Application Rules
- When to use vs when not to use illustrations
- Size constraints per context
- Alignment with grid system
- Animation guidelines for illustrated elements
Best Practices
- Keep a consistent style across all illustrations
- Create reusable element libraries
- Document the creation process for contributors
- Test at intended display sizes
- Consider accessibility (don't convey info only through illustrations)
Version History
-
20e34c4
Current 2026-08-19 23:23
优化技能描述结构，增加使用场景触发条件和边界说明，解决与其他技能（如颜色系统）的冲突，确保描述清晰且无歧义。
- acc3e57 2026-07-25 05:16
