「これがほしかった」AIで業務フローをつくる to Miro
著者: すぅ AI駆動PM 媒体: note 公開日: 2026-02-01 URL: https://note.com/suh_sunaneko/n/n6b2ce55b3c07
概要
AIが Miro ボード上にスイムレーン付き業務フローを自動生成するスキルの解説記事。ヒアリング議事録や業務記述テキストを inputとして、Miro REST API v2 経由でフロー図を出力する。Claude Code Skills として実装されており、Claude Code でも Cursor でも同一品質で実行可能。
前バージョン(draw.io版)からの進化
| 観点 | draw.io 版(旧) | Miro 版(新) |
|---|---|---|
| 出力先 | draw.io | Miro(FigJam代替) |
| 品質 | 不安定(ガチャ的要素あり) | 高精度・安定 |
| 納品可能性 | 叩き台止まり(FigJam/PPTへ作り替え必須) | そのまま顧客共有・再確認に使えるレベル |
| 表現力 | 基本フローのみ | タイムライン・ドキュメント・システムも表現 |
AI業務フロー to Miro の特徴
- スイムレーンが綺麗 — 担当者/部署ごとのレーン自動配置
- タイムライン考慮 — 何時に何をやるかを時系列に配置
- システム・ドキュメントの表現 — 使用ツールや資料を図中に示す
- 複数業務の分割 — 1つのインプットから複数業務フローを自動生成
- Skills統一品質 — Claude Code・Cursor どちらでも同一品質を保証
高品質出力の仕組み
厳密な座標計算と接続点管理により品質を担保する:
- ノード間隔を数式で定義(タスク間 200px、判断→差戻し 250px)
- スイムレーン幅 = 「最右X - 最左X + 500px」ではみ出しを防止
- 各ノードの接続点(top/bottom/left/right)に最大1本のコネクタを接続
- 差戻し・ループ構造では判断ノードと同Y座標に差戻しノードを配置、X方向250px以上離す
- 複数業務フロー作成時は事前に座標設計表を作成し、見出しY座標を「前業務の最終レーンY + 125 + 200」で計算
- 開始前・設計時・実行中・完了後の4段階チェックリストで品質保証
使い方(3ステップ)
Step 1: テキスト情報を用意する
- 業務ヒアリング議事録(文字起こし、Q&A形式・自由記述)
- 実際の作業動画をGeminiでマニュアル化したテキスト
いずれも input.md に記述。雑な状態でもOK。
Step 2: スキルを実行する
input.md の業務フロー作成して
実行すると以下の選択肢が表示される:
- Miroで業務フローを作る
- 業務一覧を作る
- 両方を作る
Step 3: 完成を待つ
1業務あたり約 5分 で自動完成。
活用のポイント
AIで作っている部分があるので100点ではありません。最後は人間が修正する必要があります。
- 成果物をいきなり「完成品です」と出すものではない
- 従来:ヒアリング後 → 1週間後に再確認
- AI活用後:ヒアリング翌日に業務フロー完成 → 即座に顧客と認識合わせ
- スピードとサイクルを回せることが最大の貢献
今後の改善余地
- トークン消費量が多い → スキル改善でコスト削減したい
- 複数業務処理は時間がかかる → 並列処理で削減したい
スキルの技術仕様
スキル作成時の主要な技術要件:
| 要素 | 仕様 |
|---|---|
| API | Miro REST API v2 |
| 呼び出し方式 | curl |
| 環境変数 | MIRO_TOKEN, MIRO_BOARD_ID |
| エンドポイント | /frames, /shapes, /texts, /connectors |
| スイムレーン高さ | 250px固定 |
| ノード間空白 | 50-60px確保 |
| 判断ノードの形状 | rhombus(diamondではない) |
| コネクタ矢印 | endStrokeCap: stealth |
ノードの種類と色
| ノード種別 | 形状 | 色コード |
|---|---|---|
| 開始 | 緑丸 | #D5F5E3 |
| 終了 | グレー丸 | #D5D8DC |
| タスク | 白四角 | #FFFFFF |
| 判断 | 黄ひし形 | #FEF9E7 |
| システム | 薄青角丸 | #EBF5FB |
| データソース | 薄紫角丸 | #F5EEF8 |
| ドキュメント | 薄緑角丸 | #E8F8F5 |
| 差戻し | 赤四角 | #FADBD8 |
スキルのダウンロード
PM研究所コミュニティメンバーは無料。それ以外は ¥4,980 の有料記事。
関連ページ
- Miro(概念ページ)
- 業務フロー設計
- Claude Code Skills
- すぅ AI駆動PM
- DX時代の業務フロー完全ガイド(前提となる業務フロー設計論)
- 非エンジニア向けスキル作成ガイド