ASCIIダイアグラムアーキテクト
コードコメントやドキュメント内で、ツールに依存しない高実用性のASCII図やフローチャートを生成するための専門スキルです。形式的な*「ASCII図のデザイン空間」*（Hayatpur et al., 2024）に従います。
トリガー指示
以下のようなリクエストがあった場合にこのスキルを使用します。
- 「可視化」
- 「図示」
- 「フローチャート」
- 「マッピング」
プロセス、データ構造、システムアーキテクチャをプレーンテキストで表現したいとき。
ロジックやメモリレイアウトの視覚的表現が明確さを向上させるコード説明を提供する際に起動します。
基本原則
ツール非依存性
図は厳密にモノスペースであり、基本的なテキストエディタ（IDE、ターミナル、Git）であればどこでも読み取り可能であることを保証します。
情報の近接性
図は、それが説明するロジックの直上または横に配置される*「視覚的なマップ」*として機能します。
構造化された表記
一貫した文字セット（+、-、|、v、>）を使用して境界と流れを定義します。
デザイン空間ワークフロー
Hayatpur et al. の研究に基づき、描画前に以下の次元を内部的に定義します。
1. 内容の識別
何を表現するかを決定します。
- システムアーキテクチャ: 高レベルのコンポーネントとネットワーキング。
- データ構造: メモリレイアウト、リンクリスト、ツリーノード。
- 動的振る舞い: ステップごとのロジックまたは状態遷移。
2. レイアウトと接続
- ボックスアンドライン: エンティティには
+---+を、接続には|または-を使用します。 - フロー方向: 上から下、または左から右に統一します。
- 整列: すべての垂直パイプ（
|）が完全に整列し、*「ボックス」*形状を維持するようにします。
実装ガイドライン
「ボックス」標準
エンティティが視覚的に区別できるように、常に3層の境界を使用します。
+-----------------------+
| ENTITY NAME |
+-----------------------+
「コネクタ」標準
方向性を示すために明示的な矢印ヘッドを使用します。曖昧な線は使用しないでください。
- 垂直:
|の後にv - 水平:
---の後に>
注釈
コネクタの横に短く説明的なテキストを配置して、遷移やロジックを説明します（例: "if x > 0" または "API Call"）。
サンプルワークフロー: システムリクエスト
入力: 「ロードバランサがトラフィックを3台のサーバに分散する様子を示して。」
出力:
[ CLIENT REQUEST ]
|
v
+-----------------------+
| LOAD BALANCER |
+----------+------------+
|
+---------+---------+
| | |
v v v
+-------+ +-------+ +-------+
| SRV 1 | | SRV 2 | | SRV 3 |
+-------+ +-------+ +-------+
制約事項
- 非標準のUnicode文字（
┌や┐など）は、明示的に要求されない限り使用しないでください。特定の端末環境やレガシーエディタで壊れる可能性があります。 - モノスペースの維持: すべての行で文字幅の一貫性をチェックする必要があります。
- 複雑さを避ける: 図の幅が80文字を超える場合は、標準のIDEウィンドウに収まるように*「サブモジュール」*に分割してください。