業務の流れをチームで共有したいとき、手書きのフロー図やPowerPointでの図解に時間がかかっていませんか？
kinkoziのマークダウンエディタプラグインでは、Mermaid（マーメイド）記法を使って、テキストで業務フローや構成図を描くことができます！
✨ Mermaidとは？
Mermaidは、Markdown内で簡単に図やグラフを描ける記法です。テキストベースで記述できるため、バージョン管理しやすく、修正もラク！
例えば、以下のような業務フローを書きたい場合…
以下のように記載することでエディターのプレビュー画面に図が表示されます。
```mermaid
graph TD
A[受付] --> B{申請内容チェック}
B -- OK --> C[承認]
B -- NG --> D[差戻し]
C --> E[処理完了]
```
このように、マークダウンエディタで図を書くことで、社内のマニュアルなどのドキュメントの管理を一元化することができます。
🧩 どんな場面で使える？
さらに詳しくどのような場合に使えるか例を挙げてみましょう。
対応しているMermaid記法の一部をご紹介します。
| 使用例 | 図の種類 | 書き方の例 |
|---|---|---|
| 社内の申請フローの図解 | フローチャート | graph TD や graph LR |
| 担当業務ごとの分岐図 | シーケンス図 | sequenceDiagram |
| 顧客対応のチャート（例：コールセンターのFAQフロー） | 状態遷移図 | stateDiagram-v2 |
| マーケティング施策の評価 | 4象限グラフ （2次元の散布図を4色に色分けするQuadrant chart） | quadrantChart |
例）社内の申請フローのフローチャート
```mermaid
graph LR
A[申請受付] --> B{内容確認}
B -- OK --> C[上長承認]
B -- NG --> D[差戻し]
C --> E[処理完了]
```
フローチャートのマニュアルはこちら
例）担当業務ごとのシーケンス図
```mermaid sequenceDiagram participant ユーザー participant 営業 participant 経理 ユーザー->>営業: 見積もり依頼 営業->>経理: 金額確認 経理-->>営業: 承認 営業-->>ユーザー: 見積もり送付 ```
シーケンス図のマニュアルはこちら
例）顧客対応の状態遷移図
```mermaid stateDiagram-v2 [*] --> 問い合わせ受付 問い合わせ受付 --> 対応中 対応中 --> 解決 対応中 --> エスカレーション エスカレーション --> 解決 解決 --> [*] ```
状態遷移図のマニュアルはこちら
例）プロジェクト評価・施策検討・マトリクス報告
```mermaid quadrantChart title マーケティング施策の実現性と影響度 x-axis "実現性（低）" --> "実現性（高）" y-axis "影響度（低）" --> "影響度（高）" quadrant-1 "優先実施" quadrant-2 "拡散強化検討" quadrant-3 "効果薄・非優先" quadrant-4 "工数要調整" "SNS広告強化": [0.7, 0.8] "オフラインイベント": [0.3, 0.4] "メルマガリニューアル": [0.6, 0.3] "ブログ追加によるコンテンツ施策": [0.6, 0.7] "事例集の獲得": [0.4, 0.6] ```
4象限グラフのマニュアルはこちら
---
💬 最後に
kinkoziのマークダウンエディタプラグインなら、kintoneの中でテキスト＋図のドキュメント管理が一気に楽になります！
業務フロー図や構成図もMarkdownで統一し、情報共有の質を一段階引き上げてみませんか？
今回は以上になります。
次回は、フローチャートの詳細を紹介いたします。