はじめに

「あー、また処理フロー図を作らないといけない…けど、処理の流れを整理して綺麗なフロー図を作るのは大変だな…」

そんな風に思ったことはないでしょうか？
私はあります…何度も…

プロジェクトマネージャーとして、エンジニアと話し合いながら処理フローを整理していくのは大切な仕事です。
でも、毎回Draw.ioで一から図を描くのは、正直めんどくさい。

「AIに任せられないかな？」
そう思って作ったのが、今回のCursorを使った処理フロー自動生成の仕組みです。

作ったものの概要

何ができるのか？

  • 「処理フロー作成開始」とチャットで一言言うだけで自動起動
  • 8つのステップで段階的にドキュメントを整理し処理フローを作成
  • 業務分析からDraw.ioファイル生成まで一連の流れを自動化
  • 処理の流れを理解するために最適化されたシンプルなフローチャート

生成されるもの

cursor/flow/
├── {フロー名}_01_business_process_analysis.md # 業務分析
├── {フロー名}_02_flow_design.md # フロー設計
├── {フロー名}_03_flow_chart_generation.md # 生成仕様
├── {フロー名}_04_quality_check.md # 品質チェック
├── {フロー名}_05_flow_completion.md # 完成確認
└── {フロー名}_processing_flow.drawio # Draw.ioファイル

技術的な工夫と苦労話

私が個人開発でオープンソースとして公開しているMarkdown記法をBacklog記法に変換するObsidianプラグインをターゲットとして使用してみます。

1. 処理フローの出力形式

まずは、生成AIが取り扱いやすいMermaid記法(Markdown形式で図表を描くことができる記法)で、ソースコードから処理フローの作成をCursorに指示しました。
「markdownをbacklog形式に変換する処理の処理フローをMermaid形式で作成して」
すると以下のような処理フローを作成してくれました。

  • 再利用しにくい
    • Mermaid形式で作成されているため処理内容変更や図・線の微修正を行うにはMermaid記法の理解が必要
    • 他の人にファイルを共有してもプレビューするための環境が必要

やはり処理フロー図はDraw.io形式で作りたいと考えました。

  • Draw.ioを扱えるようにするには
    • Cursorでは各種プラグインが利用できますので、Draw.io形式のファイルが扱えるようになる「Draw.io Integration」という拡張機能を追加する。
    • Cursorに指示する際に「Draw.io形式でXXXを作成して」と命令をする。
    • これでCursorが直接Draw.io形式でファイルを作成してくれます。

2. Cursorの生成物の精度を上げるためのステップ設計

最初は「MarkdownからBacklog記法への変換の処理フローをDraw.io形式で作成してください」とCursorに指示を出しました。
それっぽい処理フローは生成されたのですが、図がずれてる・処理が足りない・フローの流れがおかしい・例外処理がないなど、結果は散々でした。

  • 生成されたものの精度が良くない
    • 処理の流れをきちんと理解してくれていない
    • 適切なフロー設計ができておらず、分岐がない（判断ポイントを見落としている）
    • 例外処理が考慮されていない

そこで考えたのが、私が処理フローを作成する際にすることを整理し、同じ流れでCursorに１つ１つ順番に処理フローの作成を実施してもらうことを考えました。

  • 整理した処理ステップ
    • ひな型を用意する
    • ソースコードを読んで処理内容を調査する
    • 処理フローの構成を考える(下書き)
    • 処理フローを作成する
    • 作成した処理フローの内容をチェックする

さらに各ステップでエビデンス(ドキュメント)を残していくことで、Cursorが前のステップの内容を理解して次のステップの処理に進めるようにしました。
これらの内容をCursorとやり取りしながら、Cursor Rulesとして作成しました。

2. Rules記述方法の工夫

ここが一番苦労したポイントです。
CursorにRuleを作成してもらいテストを繰り返してみると、処理の順序や指示内容がうまく伝わらないことに気づきました。

  • Markdown形式のルールだとCursorが間違いを起こしやすい
    • ステップごとに構造化された情報が分かりにくい
    • 依存関係や順序が曖昧となっている
    • 設定したい値と説明文が混在している

CursorとRuleの作成を何度か繰り返しているうちに、以下で作成したものがもっとも正確に再現性が高く処理フローの作成が出来る事がわかりました。

  • 独自のルール記載形式 
    [cursor.processing-flow.flow_chart_generation]
description = "フロー設計を基に処理フロー図を直接更新する..."
depends_on = ["flow_design"]
strict_order = 6
ai_generated = true
flow_chart_update = true
  • ポイント
    • depends_on: 依存関係を明確化
    • strict_order: 実行順序を強制
    • ai_generated: AIが生成すべきかどうかを明示
    • flow_chart_update: 特殊な処理フラグ

3. テンプレートベースの指示

正確な処理フローを作成出来るようにはなったのですが、ここまでの対応では、デザイン面の統一性がないなど綺麗なイメージ通りの処理フロー図は作れませんでした。
ここでも、自分で処理フローを作成する際にどうしているかを振り返り、参考となる他の人が作った処理フローをもとに真似して作成するアプローチを考えました。
処理フローのサンプルだけでなく、処理の調査・分析やフロー構成検討用のテンプレートファイルも用意して処理前に読み込ませテンプレートベースで作業を進めるように、ルールに組み込みました。

  • 処理フローのサンプル

実際に動かしてみた結果

指示内容

私「処理フロー作成開始」

Cursor「処理フロー作成のワークフローを開始いたします。まず、処理フロー名を教えてください。」

私「MarkdownからBacklog記法への変換」

Cursor「ソースコードを詳しく調査した結果を基に、詳細な処理フローを作成いたします。まず、業務プロセス分析から始めましょう。」
Cursor「次に、フロー設計の詳細を作成いたします。」
Cursor「次に、フローチャート生成の詳細を作成いたします。」
Cursor「次に、品質チェックの詳細を作成いたします。」
Cursor「最後に、フロー完成の詳細を作成いたします。」

私「(調査結果・フロー生成詳細を確認し)この内容で問題ないです」

Cursor「Draw.ioファイルを作成いたします。ソースコードの分析結果に基づいて、詳細な処理フロー図を作成いたします。」

作成された処理フロー

処理内容が正確に調査・分析され、１分程度の時間でイメージした通りの処理フロー図を生成してくれました！

Cursorのルール作成で学んだこと

1. 生成AIの生成物の精度は「ステップを踏ませる」ことで向上する

一発で完璧な結果を求めるのではなく、小さなステップに分けて実行させ、各ステップで生成AIの理解を深めていくことが重要でした。

2. Rules記述は「構造化」が大事

Markdownではなく、独自の構造化された形式（.mdc）を使うことで、生成AIが設定を理解しやすくなりました。

3. テンプレートを用意する

テンプレートをあらかじめ用意して成果物のイメージを生成AIに伝えることで、全体の精度が向上しました。

4. ドキュメントは「生成AIの記憶」として使用

各ステップでドキュメントを残すことで、生成AIが前ステップの内容を「記憶」し、一貫性のある結果を生成できるようになりました。

まとめ

Cursorを使った処理フロー自動生成の仕組みを作ってみて、改めて感じたのは 「生成AIは万能ではないが、適切なルール設計と適切なインプットを与えれば、期待以上の成果物を生成し、驚くほど優秀」 ということです。

今回のポイント
1. 段階的なアプローチ 「一発で完璧を求めない」
2. 構造化されたRules 「曖昧さを排除した設定」
3. ドキュメントの蓄積 「AIの「記憶」を活用」
4. 適材適所 「AIに任せる部分とテンプレートとの役割分担」

この仕組みを作ることで、処理フロー図作成の時間を大幅に短縮することができ、PMとしての業務効率が格段に向上しました。

今回行ったように、人が普段している作業をステップとして段階的に分解しルールに落とし込んでいくアプローチは他のタスクでも色々と流用できそうです。
今後もプロジェクトマネジメント業務の効率化への生成AI活用を模索していきたいと思います。