DeepResearchをよく使う方にぜひ知ってほしい！どんなインプットも美しく読みやすいHTMLレポートに変換するプロンプト文


## はじめに

大量のテキスト情報、どう整理・共有していますか？
DeepResearchの結果、長時間の会議議事録、複雑なソースコード... そのままでは理解しにくく、共有するのも一苦労ですよね。

「もっと分かりやすく、見栄えの良いレポートにしたいけど、時間がない...」
「手作業でのフォーマット調整は面倒すぎる...」

そんな悩みを解決する**強力なプロンプト文**をご紹介します。
このプロンプトを使えば、様々なインプットを、まるでプロがデザインしたような、**構造化された美しいHTMLレポート**に変換できるんです！


https://x.com/00oichan/status/1910983779264372875

## プロンプト文はこちら

早速ですが、そのプロンプトがこちらです。

```text
インプットの内容を理解して、読みやすいHTMLレポートを作成してください。

要件：

　文章構成：
　- Wordpressのおしゃれマガジンブログ風デザインを参考にする。自然な文章で読みやすいレポートを作成する。
　- 目次と項目リンクを作成
　- 章・節・項に階層番号を付与 (例: 1., 1.1, 1.1.1)
　- 事例、ユースケース、比較を追加して理解を促進
　- 巻末に参考文献・参考リンクリストを掲載
　- 概要や仕組みを説明するときは、文章とともにHTMLで表現可能な簡易的な図形やフロー、インフォグラフィックを活用して視覚的に表示
　- 出力文字量はインプットの7割以上を維持
　
　
　文法：
　- JTF日本語標準スタイルガイド準拠。文法的に正しく自然な日本語で記述
　- 箇条書きリストに番号または記号を使用
　- 主語・述語を明確にする
　- 一段落は3〜4行程度。- 一文は1〜2行程度

　書式：
　- 情報整理が必要な場合や一覧情報は表形式で表示
　- 表の左端列に必ず番号を付与
　- タイトルにデザイン性の高い仕切り線を追加

　- 表の列見出しは「紺色セル背景・白文字」
　- インデント・余白・行間を調整し読みやすく
　- 背景は白系。全体的に青・紺ベースの落ち着いたデザイン
　- 各ページに枠線とページ番号を付与

　- フォントは「Yu Gothic UI」を基本とする
　- 情報階層に応じてフォントサイズを3段階程度に設定
　- 重要点は太字・下線・マーカーで強調
　- 文字の色分けを活用 (確認:緑, アクション:青, 問題点:赤)
　- ポイントや注意点はカード表示などで目立たせる
　- 章や節でページを分ける。各ページを枠で囲みページ番号を付ける
　- 中黒のみの箇条書きはしないこと。番号を付けるか表形式にする。


出力形式：
　完全なHTMLコードで出力する。コードをそのまま別のシステムに使用するためコードのみを出力する。冒頭・末文は不要。
　
インプット：
　（次のチャットで指示をしますので、何も出力せずに待機しててください）
 
```


 

### このプロンプトの何がすごいのか？ ✨

このプロンプトの魅力は、単に情報をまとめるだけでなく、**「読みやすさ」と「見栄え」** を徹底的に追求している点にあります。

#### 1. 構造化とデザイン性の両立

Wordpressマガジン風デザイン: おしゃれで見やすいレイアウトを目指します。

目次・階層番号: 情報の全体像を把握しやすく、目的の箇所へアクセスしやすくします。

視覚的要素: 図形やフロー、インフォグラフィック（HTMLで表現可能な範囲）で、複雑な内容も直感的に理解できるようになります。

書式設定: フォント、色使い（青・紺ベース）、余白、強調（太字、マーカー、色分け）、カード表示など、細部まで指定することで、デザイン性の高いレポートが生成されます。

#### 2. 高い可読性と品質

JTF日本語標準スタイルガイド準拠: 正確で自然な日本語文章を生成します。

文章構成の工夫: 適切な段落・文の長さ、主語・述語の明確化により、スラスラ読める文章になります。

情報整理: 箇条書きや表形式を効果的に使用し、情報を分かりやすく整理します。特に表の左端に番号を付与するなど、細かな配慮が光ります。

情報量の維持: インプットの7割以上の文字量を維持することで、要約されすぎて重要な情報が欠落するのを防ぎます。

#### 3. 汎用性と効率性

多様なインプットに対応: DeepResearchの結果、会議の文字起こし、プログラムコードの解説、仕様書のドラフト、論文の要約など、テキストベースの情報なら何でもインプットとして活用できます。

HTML出力: 生成されるのは完全なHTMLコードです。そのままWebページとして公開したり、社内システムに組み込んだり、ブラウザで直接開いて閲覧したりと、活用方法は無限大です。

圧倒的な時間短縮: レポートの構成、デザイン、フォーマット調整にかかる時間を大幅に削減できます。本来注力すべき「内容の吟味」に時間を割けるようになります。

### 活用事例 🚀

このプロンプトは、様々なシーンでその真価を発を発揮します。

【DeepResearch / 文献調査の結果報告】
膨大な調査結果や論文の要点を、目次付きの構造化されたレポートに変換。重要な発見や考察を視覚的にハイライトし、関係者への共有をスムーズにします。

【会議議事録の清書・共有】
長文になりがちな文字起こしデータを、決定事項、ToDo（アクション）、懸案事項（問題点）などが一目でわかるレポートに整形。色分けや表を活用して、要点を明確に伝えられます。

【プログラムコードの解説ドキュメント作成】
ソースコードとその解説文をインプットとして、処理フローやコンポーネントの関係性を簡易的な図（HTML）で示しながら、構造化されたドキュメントを生成。コードレビューやチームメンバーへの共有に役立ちます。

【仕様書・設計書のドラフト作成】
断片的なメモやブレインストーミングの結果を、階層構造を持った仕様書や設計書のドラフトとして整理。体裁を整える手間を省き、内容のブラッシュアップに集中できます。

【学習ノート・ナレッジの整理】
セミナーのメモや学習した内容を、後で見返しやすいHTMLレポートとして整理。目次や強調表示、図解などを活用して、知識の定着と再利用を促進します。

【社内レポート・報告書の作成】
定型的な報告書作成を効率化。インプットデータから、指定されたフォーマットに沿った見栄えの良いレポートを迅速に作成できます。

### うまく使うためのヒント 💡

インプットの質: 元となる情報の質が高いほど、生成されるレポートの質も向上します。可能な範囲で、インプット情報を整理しておくと良いでしょう。

具体的な指示の追加: もし特定の箇所で特に強調したい点や、追加してほしい図があれば、プロンプトに追加で指示を与えると、より意図に近い出力が得られます。

対話による調整: 一発で完璧な出力が得られない場合もあります。生成されたHTMLを確認し、「ここの表現を修正して」「この部分を表にして」といった具体的なフィードバックを与えることで、理想のレポートに近づけることができます。

### まとめ

今回ご紹介したプロンプトは、情報整理とレポート作成の常識を変える可能性を秘めた強力なツールです。

　時間を節約したい
　分かりやすいレポートを作りたい
　見栄えの良い資料で差をつけたい
　多様な情報を一貫したフォーマットで管理したい

と考えている方は、ぜひこのプロンプトを試してみてください。きっと、あなたの情報整理・共有プロセスが劇的に改善されるはずです。

ぜひ活用して、情報に溺れる日々から解放されましょう！


　
気に入って頂けましたら「いいね」を押してください。

#### ▼ プロンプト集を用意しています。ぜひご覧ください▼

https://qiita.com/tags/nori%e5%bc%8f%e3%83%97%e3%83%ad%e3%83%b3%e3%83%97%e3%83%88%e9%9b%86