この文書では ChatGPT デモ、ドキュメント生成コードは、ご自身で画像をエクスポートするソフトウェアに合わせてください。
プロンプト・ワード生成のフローチャートは、面倒な作業を素早く視覚的に要約し、記事の生成に、よりユーザーフレンドリーなグラフィカル要素を含めることを可能にする。
関連ツール
1.Mermaidは、フローチャート、タイミング図、クラス図などを作成するためのJavaScriptライブラリです。
2.Mindmapは、マインドマップ、マインドマッピング、ブレインマッピングのシナリオで一般的に使用される概念図を構築するためのツールです。
3.GraphvizDOTは、フローチャート、状態遷移図、組織図、タイミング図などを作成するツールで、ノードとエッジを使用して関係を表現し、豊富なレイアウトオプションで図の外観を制御します。
フローチャートの作成
手がかり
mermaid
円グラフ：円グラフキーワードを使う。
フローチャート：後で詳しく説明する graph キーワードを使用する。
シーケンス図: sequenceDiagram キーワードの使用法
ガントチャート：ガントキーワードを使う
クラス図: classDiagram キーワードを使用します。
状態図: stateDiagram キーワードを使用する
ユーザージャーニーマップ：ジャーニーキーワードの使用
スタートアップの例
#### chatGPTを使用してマーメイドプロット式を生成する方法
ひとつはプロンプトから必要なプロセスの説明を生成すること、もうひとつはプロンプトからプロセスのマーメイド表現を生成することである。
一般的なヒント
役割：あなたは`***'の専門家です。
タスク1：***`シナリオ、全体のプロセスはどのようなものか、具体的なインタラクションの流れを示す。
タスク2：上記のプロセスをマーメイド構文を使ってもう一度書く##### 例：ダイアグラムを使用したフローチャート作成
diagrams.netを開く (https://app.diagrams.net/) フローチャートを生成するために、AdvancedのMermaid構文フローチャートコードをコピーする。
フローチャートの作成
“`mermaid
graph TD;
A[ユーザー] -> B[ブラウザ]。
B -> C [DNSサーバー]。
C -> D [ローカルキャッシュ]。
D -> |キャッシュミス| E[DNS解決]。
E -> F [DNSサーバー]。
F -> G [IPアドレスの取得]。
B→H[ウェブサーバー]。
H→I[TCP接続要求]。
I -> J [ウェブサーバー]。
J -> K [HTTPリクエスト]。
K -> L[リクエストメソッド、リクエストヘッダ、リクエストボディ]。
J -> M [処理要求]。
M -> |既存リソース| N [応答メッセージを返す]。
N -> O[レスポンスステータスコード、レスポンスヘッダ、レスポンスボディ]。
B -> P[ブラウザがレンダリングされたページを解析する]。
O –> P;
M -> |リソースが存在しない| Q[404ステータスコードを返す；］
Q –> O;
P -> R [リソースのダウンロード]。
R→S[リソースを得る]。
H -> T [リソース要求の処理]。
T -> |既存リソース| U [リソース応答メッセージを返す]。
U -> V[リソースのステータスコード、レスポンスヘッダ、レスポンスボディ]。
R –> P;
T -> |リソースが存在しません| W [404ステータスコードを返す]。
W –> U;
“`
シーン別手早く描く方法
1.ブラウザのURLインタラクション・フローのシーケンス図、diagram.netへのマーメイド式のインポート
“`mermaid
sequenceDiagram
参加者ブラウザ
参加者DNSサーバー
参加者ウェブサーバーブラウザ->>DNSサーバー：DNSは、ウェブサイトのドメイン名のIPアドレスを問い合わせる
DNSサーバー->ブラウザ：IPアドレスを返すブラウザ->ウェブサーバ：HTTPリクエストの開始
ウェブサーバー->ブラウザ：HTTPレスポンス（HTMLコンテンツ）を返すブラウザ->ウェブサーバ：HTML埋め込みリソース（画像、スタイル、JSなど）をリクエストする。
ウェブサーバー->ブラウザ：リソースコンテンツに戻るブラウザ->>ブラウザ：HTMLとリソースの解析、ウェブページのレンダリング
ブラウザ->ユーザー：ページを表示ユーザー->ブラウザ：ウェブページとやりとりし、新しいリクエストを生成する
ブラウザ->ウェブサーバ：HTTPリクエストの開始
ウェブサーバー->ブラウザ：HTTPレスポンスを返す
“`
2.WeChatアプリにアクセスするユーザーのインタラクションシーケンス、diagram.netにマーメイド式をインポートする。
“`mermaid
sequenceDiagram
参加者ユーザー
参加者wechatアプリ
参加者 ローカルVPNサーバー
参加者用Wechatサーバーユーザー->WeChat APP: WeChat APPアイコンをクリックします。
WeChat APP->WeChatサーバー: HTTPSリクエストの送信
WeChatサーバー->WeChat APP: HTTPレスポンスを返す
WeChat APP->>WeChatサーバー：応答メッセージの解析ユーザーへの注意事項：VPN接続を確立する手順は以下の通りです。
ALTネットワークはマイクロソフトのサービスの対象外です。
WeChat APP->>ローカルVPNサーバー：VPN接続要求の送信
ローカルVPNサーバー->WeChatサーバー：VPN接続の確立
end
“`
3.WeChatアプリにアクセスするユーザーのインタラクション・フローチャート、diagram.netへのマーメイド式のインポート
現在のテキスト環境ではマーメイド構文が正しくパースされないため、マークダウン・フォーマットと互換性があるように変更することができます。
“`mermaid
サブグラフ クライアント
クリック[WeChat APPアイコンをクリック] -> リクエスト[WeChat APPがWeChatサーバーにHTTPSリクエストを送信]。
endサブグラフ ローカルVPNサーバー
判定[ネットワークがWeChatのサービス範囲内にあるかどうかを判定する] ->|入っていない| 確立[WeChat APPがローカルVPNサーバーに接続要求を送信し、VPN接続を確立する]。
endサブグラフ wechat サーバー側
リクエスト -> 認証 [マイクロソフト・サーバー認証とリクエストの認証］
authenticate ->|request is legitimate| response[WeChatサーバーがWeChat APPにHTTPレスポンスメッセージを返す]。
レスポンス→パース[マイクロソフトのアプリがレスポンス・メッセージをパース]。
endparse ->|required| request_more [WeChat APPからWeChatサーバーへのさらなるリクエストとインタラクションを開始する]。
“`
句読点表現は、コロンやカンマなど、英語の書式である必要があります。
マインドマップを作成する
手がかり
Mindmap
スタートアップの例
キュー・ワード：
八大名所を訪れ、マインドマップと組み合わせ、マインドマップ・マークアップ言語を生成するプロセス
出力コード：
バダチでのプレーの流れ
- 意図する
- 遠足の日程を決める
- チケット購入
- 天気予報をチェックする
- 水、スナック、日焼け止めなどを用意する。- バダチ到着
- バス／車で到着
- 駐車場探し／駐車券購入
- 景勝地に入る- 観光
- 玉仏寺参拝
- 十三の墓を訪ねる
- 青龍湖へ
- 千フィートの岩を登る。
- 狼の谷の風景を体験する
- 植物園ツアー
- 氷の世界をプレイ
- エキサイティングなバンパーカーを紹介- ダイニング
- レストラン選び
- 料理を注文する
- ダイニング- 休憩
- 休憩
- エネルギーのための飲料水- ツアーの続き
- ジップラインに挑戦
- ロッククライミングに挑戦してみよう。
- ラフティングのスリルを味わう
- カルーセルとの出会い- お土産の購入
- 土産物店の選択
- お土産の購入
- 支払い- バダチから離れろ。
- 徒歩／バスで帰宅
- 持ち物の整理
- 楽しい一日の終わり
コードの例：
バダチでのプレーの流れ
- 意図する
- 遠足の日程を決める
- チケット購入
- 天気予報をチェックする
- 水、スナック、日焼け止めなどを用意する。- バダチ到着
- バス／車で到着
- 駐車場探し／駐車券購入
- 景勝地に入る- 観光
- 玉仏寺参拝
- 十三の墓を訪ねる
- 青龍湖へ
- 千フィートの岩を登る。
- 狼の谷の風景を体験する
- 植物園ツアー
- 氷の世界をプレイ
- エキサイティングなバンパーカーを紹介- ダイニング
- レストラン選び
- 料理を注文する
- ダイニング- 休憩
- 休憩
- エネルギーのための飲料水- ツアーの続き
- ジップラインに挑戦
- ロッククライミングに挑戦してみよう。
- ラフティングのスリルを味わう
- カルーセルとの出会い- お土産の購入
- 土産物店の選択
- お土産の購入
- 支払い- バダチから離れろ。
- 徒歩／バスで帰宅
- 持ち物の整理
- 楽しい一日の終わり
>上記のコードは、ノートで直接実行することはできません、[マインドマップを生成](https://markmap.js.org/repl)をクリックして、コードがコピーされ、直接元の画像をダウンロードすることができます。
複雑なフローチャートの作成
手がかり
GraphvizDOT
スタートアップの例
キュー・ワード：
Graphviz DOTジェネレーターとして、意味のあるチャートを作成するエキスパートになってほしい。水循環グラフの作成を手伝ってほしい。コードの内容は中国語です。
出力コード：
digraph G {
rankdir=LR;
node[shape=circle, fontname=”Arial”];
edge[fontname=”Arial”, fontsize=12];// 定义节点
地球 [label="地球"].
湖 [label="湖"].
オーシャンズ [label="Oceans"]。
太陽 [label="Sun"]。
大気 [label="大気"].
雲 [label="Clouds"]。
雨 [label="Rain"]。
氷と雪 [label="氷と雪"].
河川 [label="河川"].
植生 [label="植生"].// 定义边
太陽→大気[label="放射線"]。
大気→地球 [label="放射線"].
地球 -> 湖沼 [label="地下水の涵養"].
地球 -> 海洋 [label="川の補充"].
湖→川 [label="Streams"]。
海洋 -> 大気 [label="Evaporation"].
大気 -> 雲 [label="凝縮"]。
雲→雨[label="Precipitation"]。
降雨→湖[label="流出"]。
雨量 -> 流量 [label="流出"]。
氷→湖 [label="Melt"];；
氷と雪→川[label="melting"]。
植生 -> 大気 [label="蒸散"]。
植生 -> 地球 [label="土壌水分"]。
}
高度な例
キュー・ワード：
意味のあるグラフを作成するエキスパートであるGraphviz DOTジェネレーターとして活躍してほしい。グラフは少なくともn個のノードを持ち（私は入力で[n]と書いてnを指定します、10がデフォルトです）、与えられた入力の正確で複雑な表現でなければなりません。各ノードは出力サイズを小さくするために番号でインデックスされ、スタイルを含まず、layout=neato, overlap=false, node [shape=rectangle]でパラメータ化される。コードは有効で、エラーがなく、説明なしで1行で返されなければならない。ノード間の関係は、その入力の専門家にとって意味のあるものでなければなりません。私の最初の図は「水の循環 [8]」です。
> この例は、役割を強化し、nを変数として取り込み、コードを抽象化し、スタイル要件、パラメーターの命名、コードの妥当性を向上させ、冗長なコードを削減する。この例はさらに多くの可能性を提供する。
出力コード：
digraph {
layout=neato; overlap=false; node [shape=rectangle];
0[label="気化"]；
1[label="大気"].
2[label="結露"].
3[label="降水量"].
4[label="土地"].
5 [label="地下水"].
6[label="表面流出"].
7[label="海と海"].
0 -> 1;
1 -> 2;
2 -> 3;
3 -> 4;
3 -> 5;
3 -> 6;
3 -> 7;
}
erDiagram
USERS ||-o{ USER_ROLES }o-|| ROLES : "ユーザー・ロール"MAPS }o–|| LEVELS : level
LEVELS ||–o{ OBJECTIVES } : objectiveusers {
uuid user_id
text email
text date
int requests_count
user_id *–1 user
}chats {
uuid chat_id
uuid user_id
timestamp creation_time
json history
text chat_name
}chat_history {
uuid message_id
uuid chat_id
text user_message
text assistant
timestamp message_time
}vectors {
uuid id
text content
jsonb metadata
vector(1536) embedding
}stats {
timestamp time
boolean chat
boolean embedding
text details
jsonb metadata
serial id
}summaries {
bigserial id
uuid document_id
text content
jsonb metadata
vector(1536) embedding
}api_keys {
uuid key_id
uuid user_id
text api_key
timestamp creation_time
timestamp deleted_time
boolean is_active
}brains {
uuid brain_id
text name
text status
text model
text max_tokens
float temperature
}brains_users {
uuid brain_id
uuid user_id
varchar rights
boolean default_brain
}brains_vectors {
uuid brain_id
uuid vector_id
text file_sha1
}brain_subscription_invitations {
uuid brain_id
varchar email
varchar rights
}migrations {
varchar name
timestamptz executed_at
}
