deep-research-report

Deep Research Report — Convert research findings into a "report you can bring to a meeting"

Deep Research is the strongest at "investigating" but the weakest at "communicating." What comes out is a "wall of long text" with the conclusion at the end, numbers buried in the prose, and comparisons left as sentences—it can't be brought to a meeting as is. This skill takes research findings andeditsthem, converting them into a consulting-quality HTML report that can be read from the conclusion.

Purpose

Convert long-form research findings generated by Deep Research-type features (whether output from Claude / ChatGPT / Gemini / Codex) into an HTML report usable for decision-making. The design is html-report-design the same design as (whitespace and text hierarchy, a single dark navy color, A4 print support).

How to use (2 modes)

Mode A: Conversion (the main role; output from any AI is OK) When the user provides research findings (Markdown, text, the contents of a Word file, a paste of chat output, or a file path), treat that as the source text and convert it using the editing rules below. Don't ask questions—first convert it and show the result.

Mode B: From research to execution (only in environments where web search is available, such as Claude Code) If asked "research ~ and turn it into a report,"

break the question down into 3–5 sub-questions
run a total of 5–10 web search queries (multiple lines of inquiry using synonyms). For key claims and figures,cross-check with two or more sourcesdo so
record all sources referenced (title, publisher, year)
treat the collected facts as the "source text" and convert them using the same editing rules below

Editing rules (the core of this skill)

the source text's informationwithout adding, exaggerating, or rearranging. There are 5 things to do.

Pyramid structuring — move the conclusion to the executive summary at the beginning (the 3 points: conclusion, evidence, implications). At the head of each chapter, set up "the one sentence this chapter wants to say" (.msg). You don't have to follow the source text's chapter structure. Cut things like "Introduction" and "Methodology" or move them to notes at the end
Promoting numbers — pick out the important figures buried in the prose, put the 3 most important in .kpis , and promote trends to line charts, composition ratios and rankings to horizontal bars, and breakdowns of increases/decreases to waterfall charts. Always include units and fiscal years
Diagramming comparisons and classifications — convert sentence comparisons like "A is ~, while B is ~" into tables or framework tables .matrix , and stage theories into stage headings .mx-h.stage , and processes into arrow shapes .chevrons convert to
Preserving sources — do not delete the source text's sources or footnotes. Add a source note .src to figures and tables, and reorganize them at the end as a "Source List" (.refs). Maintain the [n] references in the body text
The no-exaggeration principle (most important) — Do not add numbers, proper nouns, or causal relationships that are not in the original text. If the original says "over 85%," use "over 85%" as is (do not arbitrarily change it to 87%, etc.). For parts where the original is ambiguous, the information is outdated, or there is only a single source, either cut them or note them as "needs confirmation" or "single source." Always explicitly label estimates and forecasts as "forecast," and use dashed lines in charts.

Editorial perspectives specific to Deep Research (the core of how this differs from design skills)

Deep Research output has idiosyncrasies not found in human-written text. Handling these is the brain of this skill.

1. Grading evidence — visualize the reliability of sources

Grade all sources on a 3-level scale and note them in the source list at the end:
- ● Cross-confirmed by multiple independent sources
- ◐ Single source only (adopt it but explicitly state it is single-source)
- ○ Forecasts, estimates, and subjective values (charts use dashed lines,Fnotation)
As a reliability guideline: government and industry association statistics > research firm reports > company public materials > articles and blogs
For old data (guideline: over 2 years), always add the "time point" in the main text

2. Handling contradictory numbers and definitional differences — do not pick only the convenient ones

If the same indicator differs across surveys, check the definitional differences and either note them or write it as a range (e.g., 54–68%)
For terms whose definitions vary by survey, such as "adoption" and "penetration," explicitly state the definition used with .note specify with

3. Separating facts from implications — do not mix Deep Research's "opinions" into facts

Put facts (with source numbers) in the main chapters, consolidate interpretations and implications in the final chapter, and note that they are interpretations
Where the original text presents AI speculation as if it were fact, move it to the implications side or cut it

4. Open questions — create one section for "what is not known"

Present questions the original does not answer, data gaps, and definitional instability as "open questions and additional research"
Answer the reader's "How much can I trust this research?" in advance. This determines the credibility of the document

5. Sentence pattern → chart/table translation table — do not turn things into charts by guesswork

Common patterns in the original text	Chart/table to convert to
"It rose to X% in FY20XX and Y% in FY20YY..."	Line chart (forecast period as dashed line)
"A is highest at X%, followed by B at Y%..."	Horizontal bar chart (only the main subject in dark navy)
"The breakdown of ... is a: X, b: Y..."	Waterfall chart
"Issues are A at 47%, B at 41%..."	Framework table (percentages as row labels)
"First... second... third..."	Numbered list in the summary or framework table
"A four-stage organization is used" "maturity"	Stage table (arrow-feather headings, only the goal in dark navy)
"go through the stages of ~" "the standard playbook for proceeding"	Arrow feathers
"in Q1… from Q3 onward…"	Roadmap
"it is predicted that from now on ~"	Dashed line +`F`notation + source rating`○`

Report skeleton

<div class="page">
  <header class="doc-header">
    <p class="eyebrow">取扱い表記（社外秘 など）</p>
    <h1>結論が伝わるタイトル（「〜の調査結果」ではなく主張を入れる）</h1>
    <p class="lead">何を調べ、何が言えるかを1〜2文で。</p>
    <div class="doc-meta"><span>日付</span><span>作成者</span><span>宛先</span></div>
  </header>
  <section>
    <h2>エグゼクティブサマリー</h2>
    <ol class="summary"><li><b>結論。</b>…</li><li><b>根拠。</b>…</li><li><b>示唆。</b>…</li></ol>
  </section>
  <section>
    <h2><span class="no">01</span>章見出し</h2>
    <p class="msg">この章の so what 1文。</p>
    <!-- .kpis / figure(チャート) / table / .matrix / 本文 -->
  </section>
  <!-- 02, 03 … 事実の章のあと「示唆・打ち手」（解釈と明示） -->
  <section>
    <h2><span class="no">0n</span>残論点 — この調査でわかっていないこと</h2>
    <p class="msg">答えの出ていない問いを残す。ここを埋めるのが次の調査の論点になる。</p>
    <ul><li><b>論点名。</b>何が不明か・なぜ不明か・どう扱ったか</li></ul>
  </section>
  <section>
    <h2>出典一覧</h2>
    <p class="src">確度: ●=複数出典で一致 ◐=単一出典 ○=予測・推計</p>
    <ol class="refs"><li>出典1（発行元・年）●</li><li>…</li></ol>
  </section>
  <footer class="doc-footer"><span>資料名</span><span>注記</span></footer>
</div>

Design CSS (use as is. The only thing you may change is the single color --accent)

:root{--ink:#1a1a1a;--ink-2:#555;--ink-3:#8e8e8e;--accent:#173f66;--accent-tint:#eef3f8;--hairline:#d9d9d9;--fill-gray:#e7e9ec;--paper:#fff}
html{color-scheme:light}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;font-size:15px;line-height:1.9;border-top:6px solid var(--accent)}
.page{max-width:760px;margin:0 auto;padding:56px clamp(24px,6vw,48px) 96px}
.doc-header{padding-bottom:28px;border-bottom:1px solid var(--ink)}
.eyebrow{font-size:11px;letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase;margin:0 0 20px}
h1{font-size:27px;line-height:1.5;margin:0 0 12px}
.lead{font-size:14px;color:var(--ink-2);margin:0 0 24px;max-width:38em}
.doc-meta{font-size:12px;color:var(--ink-3);display:flex;gap:24px;flex-wrap:wrap}
.page>section{border-top:1px solid var(--hairline);padding-top:44px;margin-top:64px}
.page>section:first-of-type{border-top:0;padding-top:0;margin-top:56px}
h2{font-size:19px;margin:0}
h2 .no{color:var(--accent);margin-right:14px}
.msg{font-size:16px;font-weight:600;line-height:1.8;margin:18px 0 24px;max-width:36em}
p{margin:0 0 16px;max-width:42em}
ul,ol{margin:0 0 16px;padding-left:1.4em;max-width:41em}
li{margin-bottom:6px}
ul{list-style:none;padding-left:1.2em}
ul li::before{content:"–";float:left;margin-left:-1.2em;color:var(--ink-3)}
.summary{list-style:none;margin:24px 0 0;padding:0;counter-reset:s;max-width:44em}
.summary li{counter-increment:s;position:relative;padding-left:2.4em;margin-bottom:14px}
.summary li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:.4em;font-size:12px;font-weight:700;color:var(--accent)}
.kpis{display:flex;flex-wrap:wrap;row-gap:24px;margin:32px 0 8px}
.kpi{padding:2px 32px}
.kpi:first-child{padding-left:0}
.kpi+.kpi{border-left:1px solid var(--hairline)}
.kpi .v{font-size:30px;font-weight:700;color:var(--accent);line-height:1.3}
.kpi .v small{font-size:14px;margin-left:2px}
.kpi .l{font-size:11.5px;color:var(--ink-3);margin-top:6px}
.tbl,.fig-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;margin:28px 0 8px;font-size:13px;line-height:1.6}
caption,figcaption{text-align:left;font-size:12.5px;font-weight:600;margin-bottom:10px}
th{font-size:12px;font-weight:600;text-align:left;padding:10px 12px;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink)}
td{padding:10px 12px;border-bottom:1px solid var(--hairline);vertical-align:top}
th.num,td.num{text-align:right;font-variant-numeric:tabular-nums}
tr.total td{border-top:1px solid var(--ink);border-bottom:2px solid var(--ink);font-weight:600;background:var(--accent-tint)}
figure{margin:32px 0 8px}
figcaption{margin-bottom:14px}
figure svg{width:100%;height:auto;display:block}
svg text{font-family:inherit}
.src{font-size:11.5px;color:var(--ink-3);margin:6px 0 0}
.note{font-size:12.5px;color:var(--ink-2);border-left:2px solid var(--hairline);padding:2px 0 2px 14px;margin:24px 0 16px;max-width:40em}
.chevrons{display:flex;margin:28px 0 8px;min-width:520px}
.chev{flex:1;padding:9px 10px 9px 22px;font-size:12px;font-weight:600;line-height:1.5;text-align:center;background:var(--fill-gray);margin-left:4px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%,12px 50%)}
.chev:first-child{margin-left:0;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%)}
.chev.on{background:var(--accent);color:#fff}
.chev small{display:block;font-size:10.5px;font-weight:500;opacity:.75}
.matrix{display:grid;grid-template-columns:var(--mx-label,140px) repeat(var(--mx-cols,2),1fr);gap:18px 20px;margin:28px 0 8px;min-width:560px}
.mx-h{font-size:11.5px;font-weight:600;color:var(--ink-2);text-align:center;align-self:end;padding-bottom:8px;border-bottom:1px solid var(--ink)}
.mx-label{background:var(--accent);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;font-size:12px;font-weight:700;padding:12px 10px}
.mx-label small{font-size:10px;opacity:.7}
.mx-label.alt{background:var(--fill-gray);color:var(--ink)}
.mx-cell{font-size:12px;line-height:1.75}
.mx-cell ul{margin:0}
.mx-h.stage{border-bottom:0;background:var(--fill-gray);color:var(--ink);padding:7px 8px;line-height:1.4;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%,10px 50%)}
.mx-h.stage.first{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%)}
.mx-h.stage.on{background:var(--accent);color:#fff}
.mx-h.stage small{display:block;font-size:9.5px;font-weight:600;opacity:.7;letter-spacing:.06em}
b,strong{font-weight:700}
.refs{list-style:none;margin:16px 0 0;padding:0;counter-reset:r;font-size:11.5px;color:var(--ink-3)}
.refs li{counter-increment:r;position:relative;padding-left:2.2em;margin-bottom:5px;line-height:1.7}
.refs li::before{content:"[" counter(r) "]";position:absolute;left:0}
.refs li::after{content:none}
.doc-footer{margin-top:88px;padding-top:20px;border-top:1px solid var(--hairline);font-size:11.5px;color:var(--ink-3);display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px}
@media print{@page{size:A4;margin:16mm}.page{max-width:none;padding:0}table,figure,.kpis,.chevrons,.matrix{break-inside:avoid}}

Chart conventions: supporting-role gray (fill #c9ccd1, line #a8adb5) + a single dark navy for the main subject, direct labels with no legend, negative values only #a33c2e（▲notation), forecasts as dashed lines. Write SVG with viewBox . Completed sample: assets/sample-research.md（Before）→ assets/sample-report.html（After）。

Conversion procedure

Read the source text through and extract the following: candidate conclusions / key figures (with units and fiscal years) / comparisons and classifications / time series / sources
Rearrange into the skeleton. Write the summary first, and structure each chapter in the order "msg → evidence"
Build diagrams by type (numeric comparison = table, trends = line chart, composition ratio = horizontal bar, comparison = matrix, stages = stage, process = arrow feathers)
Cross-check: Match every figure and proper noun used in the output against the source text, and delete any that do not match
Output as a single HTML file (use the above CSS without modification)

Quality check (before output)

The figures and proper nouns in the output areall present in the source text(cross-checked. Not a single number not in the source text has been invented)
The source list has confidence marks (●◐○). Forecast charts use dashed lines +Fnotation
Figures that conflict between surveys are not adopted from only one side (there is a range notation or a note on definitional differences)
Facts (with sources) and implications (interpretation) are separated as chapters
There is a "remaining issues (things not yet known)" section
The summary consists of the three points: conclusion, evidence, implications. Every chapter has .msg there is
There is a source list (.refs), and the sources from the source text have not disappeared
0 card UIs, colors are black-gray + a single dark navy, 0 gradients/emoji/rounded corners
Figures and tables have numbers, titles, and sources. Numbers are right-aligned with units stated

Tone

Behave as an editor. Do not add, do not embellish, rearrange and sharpen
When in doubt, prioritize "fidelity to the source text," and disclose any points requiring judgment in notes