Andy1314Chen

Architecture Drawer — Development skill for Claude Code

Development community

Skill for Claude Code & Codex: describe your system architecture in text → get an editable PowerPoint diagram (native shapes, not a flat image).

How to install Architecture Drawer

This entry records only its repository, not the path inside it, so there is no exact command to give. Open Andy1314Chen/architecture-drawer and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Architecture Drawer does

Skill for Claude Code & Codex: describe your system architecture in text → get an editable PowerPoint diagram (native shapes, not a flat image).

Alternatives in Development

  • Mempalace Status — Show the current state of your memory palace — wings, rooms, drawer counts, and suggestions 58.6k ★
  • Frontend Slides Editable — Editable HTML presentation skill for Codex/Claude Code with drag-resize editing, slide reordering, local save/ 466 ★
  • HERO Anti OverDefense — HERO = Hashing · Edge cases · Rubrics · Overbuild — the four shapes coding agents over-defend in 333 ★

README

architecture-drawer

English · [简体中文](README.zh_CN.md)

A skill for [Claude Code](https://code.claude.com), Codex, Open Code, Pi Agent, and other AI coding agents: turn a text description of your system architecture into an **editable PowerPoint architecture diagram**.

![License](https://img.shields.io/badge/license-MIT-blue)


What it is

Turn **text descriptions** of an architecture into **editable PPT diagrams**: the agent generates an SVG from your description, auto-validates the layout, then exports to native PowerPoint shapes.

vs. direct image generation

This project Nano Banana / GPT-Image etc.
Output Editable PPT (every shape draggable, recolorable, retextable) Flattened image
Control High (code-generated, precisely adjustable) Low (prompt-driven, hard to reproduce)
Iteration Fine-tune directly in PPT Regenerate from scratch
Cost Low High (per-image billing)

Showcase

All diagrams below were generated entirely from text descriptions by the skill, then scored by the 13-dimension evaluator (each scored ≥76/100). They double as the regression suite under `evals/` — including the first non-architecture case (a process flowchart).

vLLM — High-Throughput LLM Inference Serving (PagedAttention)

![](docs/showcase/vllm_arch.png)

Six-layer request pipeline (client → API server → engine → paged KV cache → execution → optimizations). Solid edges = data flow; dashed = cache/block management. *Scheme S1 Monochrome Blue.*

MLIR AI Compiler — Multi-Stream Execution Pipeline

![](docs/showcase/mlir_pipeline.png)

A 4-layer × multi-column matrix (graph optimization → transformation → lowering → codegen) with vertical-fusion grouping and a concurrent multi-stream overlap timeline. *8-accent categorical palette.*

Agent Infrastructure — Layered Architecture

![](docs/showcase/agent_infra_architecture.png)

Five horizontal layers (application → orchestration → core capabilities → execut