ascii-diagram-boxflow について
ascii-diagram-boxflowは、スキル名が明示された場合にのみ使うASCIIボックス図の生成スキルです。ノードと接続を入力として受け取り、配置ルールと複雑な図の分割案を示します。
主な機能
- 01ASCIIのみの図を出力
- 02上下または左右の配置
- 03幅とボックスサイズの指定
- 04複雑な図の分割案
活用シーン
- 01単純な直線フローの作図
- 02単一分岐を含むフローの表示
- 03複雑なフローのサブ図への分割
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ full-stack-skills/ ascii-skills --skill ascii-diagram-boxflowインストール後、Claude Code で/ascii-diagram-boxflowを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
LICENSE.txtagents/openai.yamlexamples/login-flow.mdscripts/boxflow.py詳細
このスキルを使用するタイミング
重要なトリガールール
- ユーザーがスキル名
ascii-diagram-boxflowを明示的に指定した場合にのみ、このスキルを使用してください。
トリガーフレーズの例:
- "ascii-diagram-boxflow"
- "use ascii-diagram-boxflow"
- "用 ascii-diagram-boxflow 画 ASCII 流程图/框图"
- "使用 ascii-diagram-boxflow 生成 box + 箭头连接图"
適用範囲
- 出力は ASCII のみです。Mermaid/PlantUML は出力しないでください。
- ノード数は 12 以下を推奨します。それを超える場合は、サブ図に分割してください。
- 自動レイアウトは、直線的なフローや単純な分岐で最適に機能します。複雑なレイアウトには、手動で順序を指定するか、分割する必要があります。
このスキルの使用方法
入力
- nodes(ノードのリスト。名前は必須)
- edges(接続:from/to)
- direction(TB | LR、デフォルトは TB)
- width(デフォルトは 80)
- boxWidth(デフォルトは 16)
- numbering(デフォルトは false)
出力(必須)
- diagram(ASCII のみ)
- layoutRules(ボックスの幅と矢印/線のルール)
- splitAdvice(複雑な図の分割方法)
スクリプト
scripts/boxflow.py:直線的なフローや単一の 2 方向分岐向けのベストエフォート実装です
例
examples/login-flow.md
品質チェックリスト
- 矢印の方向が明確で、交差を避けていること
- 行の幅が
<= widthで、末尾にスペースがないこと - 長いノード名は、一貫した方法で切り詰めるか折り返すこと
キーワード
英語: ascii-diagram-boxflow、ASCII 図、フローチャート、ボックス、矢印、プレーンテキスト、ターミナル 中国語: ascii-diagram-boxflow、ASCII ボックス図、フローチャート、プレーンテキスト、ボックス、矢印、ターミナル
よくある落とし穴
- バージョンの互換性:フレームワークのバージョンと依存ライブラリの互換性に注意してください。バージョンによって API が異なる場合があります。
- 設定ファイルの形式:設定ファイルの形式の誤りは最もよくある問題です。エディターの構文チェックを使用することをおすすめします。
- 環境変数:必要な環境変数がすべて正しく設定されていることを確認し、機密情報をハードコードしないでください。
- 依存関係の競合:複数のバージョンを共存させる場合は依存関係の競合に注意し、lock ファイルを使用してバージョンを固定してください。
- パフォーマンスの落とし穴:大量のデータを扱う場合はパフォーマンスの最適化に注意し、N+1 クエリなどのよくある問題を避けてください。
使用手順
Step 1: 環境の準備
開発環境に必要な依存関係とツールがインストールされていることを確認します。
Step 2: 初期設定
プロジェクトの要件に応じて基本設定を行います。
Step 3: コア機能の使用
サンプルコードに従ってコア機能を実装します。
Step 4: テストと検証
テストを実行して、機能が正常に動作することを確認します。
Step 5: デプロイ
開発が完了したら、デプロイと監視を行います。
コメント
Markdown 対応