📘VISUAL WEAVER
構造化 → 4形式HTMLビジュアル生成 | 2ステップツール

原文がすでに章立てされている場合は、ステップ2へ進むだけで使えます。このページはAIへの指示文(プロンプト)を組み立てるだけで、実際の文章化・HTML化はAIに実行させます。

ステップ1:原稿を構造化する

元の文章から、タブ・手順・注意・コピペ文などを専用タグで印を付けた「構造化原稿」を作らせるプロンプトを生成します。この工程は省略できます。

🧪 1. 構造化ルール(Recipe)

重要: この工程では「文章を良く書き直す」のではなく、「原文のまま専用タグで印を付ける」だけです。次工程のHTML生成メーカーが、このタグだけを見てレイアウトを組み立てます。

🧩 2. 入力文(Ingredients)

文章が一続きになっていても構いません。見出し、番号、手順、注意書き、コピペ用の文例などを手掛かりに構造化させます。
ChatGPT向け 構造化:標準 HTML前処理

AIが返したタグ付き原稿

上のプロンプトをAIで実行し、返ってきた文章をここに貼ってください。ここにある文章だけをステップ2へ渡します。

ステップ2:出力形式を選んでHTMLを作る

「元になる入力文」に直接貼り付けるか、ステップ1の結果を左のボタンで転記します。ここで4種類から出力形式を選び、その形式専用のHTML作成プロンプトを生成します。

🧪 1. ツール設計(Recipe)

原稿は同じままでも使えます。選んだ形式に応じて、ステップ2のプロンプト内容が自動で切り替わります。

🧩 2. 入力情報(Ingredients)

ステップ1と同じ会話でそのまま続けて使う場合はこのままでかまいません。別のAI・別の会話に渡す場合は、実際の原稿に置き換えてください。
ChatGPT向け タブ型HTMLマニュアル カラフル タブ切替あり

完成HTMLの受け取り

ステップ2では、選んだ4形式のいずれかに最適化したHTMLファイルの作成をAIへ依頼します。インフォグラフィックやフロー図もHTML/CSS/インラインSVGで生成するため、ブラウザ表示をそのままスクリーンショットして画像化できます。