107 lines
3.0 KiB
Markdown
107 lines
3.0 KiB
Markdown
# 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
|