🥝

Copilot CoworkでMermaidのシーケンス図をExcel化

に公開

CoworkによってExcel上に描画されたシーケンス図

上の Excel の図、セルやテキストの擬似描画ではなくすべてネイティブの図形(DrawingML)で描かれています。
これを M365 Copilot の Cowork に Mermaid のシーケンス図を渡すだけで生成できたので、やり方を共有します。

背景・モチベーション

LLM と対話しながら設計・修正できて、diff 管理も効くため、シーケンス図などの設計図は Mermaid で書いています。

ここまで AI と一緒に作っているのだから、Excel 納品が必要な場面でも最後の変換も任せたいと思って試してみました。

Copilot Cowork とは

Coworkは M365 Copilot の新機能で、Outlook・Teams・Word・Excel・PowerPoint などのM365 アプリを横断して、複数ステップのタスクを自律的に実行してくれるエージェント型 AI です。

現時点ではM365 Copilot ライセンス + Frontier プログラム(早期アクセス)への登録が必要です。

https://learn.microsoft.com/ja-jp/microsoft-365/copilot/cowork/

やり方

手順自体はとてもシンプルです。

  1. Mermaid ファイル(.md)を Cowork に添付
  2. プロンプトを投げる
  3. Cowork がバックグラウンドでコード生成・実行
  4. .xlsx が出力される → 開くとネイティブ図形でシーケンス図が再現されている

入力した Mermaid コード

今回使ったサンプルはこちらです。loop / opt / alt-else / 自己メッセージ / エラー / Note と、主要な要素が一通り入っています。

sequenceDiagram
  participant A as A
  participant B as B
  participant C as C
  Note over A,C: 開始
  A->>B: 処理
  B-->>A: 応答
  loop 繰り返し
    B->>C: 処理
    C-->>B: 応答
    opt 追加処理がある場合
      B->>B: 追加処理
    end
    alt 条件を満たす場合
      B->>C: 処理
      C-->>B: 応答
    else 条件を満たさない場合
      B-x A: エラー
      Note over A,B: 補足
    end
  end
  B-->>A: 完了
  Note over A,C: 終了

試行錯誤

最初は「添付したシーケンス図を Excel 上で図形を使って再現してください」と投げてみたのですが、返ってきたのはセルで表現した擬似描画でした。
Cowork 組み込みの Excel スキルを自動で使ってくれたのですが、セル・数式・チャート向けで図形描画は守備範囲外らしくうまく出力できませんでした。

そこで「図形を使って再現してほしい」と再度指示をしたところ、ちゃんとネイティブ図形で描いてくれました。
そこからさらに時間をかけて LLM と一緒にプロンプトを練り上げ、矢印のスタイルや枠の描き方まで細かく制御できるようになりました。

プロンプト解説

完成したプロンプトのポイントを抜粋すると:

  • 方針の指定: openpyxl で空の xlsxdrawing1.xml を直接書き → 再 zip という組み立て手順を明示し、配置は absoluteAnchor 固定
  • 擬似描画の禁止と図形仕様の細部制御: 矢印の線種/終端/色、Note の背景、alt/loop の入れ子描画まで指示
プロンプト全文
添付の Mermaid シーケンス図を、Excel ネイティブの図形 (DrawingML) として再現してください。
セルや文字での擬似描画は不可、実際の矩形・直線・コネクタで描く。
出力は `output/<拡張子を除いた basename>.xlsx`。

## 実装方針
- openpyxl で空の xlsx を生成 → zipfile で展開 → `xl/drawings/drawing1.xml` を手書きで追加 → `sheet1.xml` に `<drawing r:id="…"/>` 要素を追記、`xl/worksheets/_rels/sheet1.xml.rels` と `[Content_Types].xml` を更新 → 再 zip。
- 図形は全て `<xdr:absoluteAnchor>` で配置、シェイプ ID は一意。

## スコープ
入力に出てくる矢印種・枠種・要素のみ実装。汎用テーブルやディスパッチ辞書は書かない。Mermaid のパーサも不要で、入力をそのままイベント列としてハードコードしてもよい。

## 全体レイアウト
- `participant` 宣言順に左からレーンを並べ、各レーンの上に色付きヘッダー(レーンごとに識別可能な色)、下に薄灰破線のライフラインをシート末尾まで伸ばす。
- 最上部にタイトル帯(濃紺地・白文字、`title` 指定があればそれ、無ければ「シーケンス図」)と凡例帯を置く。
- 凡例には入力に実際に登場した矢印種別と枠種別のみを登場順に並べ、コード記法は書かず日本語で短く意味だけ示す。
- 配置は absoluteAnchor のピクセル指定。レーン幅・行間は内容量に応じて自動。

## メッセージ矢印
- スタイルは記法から機械的に導出する:
  - 線種: `-` 系=実線、`--` 系=破線 (`prstDash="dash"`)
  - 終端: `>>`=閉じた三角、`)`=開いた矢印、`x`=×印、無印=線のみ。
  - 色: 応答 (`-->>`) は青、非同期 (`-)`/`--)`) と エラー (`-x`/`--x`) は赤、その他は濃灰
  - 双方向 (`<<->>` / `<<-->>`) は両端に三角
- ラベルは矢印の真上に配置(進行方向に合わせて寄せ、wrap あり)。自己メッセージは「右に出て下りて左に戻る」コの字で描き、ラベルはループの右。
- prstGeom には x 型のヘッドも自己ループ図形も無いため、×印と自己メッセージは複数の line を合成して描く。

## Note
- 淡黄色の角丸枠+黒文字。
- `<br/>` は改行に変換。
- `over` は対象レーン範囲を覆う、
- `left of`/`right of` はレーンの外に小さめに配置。

## 枠
- 種別ごとに識別可能な塗り色と線色を割り当て、左上に種別タグ+条件ラベルを置く。
- 区切り語 (`else` / `and` / `opt`) は枠を閉じず、破線の区切り線+その語+条件ラベルを内側に描く。
- 入れ子の場合は枠が重ならないように、内枠を外枠から左右 7px ずつインセットし、ネスト深さに比例して詰める。

## その他要素
- `autonumber` 指定があればメッセージ左端に通し番号を付ける。
- `activate`/`deactivate` は対象レーン上にレーン色の細い縦長矩形を描く。

## 文字スタイル
- 目安サイズ: タイトル 18pt、見出し 12pt、アクター 14pt、本文 8〜9pt。
- ラベルが長い場合は文字数 / レーン幅で改行数を見積もり、矩形の高さを自動で広げる。

## 検証
- PDF 化や画像化は不要。
- ビルド後、`zipfile` で全エントリを列挙し、`.xml`/`.rels` を `xml.etree.ElementTree.fromstring` でパースして well-formed を確認するまでをタスクに含める。

結果

冒頭の画像のように、以下の要素がすべてネイティブ図形として再現されました。

  • ライフライン(破線)
  • メッセージ矢印(実線 / 破線 / ×印)
  • loop / opt / alt-else の枠(入れ子対応)
  • Note(淡黄色の角丸枠)

処理時間と今後の展望

今のままだとサンプル程度の図でも、長いときで 10 分弱かかっちゃいます。
スクリプトの実行自体は一瞬なんですが、コードを書き出す部分でかなり時間を食います。

これを縮める一番の手はコード生成を毎回やらせないことだと思っています。
今後はこのプロンプトとスクリプト自体をスキル化し、Mermaid を渡すだけで XLSX が出る状態を目指したいです。

まとめ

Mermaid × LLM × Copilot Cowork を組み合わせることで、「図の設計から Excel 納品用ファイルの生成まで」を AI で一気通貫に回せることが確認できました。

プロンプトの作り込み次第でかなりの精度が出るので、Mermaid の Excel 化が必要な際は参考にしていただけたら嬉しいです!

ヘッドウォータース

Discussion