shikumika’s diary

日々の事務作業で手間なことを簡単にできる仕組み(自動化、方法など)、困ったことの解決方法を調べた備忘録

【Copilot】業務フロー図の作成時間を劇的短縮!Loop × Mermaid記法によるAI活用術

「業務フロー図を作って」と言われたとき、PowerPointやExcelで四角形を並べ、矢印を一本ずつ引いていませんか? 修正のたびにレイアウトが崩れてイライラする……。これでは、本来の目的である「業務改善」ではなく、「作図作業」そのものに多大な時間を奪われてしまいます。。

その時間、AIを使えば大幅に短縮できます。

今回は、Microsoft 365 Copilotの「Pages(もしくはLoop)」と「Mermaid記法」を組み合わせて、業務フロー図を作成する方法を紹介します。

 

内容:

確認のCopilotは2026年1月時点のMicrosoft 365 Copilotです(バージョン19.2601.50081.0)。

職場や学校のMicrosoft 365アカウントを持っていれば利用可能で、組織の管理者が許可していればMicrosoft 365 Copilot Businessのライセンスがなくても利用できる機能範囲を含みます。

1. そもそも「Pages」と「Mermaid」とは?

この手法で使うツールは、職場や学校のMicrosoft 365アカウントで利用可能なサービスを用います。

Pages(Loopページ):Copilot Chat の出力を、後から編集できる文書として保存する仕組みで、Microsoft Loopというサービスがベースになっています。

shikumika.org

Mermaid(マーメイド)記法: 「テキスト(文字)で命令を書くと、自動で図に変換してくれる仕組み」です。通常は書き方を覚える必要がありますが、今回はCopilotに指示して書かせるため、記法を覚える必要はありません。

2. Copilotに「指示」するだけ!実践2パターン

それでは実際に、Copilot Chatに指示を出して、図を作成する方法です。

ここでのポイントは、「Mermaid記法(マーメイドきほう)で書いて」と一言添えることです。

今回は「経費精算の流れ」を事例に、紹介します。

パターン①:【フローチャート】経費精算の流れ

手順の分岐や流れを整理する、最も基本的な図です。

▼Copilotへの指示例(プロンプト)

以下の経費精算フローを、Mermaid記法フローチャートで作成してください。
(1)社員が申請書を作成し、提出する。
(2)部長が内容を確認する。
・承認の場合:経理部へ回す。
・却下の場合:社員へ差し戻す。
(3)経理部が最終確認し、振込処理をして完了。

▼Copilotからの出力結果

チャット画面上に、即座に図が生成されます。 以下のように、シンプルな承認フローだけでなく、Copilotの機転によって部署ごとのレーン(サブグラフ)付きが出力されました。

シンプル版(基本的な承認フロー)が出力されています

Mermaid記法のフローチャート作成例

なお、チャットの全体像は以下です。シンプル版(基本的な承認フロー)と、部署ごとのレーン(サブグラフ)付きが出力されています。

シンプル版(基本的な承認フロー)と、部署ごとのレーン(サブグラフ)付きが作成されている

Mermaid記法のフローチャートの作成例(チャットの全体像)

パターン②:【シーケンス図】経費精算の流れ

「誰が」「いつ」「誰と」やり取りしたか、時系列で表す図です。

分析目的によっては、「シーケンス図」の方が時系列でわかりやすいです。

▼Copilotへの指示例(プロンプト)

以下の経費精算フローを、Mermaid記法シーケンス図で作成してください。
(1)社員が申請書を作成し、提出する。
(2)部長が内容を確認する。
・承認の場合:経理部へ回す。
・却下の場合:社員へ差し戻す。
(3)経理部が最終確認し、振込処理をして完了。

▼Copilotからの出力結果

シーケンス図で指示どおりに出力されている

Mermaid記法のシーケンス図作成例

3. 業務フロー図の修正

業務フローの内容を修正したい場合、再度Copilotに指示すれば修正可能です。

また、Mermaid記法のコードも出力されているので、その内容をもとに修正することも可能です。

以下は、Copilot Chatの画面で出力結果の「表示オプション」を選択し、「水平分割ビュー」でコードと図を表示させた事例です。

「表示オプション」でコード、水平分割ビューが選択できる

Mermaid記法のコード確認例

なお、チャットの応答画面ではコードの編集ができませんが、応答結果の下部にある「Pagesで編集」を選択し、ページの画面にすることでコードの編集をした図の調整も可能です。

これは、PagesのベースにあるMicrosoft LoopがMermaid記法に対応しているからです。

shikumika.org

4.補足情報

Mermaid記法について

Mermaid(マーメイド)記法とは、「テキストを書くだけで自動的に図を作ってくれる」便利な仕組みです。

これまで、パワポやExcelなどで作った図は修正が大変で、「図だけ古いまま放置」ということもありがちでした。Mermaidは「図も文字と同じように簡単に直したい」という発想から生まれた、世界中で愛用されている技術です。

元々はITエンジニアのツールでしたが、Microsoft Loopなど、身近なアプリでも使えるようになりました。これを活用すれば、「フローチャート」「シーケンス図」「ガントチャート」「マインドマップ」などの図がサッと描画できます。

以下は、Mermaidに関する参考情報(英語)です。
初心者向けページ(フローチャート): https://mermaid.js.org/syntax/flowchart.html

個人向けの無料版(copilot.microsoft.com)での注意点

個人向けの無料版(copilot.microsoft.com)では、Mermaid(マーメイド)記法によるコード出力までしかできません。図への変換を指示しても意図した図にならない、編集が難しいという状態でした。

Microsoft 365 Copilotとは「Pages」の機能が異なります。

 

以上、Microsoft 365 Copilotで、業務フロー図の作成時間を劇的短縮!Loop(Pages) × Mermaid記法によるAI活用術でした。