Skillsexplaining-code

explaining-code

SeedPublic

ProjectContent Docs

Explains code with visual diagrams and analogies. Use when explaining how code works, teaching about a codebase, or when the user asks "how does this work?"

At a glance

Source: community
Category: content-docs
Scope: project
User-invocable: no

Location

.claude/skills/explaining-code/

Auto-generated by scripts/sync-skills-content.ts. Add your own notes below — re-runs preserve the body and your soft frontmatter fields.

SKILL.md

.claude/skills/explaining-code/SKILL.md

14 lines

Raw

---
name: explaining-code
description: Explains code with visual diagrams and analogies. Use when explaining how code works, teaching about a codebase, or when the user asks "how does this work?"
---

When explaining code, always include:

1. **Start with an analogy**: Compare the code to something from everyday life
2. **Draw a diagram**: Use ASCII art to show the flow, structure, or relationships
3. **Walk through the code**: Explain step-by-step what happens
4. **Highlight a gotcha**: What's a common mistake or misconception?

Keep explanations conversational. For complex concepts, use multiple analogies.

Install it elsewhere with curl -o .claude/skills/explaining-code/SKILL.md --create-dirs https://uxlab.designcoder.net/api/skills/explaining-code/source. Record what you changed in this page's notes.