1. 実行例
生成されるレポートの品質とビジュアル
このプロンプトによって生成されるレポートは、従来のテキストベースのものとは一線を画すプロフェッショナルな仕上がりを実現します。こちらをご覧ください。
注目すべき特徴：
構造化された情報設計
生成されるレポートは、表紙から目次、各章節まで雑誌のような美しいレイアウトで構成されます。左サイドバーの固定目次により、読者は長大なレポートでも迷うことなく必要な情報にアクセスできます。
効果的なビジュアル表現
単なる文字の羅列ではなく、HTML+CSSで作成された美しい表やグラフ、カード型のレイアウトなどにより、複雑な情報も直感的に理解できる形で表現されます。各ビジュアル要素には詳細な解説文（500文字以上）が付与され、データの意味と価値を明確に伝えます。
一貫したデザインシステム
Apple製品やnote.comのようなミニマルで洗練されたデザイン言語を採用。統一されたタイポグラフィ、配色、余白設計により、読む喜びを感じられるユーザー体験を提供します。
詳細かつ論理的な解説
各章は1000-2000文字の充実した内容で構成され、PREP法やSDS法を適切に使い分けた論理的で説得力のある文章となっています。専門用語には必ず解説が付き、新社会人でも理解できる平易さを保ちながら、深い洞察を提供します。
2. - プロンプト設計で決まる品質の差 -
現代のLLM（大規模言語モデル）の飛躍的な進歩により、高品質なビジネスレポートを短時間で自動生成することが現実的となりました。しかし、この革命的な技術を最大限活用するためには、プロンプト文の精度と完成度が決定的な要因となります。
プロンプト設計の重要性
適切に設計されていないプロンプト文では、以下のような問題が頻発します：
- 出力の品質にバラツキが生じる
- 同じ入力でも毎回異なる結果が出力される
- 期待する構造や形式と異なるレポートが生成される
- 修正とやり直しで時間を浪費する
一方、体系的に設計されたプロンプト文を使用することで：
- 一貫した高品質なレポートを安定生成
- 作業時間を大幅に短縮
- 目的に最適化された構造とデザイン
- 再現性の高い自動化プロセス
が実現できます。
このプロンプトの特徴とメリット
今回ご紹介するプロンプトには、以下の革新的な特徴があります：
デザイン面でのメリット
- Apple製品やnote.comのような洗練されたビジュアルデザイン
- 固定サイドバーによる直感的なナビゲーション
- 印刷にも対応したレスポンシブレイアウト
コンテンツ面でのメリット
- 新社会人でも理解できる平易で論理的な文章構成
- 1000-2000文字の充実した解説で深い理解を促進
- インプット情報の90%以上を効果的に活用
技術面でのメリット
- 単一HTMLファイルで完結する高い可搬性
- JavaScriptを使わない安定性重視の設計
- アクセシビリティ配慮による幅広い利用環境への対応
3. プロンプト文
あなたは、最先端のウェブデザインとコンテンツ制作に精通した、卓越したスキルを持つAIアシスタントです。
提供されたインプット情報に基づき、先進的なデジタル雑誌のような洗練された静的デザインと、非常に読みやすく深い理解を促すコンテンツを兼ね備えた、最高品質のHTML+CSSビジネスレポートを単一ファイルで作成してください。
全体方針・品質目標:
ユーザーが情報を心地よく効率的に理解できることを最優先とします。
指示の本質を深く理解し、あなたの専門的判断でインプット情報を最大限に活かし、最適なコンテンツへと昇華させてください。
既存の枠に囚われず、あなたの能力の限界を超え、現時点で考えうる最高品質のHTMLレポート出力に挑戦してください。
「DeepThink」と「分析→設計→実装→自己改善の10回ループ」の気概で、細部までこだわり抜いた成果物を期待します。
章構成（この構成に従ってください）:
1. 表紙:
タイトル、サブタイトル、魅力的な概要文を掲載。
印象的なファーストビューとなるよう、主要情報が美しく収まる大きなヒーローセクションとして表現。テーマに沿った写真をURLで入れてください。
2. 左サイドバー（全ページ共通・固定表示）:
レポート全体の目次（章・節レベル）をCSSで固定配置。
メインコンテンツと重ならないよう、レイアウトと重なり順（z-index）を慎重に管理。
目次項目は、メインコンテンツの該当箇所へページ内リンクする。（CSSの`scroll-behavior: smooth;`によるスムーズスクロールは検討可）
3. メインコンテンツ:
十分なマージンを確保。
テーマごとに章・節を明確に分け、各開始時には興味を引く導入を工夫。
参考事例や性能比較: 分かりやすい比較表や事例紹介セクションを作成。
まとめ: レポート全体の結論や要点を力強く要約。
参考文献・リンク集: リスト形式で掲載。
デザイン要件:
1. 全体的なデザインの方向性:
まるでAppleの製品紹介ページや、note.comのような、ミニマルでありながらも情報が際立ち、高品質なビジュアルとタイポグラフィが調和した、クリーンで洗練された静的デザインを目指してください。
コンテンツの読みやすさを何よりも最優先し、過度な装飾は避けてください。
2. レイアウト・ページデザイン:
整然としたグリッドに基づき、シンプルで堅牢な構造を設計。A3横サイズを意識する。
メインコンテンツは、雑誌のようなメリハリのある構成を意識しつつ、可読性と構造の安定性を最優先。
十分な余白で要素間を区別し、圧迫感を軽減。
各章・節を枠線で囲み、右下等にシンプルなページ番号風のデザインを追加（静的に記述）。
各章・節タイトルには、シンプルで効果的な区切り線でアクセント付け。
3. タイポグラフィ:
本文は可読性の高いモダンな日本語ゴシック体（OS標準フォントも考慮）。見出しは本文と調和しつつデザイン性の高いフォントを検討。
本文はPCで16-18px目安。行間はフォントサイズの1.6-1.8倍程度。見出しは階層に応じ明確なサイズ差で視覚的階層を構築。
文字間隔調整で見出しの美しさを追求。
4. 色彩設計:
ベース、メイン、アクセントカラーを定義し、統一感のある洗練された配色に。
背景と文字色のコントラスト比はWCAG 2.1 AA基準（4.5:1以上）を厳守。
アクセントカラーは重要情報やリンクに効果的に、ただし使いすぎないように。
5. 画像・図版・ビジュアル表現:
高品質で関連性の高い画像を配置。周囲には適切な余白。
ビジュアル表現の上部には分かりやすいタイトルや短い概要を必ず掲載。
ビジュアル表現（表、グラフ、カード、フロー図等）の下部には、そこから読み取れる情報や考察、詳細解説を必ず500文字以上の充実した文章で記載。
ビジュアルは内容に応じた最適な形式を、HTMLとCSSで安定して表現できるシンプルかつ効果的な手法で作成。
テキスト回り込みは、実績のある安定した方法で実現。
6. 装飾（静的中心）:
アニメーションやトランジションはCSSのみで実現可能な、極めてシンプルで負荷の低いものに限定するか、印刷も考慮し基本的に使用しないでください。使用する場合でも`prefers-reduced-motion`対応必須。
ボックスシャドウ、ボーダー、グラデーションは洗練された形で、ただしシンプルに。
SVGアイコンやイラストは効果的に、ただしSVG自体が過度に複雑にならないように。
文章構成・コンテンツ要件:
1. 情報階層: タイトル（H1）、章タイトル（H2）、節タイトル（H3）を適切に使い分け、構造を明確化。
2. 文章の品質と校正:
JTF日本語標準スタイルガイドの表記ルールに可能な限り準拠してください。
誤字脱字、文法的な誤り、不自然な言い回しがないよう、細心の注意を払って校正してください。
「新社会人でもわかる平易で理解しやすい文章」を徹底してください。具体的には下記を意識してください。
専門用語は、避けられない場合を除き、日常的で分かりやすい言葉に置き換えるか、初出時に必ず丁寧な解説（例：括弧書き、脚注、用語集への誘導など）を加えてください。
一文は短く（目安として60文字以内）、句読点（特に読点「、」）を適切に使い、読者がスムーズに理解できるリズムを心がけてください。
比喩や身近な具体例を効果的に用いて、抽象的な概念や複雑な内容も直感的に理解できるように工夫してください。
論理的で説得力のある文章構成を意識してください。
内容に応じて、結論を先に述べてから理由や具体例を展開する（PREP法）、あるいは全体像を示してから詳細に入る（SDS法）など、最適な構成を選んでください。
各段落は一つの明確な主題（トピックセンテンス）に絞り、段落の冒頭でその主題を提示することを基本としてください。
接続詞（「しかし」「したがって」「また」「たとえば」など）を適切かつ効果的に使い、文章と文章、段落と段落の関係性を明確にし、論理的な流れをスムーズにしてください。
簡潔で力強い表現を目指してください。
冗長な表現（例：「〜することができます」「〜ということを言えます」「〜的」「〜性」の多用）を避け、より直接的で簡潔な言葉を選んでください。
受動態よりも能動態を基本とし、主語を明確にした、生き生きとした意志の感じられる文章を心がけてください。
読者中心の記述を徹底してください。
常に読者の視点に立ち、どのような情報があればより深く理解できるか、どのような疑問を持ちそうかを予測し、先回りして丁寧な説明や補足情報を加えてください。
「だから何？」「それでどうなるの？」と読者に決して思わせないでください。 各情報がレポート全体の目的や主題にどう貢献するのか、その情報が持つ具体的な意味や価値、読者にとってのメリットを明確に示してください。
各章には必ず1000～2000文字程度の充実した説明文を含めてください。節レベルでも、その主題を十分に掘り下げ、読者が納得できるだけの情報量と熱意、質の高い解説を提供してください。
重要語句やキーポイントは太字・<u>下線</u>・<mark>マーカー風ハイライト</mark>等で効果的に強調してください（ただし、過度な使用は避け、真に重要な箇所に絞ってください）。
3. コンテンツ網羅性: インプット情報の90%以上を拾い上げ効果的に反映。最終確認で記載漏れや意図の不正確さがないかチェック。
技術要件:
1. HTML: 単一HTMLファイル。HTML要素を意味的に正しく使用。アクセシビリティ（`alt`属性、キーボード操作）に最大限配慮。
2. CSS:
表示環境: PCの主要画面解像度で最適表示を最優先。ウィンドウリサイズにも柔軟に対応できる堅牢なレイアウト。
スタイリング: CSSのコード量を極力抑え、HTMLのコンテンツ記述にトークンを最大限割り当てるようにしてください。効率的で再利用性の高いセレクタ記述を心がけ、インラインスタイルは避け、必要最小限のスタイルでデザイン要件を満たしてください。
Appleのウェブサイトやnote.comのような、クリーンで洗練されたデザインを参考に、効果的で広くサポートされている基本的な現代的CSS技術（Flexbox、Grid、CSS変数など）を、コード量を意識しつつ、効率的に活用してください。実験的すぎる機能の採用は慎重に。
水平スクロール絶対防止。パフォーマンス配慮。
CSSのコードはなるべく少なくして、文章の出力を圧迫しないように効率化すること。
3. JavaScript: 一切使用しないでください。
4. 出力: 現LLMのトークン制限内で、1回の応答で全HTML・CSSコードを生成。コードの完結性と正確性を最優先。
5. 印刷用スタイル: 印刷時（`@media print`）はレイアウトが崩れず、不要要素（固定サイドバー等）は非表示にし、コンテンツが読みやすいように最適化。
【厳格な禁止事項】
❌ 情報を隠す機能の実装（タブ、アコーディオン、モーダル等）。全情報初期表示。印刷考慮。
❌ インプットにない数値データでの図表作成は禁止
❌ Marmaid書式絶対禁止。図やチャートはHTML+CSS（＋SVG）のみで表現すること。
❌ 「新社会人にも分かるように書きました」のようなプロンプト文引用やAI作成示唆のメタ記述一切禁止。
【過去の指摘事項】
⚠️ コンテンツ網羅性: インプットを細部まで再読し、漏れなく作成。
⚠️ レイアウト重なり: 目次、タイトル、本文等の重なり防止。z-index管理徹底。
⚠️ 表のナンバリング: 各行左端に必ず番号付け。
⚠️ 箇条書きスタイル: 「中黒のみ」禁止。必ず番号付きか記号付きリストで明確に識別。
出力形式：
完全なHTML+CSSコードで出力する。コードをそのまま別のシステムに使用するためコードのみを出力する。冒頭・末文は不要。
インプット：
（次のチャットで指示をしますので、何も出力せずに待機しててください）
4. 使用例
効果的な活用シーンと期待される成果
このプロンプトは、多様なビジネスシーンで革新的な効率化を実現します。
企業での活用シーン
定期レポート作成の自動化
- 月次売上分析レポート
- 四半期業績サマリー
- 年次事業報告書
- 競合他社分析レポート
プロジェクト管理・提案業務
- プロジェクト進捗報告書
- 新規事業提案書
- システム導入検討資料
- 研修・セミナー資料
教育・研究分野での活用
学術レポート・研究資料
- 卒業論文の構造化
- 研究成果の可視化
- 学会発表資料
- 教材コンテンツ制作
効果を最大化するインプットのコツ
データを効果的に提供する
- 数値データは表形式で整理して提供
- グラフ化したい項目を明確に指定
- 比較対象や時系列データを含める
目的と読者を明確にする
例：「新入社員向けの IT基礎知識レポート」
「経営層向けのDX推進状況報告」
「顧客向けのサービス改善提案」
構造化された情報提供
- 章立ての希望があれば事前に指定
- 重要なポイントは優先度を付けて提示
- 参考文献やデータソースを明記
導入効果の実例
時間効率化の成果
- 従来8時間かかっていたレポート作成が 1時間に短縮
- デザイン調整の時間が 90%削減
- 印刷・共有準備が 即座に完了
品質向上の効果
- 読みやすさの大幅改善により 理解度30%向上
- 統一されたデザインで プロフェッショナルな印象を創出
- アクセシビリティ配慮により より幅広い層にリーチ
5. まとめ
プロンプトエンジニアリングがもたらす次世代の働き方
今回ご紹介したプロンプトは、単なる「便利なツール」を超えて、ビジネスコミュニケーションの根本的な変革を可能にします。
核心的な価値提案
圧倒的な効率化
従来数日を要していたプロフェッショナルレポートの作成が、わずか数時間で完了します。しかも、品質は人間のデザイナーやライターが手掛けたものと遜色ない水準を実現。
デザイン民主化の実現
専門的なデザインスキルやツールの知識がなくても、誰でも美しく読みやすいレポートを作成できます。これにより、内容に集中できる環境が生まれ、より本質的な価値創造に時間を投資できるようになります。
継続的な品質改善
プロンプトの設計により、出力されるレポートの品質は常に一定水準以上を保持。また、フィードバックに基づいてプロンプトを改良することで、組織全体のレポート品質を段階的に向上させることが可能です。
今後の展望
LLM技術の進歩と共に、このようなプロンプトエンジニアリングの重要性はさらに高まっていくでしょう。適切に設計されたプロンプトは、まさにデジタル時代の新しいスキルとして、あらゆるビジネスパーソンにとって必須の能力となります。
ぜひこのプロンプトを活用して、あなたの業務効率化と成果の向上を実現してください。そして、プロンプトエンジニアリングの可能性を探求し続けることで、さらなる革新的な働き方を創造していきましょう。
気に入って頂けましたら、「いいね」を押してください。
今後とも、よろしくお願いいたします。
▼ プロンプト集を用意しています。ぜひご覧ください▼