LoginSignup
31
20

More than 1 year has passed since last update.

ChatGPT×MarkMap: 簡単マインドマップ生成

Posted at

概要

マインドマップはトニー・ブザンという人が提唱した、「頭の中を書き出す」ことに優れた図の書き方です。

中央にテーマを書き、枝分かれする形でサブテーマ、サブテーマのサブテーマを書いていきます。

mindmap.png

そしてMarkMapはマインドマップをマークダウン記法から生成してくれるライブラリです。

今回はそのVSCode拡張機能を使いました。

最後にChatGPTは皆さんご存知のAIとチャットできるWebサービスです。

今回はこれらを組み合わせて、いろんな物事のあらましを素早く掴める状態にしたいと思います。

必要なプロンプト

驚いたのですが、ChatGPTはすでにMarkMapの特徴を知っています。

はい、markmapというライブラリを知っています。markmapは、マークダウン形式のテキストをマインドマップに変換するJavaScriptライブラリです。このライブラリを使うと、マークダウンの見出しやリストを視覚的に表現でき、情報の構造化や整理が容易になります。

markmapは、主に以下の特徴があります:

マークダウン形式のテキストをマインドマップに変換
見出しタグ(例:#、##)による階層構造の生成
リスト(箇条書き)のサポート
一部のマークダウン記法(リンク、太字、斜体など)のサポート
インタラクティブな操作(ズームイン・アウト、ノードの折りたたみ・展開など)
SVG形式での出力が可能
このライブラリは、情報を整理したり、アイデアを視覚的に表現する際に非常に便利です。しかし、マークダウンの全ての記法をサポートしているわけではないため、利用時にはその点に注意が必要です。

なのでプロンプトは、MarkMapに対応したマークダウン記法を使って、{IDEA}の情報を出力してみてくださいといったものになります。

ChatGPT3.5と4で微妙に結果が異なりましたが、どちらにしても

スクリーンショット 2023-03-28 20.34.35.png

上記のようにコピーできる形で出してくれるはずです。

出してくれない場合は例を示してみましょう。

あるいは、その情報をコピーして使いたいので、 ```markdown と ``` でくくってみてくださいというプロンプトも効果的でした。

VSCodeで確認

コピーできる形で出してくれたら、VSCodeで.mdファイルを作って確認してみます。

拡張機能が入っていたら、画面上部のメニューにプレビューボタンができているはずなので、それをクリックします。

スクリーンショット 2023-03-28 20.44.21.png

こんな感じで綺麗に出力されます(ところどころ文字が切れているのは日本語対応のせい?)。

応用可能性

知らない業界・分野の概要をつまみ食いしたいとき

使えますが、嘘が混じる可能性は捨てきれません。

例えば自分の場合、先ほどの「フロントエンドのスキルマップ」マインドマップはわりと良さそうと判断できましたが、

スクリーンショット 2023-03-28 20.49.29.png

DDD(ドメイン駆動設計)の場合、どの程度参考にして良いのか判断できませんでした。

知っている情報をまとめてほしいとき

スクリーンショット 2023-03-28 20.51.16.png

これはビートルズの情報を出してもらったものです。

自分はある程度ビートルズを知っているので、このマップの正しさを判断できます。

それでいて「まとめろ」と言われたら大変だったと思うので、ChatGPTの便利さをある程度実感できます。

常識のリストがほしいとき

これがおすすめの使い方です。

常識のリストとは、言われてみると納得できるけれど常識的すぎて逆に例を挙げにくいリストです(自分の造語です)。

例えば、以下は髪型のリストです。

スクリーンショット 2023-03-28 20.57.13.png

言われてみると髪型はこのように分かれると思います(ちょっと女性の髪型に寄り過ぎな気もしますが)。

このように、常識的な情報もあえてリストにしてみることで参考になったりします。

まとめ

マインドマップは一見して構造が分かる優れた描画方法です。

ChatGPTとMarkMapを利用することで、これを手軽に作ることができます。

31
20
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
31
20