【知らなきゃ損するNotion AI実践テク】Vol.3｜シーケンス図やフローチャートを作成する

Web制作に携わる方の中には、日常的に「Notion」を活用している人も多いでしょう。本連載では、NotionのAI機能「Notion AI」を制作現場でより効果的に使いこなすための実践的な活用術を紹介していきます。

今回のテーマは、作図です。Notion AIに指示を出し、シーケンス図やフローチャートを手軽に作成してみましょう。

Notion AI×Mermaidで図表作成を自動化

仕事で業務や処理の流れを可視化したいときに便利なのが、シーケンス図やフローチャートです。シーケンス図は、システムや業務で発生する処理ややりとりを時間の流れに沿って表現し、関係者の動きや処理の流れを直感的に示すことができます。一方、フローチャートは、作業や意思決定のプロセスなどを分岐や矢印で表現する図で、業務フローの整理や改善、手順の共有に役立ちます。

しかし、シーケンス図やフローチャートは便利なものの、作図ツールなどを使って作ろうとすると、手順の整理や矢印の配置、見やすいレイアウトを考える必要があるため、意外と時間や手間がかかります。

そんなときに便利なのが、テキストで図を作成できる「Mermaid（マーメイド）記法」です。Notionではコードブロック内でMermaid記法を使えるため、手軽にフローチャートやシーケンス図を作成できます。文字ベースで構造を記述するだけで、自動的に見やすい図として表示されるので、複雑な業務フローや手順も直感的に理解できるようになります。

Mermaidに不慣れでも大丈夫

ただし、Mermaid記法がわからないという人も多くいるでしょう。そんな人は、Notion AIに頼ってみましょう。新規ページを作成したら、画面下部の「AIに質問する」をクリックします。そして次に、プロンプト入力画面に「ログイン処理のシーケンス図を作成して」のように指示を出します。

するとMermaidコードが自動で生成され、ブロック内の［表示する］に切り替えればシーケンス図が表示されます。同様に、フローチャートを作成したいときは、「○○のフローチャートを作成して」のように頼めばOKです。

もちろん、作成したいシーケンス図やフローチャートの手順をプロンプトで詳細に指示したほうが、より理想的なアウトプットを得られます。ただし、Mermaid記法に詳しくない場合は、まず大まかなベースを作成してもらい、あとからコード表示に切り替えて必要な箇所を修正するとよいでしょう。

このようにまずNotion AIを利用してみれば、Mermaid記法に不慣れな人でも自然に理解を深めることができるはずです。

文：水川歩