マークダウン形式　⇔　フローチャート（図）

ソフトウェア（自作アプリなど）を開発するとき，フローチャートで思考を整理しますよね．
VSCodeの拡張機能：Mermaid Chartをインストールすれば，マークダウン形式で記述したファイルのフローチャートをプレビューできます．

＜サンプルコード＞
stateDiagram
[] --> 起動
起動 --> ログイン : ユーザー認証
ログイン --> ホーム画面 : 認証成功
ログイン --> エラー画面 : 認証失敗
ホーム画面 --> 設定画面 : 設定ボタン
ホーム画面 --> 詳細画面 : 詳細リンク
詳細画面 --> ホーム画面 : 戻る
設定画面 --> ホーム画面 : 保存後戻る
エラー画面 --> ログイン : 再試行
ホーム画面 --> [] : ログアウト

これらを
１行目　　```mermaid

最終行　　```

で囲って下さい．

参考までに，生成AIを用いて，逆（フローチャートを読み取って，マークダウン形式のファイルを作成）も試みてみました．

ChatGPTにフローチャートの画像ファイル.pngをアップロードして，マークダウン形式で出力させた結果がこちら．

おしい！微妙に間違ってますね．
修正は必要ですが，０からマークダウン形式で記述するより，とりあえず他のフローチャート作成アプリで作成したものを読み込ませて，マークダウン形式に変換してもらうと時短にはなりそうです．