Loading...
Loading...
ASCII diagram patterns for architecture, workflows, file trees, and data visualizations. Use when creating terminal-rendered diagrams, box-drawing layouts, progress bars, swimlanes, or blast radius visualizations.
npx skill4agent add yonatangross/orchestkit ascii-visualizerStandard: ┌─┐ │ └─┘ ├─┤ ┬ ┴ ┼
Heavy: ┏━┓ ┃ ┗━┛ ┣━┫ ┳ ┻ ╋
Double: ╔═╗ ║ ╚═╝ ╠═╣ ╦ ╩ ╬
Rounded: ╭─╮ │ ╰─╯
Arrows: → ← ↑ ↓ ─> <─ ──> <──
Blocks: █ ▓ ░ ▏▎▍▌▋▊▉
Checks: ✓ ✗ ● ○ ◆ ◇ ★ ☆| Weight | Characters | Use For |
|---|---|---|
Standard | Normal boxes and connectors | Most diagrams |
Heavy | Emphasis, borders, headers | Key components, outer frames |
Double | Separation, titles | Section dividers, title boxes |
┌──────────────┐ ┌──────────────┐
│ Frontend │─────>│ Backend │
│ React 19 │ │ FastAPI │
└──────────────┘ └───────┬──────┘
│
v
┌──────────────┐
│ PostgreSQL │
└──────────────┘src/
├── api/
│ ├── routes.py [M] +45 -12 !! high-traffic path
│ └── schemas.py [M] +20 -5
├── services/
│ └── billing.py [A] +180 ** new file
└── tests/
└── test_billing.py [A] +120 ** new file
Legend: [A]dd [M]odify [D]elete !! Risk ** New[████████░░] 80% Complete
+ Design (2 days)
+ Backend (5 days)
~ Frontend (3 days)
- Testing (pending)Backend ===[Schema]======[API]===========================[Deploy]====>
| | ^
| +------blocks------+ |
| | |
Frontend ------[Wait]--------[Components]=======[Integration]=+
=== Active work --- Blocked/waiting | Dependency Ring 3: Tests (8 files)
+-------------------------------+
| Ring 2: Transitive (5) |
| +------------------------+ |
| | Ring 1: Direct (3) | |
| | +--------------+ | |
| | | CHANGED FILE | | |
| | +--------------+ | |
| +------------------------+ |
+-------------------------------+BEFORE AFTER
┌────────────┐ ┌────────────┐
│ Monolith │ │ Service A │──┐
│ (all-in-1)│ └────────────┘ │ ┌──────────┐
└────────────┘ ┌────────────┐ ├─>│ Shared │
│ Service B │──┘ │ Queue │
└────────────┘ └──────────┘Phase 1 [================] FULLY REVERSIBLE (add column)
Phase 2 [================] FULLY REVERSIBLE (new endpoint)
Phase 3 [============....] PARTIALLY (backfill)
--- POINT OF NO RETURN ---
Phase 4 [........????????] IRREVERSIBLE (drop column)| Rule | Description |
|---|---|
| Font | Always monospace — box-drawing requires fixed-width |
| Weight | Standard for normal, Heavy for emphasis, Double for titles |
| Arrows | |
| Alignment | Right-pad labels to match column widths |
| Annotations | |
| Width | Keep under 80 chars for terminal compatibility |
| Nesting | Max 3 levels of box nesting before readability degrades |
| Pattern | Use Case |
|---|---|
| Layered boxes | System architecture, deployment topology |
| Concentric rings | Blast radius, impact analysis |
| Timeline bars | Reversibility, migration phases |
| Swimlanes | Execution order, parallel work streams |
| Annotated trees | File change manifests, directory structures |
| Comparison tables | Cross-layer consistency, before/after |
| Progress bars | Status tracking, completion metrics |
brainstormingarchitecture-patternscode-review-playbook