Initial commit

skills/planning/ascii-diagram-creator/workflow/phase-2-generation.md

@@ -0,0 +1,106 @@
+# Phase 2: Diagram Generation
+
+**Purpose**: Create the ASCII diagram using proper visual elements and formatting.
+
+## 1. Apply Formatting Rules
+
+Before generating, ensure compliance:
+
+- **Maximum width**: 80 characters
+- **Box alignment**: Vertical centers aligned
+- **Spacing**: Clear separation between sections
+- **Legends**: Include when using status indicators
+
+## 2. Select Visual Elements
+
+### Box Drawing Characters
+
+```
+┌─────────────────┐    Top border
+│   Content       │    Side borders with padding
+├─────────────────┤    Section divider
+│   More content  │
+└─────────────────┘    Bottom border
+```
+
+### Arrow Types
+
+| Arrow | Meaning | Usage |
+|-------|---------|-------|
+| `──►` | Transformation/flow | Data movement, process flow |
+| `◄──` | Reverse flow | Feedback loops |
+| `◄─►` | Bidirectional | Two-way communication |
+| `──✓` | Approved/kept | Retained items |
+| `──✗` | Removed/blocked | Deleted items |
+
+### Status Indicators
+
+| Symbol | Meaning |
+|--------|---------|
+| `✓` | Complete/kept |
+| `✗` | Removed/deleted |
+| `⏳` | In progress |
+| `🔄` | Migrated/moved |
+| `⚠️` | Warning |
+| `🔴` | Critical |
+
+## 3. Generate Diagram
+
+Follow the template for the selected type:
+
+### Architecture Template
+```
+┌─────────────────────────────────┐
+│     COMPONENT NAME              │
+├─────────────────────────────────┤
+│ • Feature 1                     │
+│ • Feature 2                     │
+└─────────────────────────────────┘
+             │
+             ▼
+    [Connected Component]
+```
+
+### Before/After Template
+```
+BEFORE:                    AFTER:
+old/structure/      ──►    new/structure/
+├── file1          KEPT    ├── file1
+├── file2          MOVED   └── newfile
+└── file3          DELETED
+```
+
+### Phased Migration Template
+```
+┌────────────────────────────────┐
+│  PHASE 1: Description          │
+│  Status: IN PROGRESS           │
+│  Action: Specific task         │
+└────────────────────────────────┘
+                  │
+                  ▼
+[Next Phase]
+```
+
+### Data Flow Template
+```
+Input ──► Process ──► Output
+   ▲         │          │
+   │         ▼          ▼
+Feedback  Storage   Display
+```
+
+## 4. Add Context
+
+Include with the diagram:
+- Brief explanation of what it shows
+- Legend for any symbols used
+- Suggested usage (PR, docs, README)
+
+## Output
+
+Complete ASCII diagram with:
+- Proper formatting (80-char max)
+- Appropriate visual elements
+- Clear labels and structure
+- Explanatory context