name: genek-paper-2-web

description: 从论文生成 HTML 海报（poster.html）。三列 Grid 布局 + 交互组件，原图展示，中英双语切换。当用户提及"论文转海报"、"学术海报"、"论文转网页"、"poster"时使用此技能。

Paper2Web — 论文 → HTML 海报

从单篇论文生成一份交互式 HTML 学术海报。海报使用原图（figures/fig{N}.png），采用三列 Grid 布局 + Lightbox + 中英双语切换。

适用边界

genek-paper-2-web 定义海报的内容结构、布局规则、组件用法与验收门禁
不涉及 PPT 生成（PPT 由 genek-paper-2-slide 负责）
图片提取与 panel 拆分由上游 skill 完成

目录结构

每篇论文以 第一作者姓氏 + 年份 命名独立子目录：

papers/
└── {Author}{Year}/
    ├── paper.pdf
    ├── figures/
    │   ├── fig1.png ... figN.png            (原图，genek-extract-figures)
    │   └── panels/                          (panel 图，genek-split-figures)
    └── poster.html                          (本 skill 产物)

执行流程

步骤	目标	输入	输出	成功判据
S0	建立论文目录	`paper.pdf`	`papers/{Author}{Year}/`	目录结构正确
S1	抽取结构化内容	`paper.pdf`	标题/作者/Background/Design/Methods/Results/Conclusions	字段齐全，无空段
S2	提取原图	`paper.pdf`	`figures/fig1..figN.png`	图片数与主图数一致
S3	生成海报	结构化内容 + 原图	`poster.html`	页面可打开，图文完整
S4	QA 门禁	poster.html	通过/不通过	满足本文件 QA Gate

失败策略：

S2 失败：回退到 genek-extract-figures 的备选路径

图片使用规则

格式	使用图片	路径	Result 对应
poster.html	原图	`figures/fig{N}.png`	1 张原图 = 1 个 Result 卡片

每个 Result 卡片对应论文的一张完整 Figure 原图。Result 数量 = 论文主图数量（通常 4–7 张）。海报空间充裕，用原图展示完整 Figure 更直观。

项目设计（Study Design）

从论文 Methods/Results 中提取实验设计信息，以表格 + 关键统计数字呈现。

常见字段（按论文实际内容选取）：

字段	适用场景	示例
物种 (Species)	动物/植物/微生物研究	Human, Mouse, Chicken 等
样本类型 (Sample)	所有实验研究	Fibroblast cell lines, Tumor tissue, Serum
样本数量 (Replicates)	所有实验研究	1–5 replicates per species
患者/个体 (Cohort)	临床/群体研究	500 patients, 1200 healthy controls
实验技术 (Technology)	所有组学研究	Hi-C, RNA-seq, ATAC-seq, WGS
测序平台 (Platform)	测序类研究	Illumina HiSeq X Ten
测序量 (Sequencing depth)	测序类研究	~230M contacts per library
分辨率 (Resolution)	组学数据分析	20 kb, single-cell
参考基因组 (Reference)	基因组学研究	GRCh38, GRCm38 等
时间点 (Timepoints)	纵向/发育研究	E8.5, E10.5, E14.5, P0, Adult
处理条件 (Treatment)	干预/药物研究	Control vs. Drug (10 μM, 48h)

如论文涉及多物种/多样本，优先提取为一张汇总表。

多物种研究的进化关系要求

当论文涉及 ≥3 个物种的跨物种比较 时，Study Design 中必须包含：

简易系统发育树（cladogram）：用 CSS 组件展示物种间拓扑关系
类群分组着色：用颜色区分主要分类群
外群标识：明确标出外群物种

组件实现见 poster-components.md → Cladogram。

不涉及跨物种比较的论文不需要 cladogram。

海报布局规则

三列 Grid 布局原则

海报采用 48in 宽、3 列 grid。各区域固定分配：

         Col 1                Col 2                    Col 3
Header   ──────────────────── 全宽 ─────────────────────
Row 1    Background           Study Design (跨 2–3 列)
Row 2    Methods              Result 1                 Result 2
Row 3    Conclusions          Result 3                 Result 4
Row 4                         Result 5                 Result 6
Footer   ──────────────────── 全宽 ─────────────────────

第 1 行 = 概览行：Background（Col 1）和 Study Design（Col 2–3）并排。Study Design 跨 2 列以容纳表格和 cladogram。

第 1 列 Row 2 = Methods：使用分阶段流程图（Pipeline）替代文字。分 3 个视觉阶段：Stage 1（实验，深色渐变）→ Stage 2（数据处理，浅灰 + tool-tag 标签）→ Stage 3（多维分析，白底蓝边分组框 + 2×N 分析卡片网格）。每步必须标注所使用的软件工具名称。详见 poster-components.md → 分阶段流程图。

第 1 列 Row 3 = Conclusions：深色渐变背景 + 编号列表，作为第 1 列的视觉终点。

第 2–3 列 = Result 区域：从 Row 2 开始，严格按 从左到右、从上到下 排列：

2 个 Result → 1 行 × 2 列
3–4 个 → 2 行 × 2 列（奇数时最后一行只占 1 格）
5–6 个 → 3 行 × 2 列
≥7 个 → 考虑合并相近的 Result

视觉风格

现代交互风
每个 Result 使用独立 accent 色作为顶部边框，通过颜色区分不同发现
Result 卡片带编号圆标（绝对定位），引导阅读顺序
关键 Figure 默认展开（<details open>），次要 Figure 折叠
Conclusions 使用深色渐变背景 + 编号列表
Footer 包含：数据可用性、致谢/资助、通讯作者联系方式

双语要求

data-lang="en" / data-lang="zh" 标记文本
右上角语言切换按钮，默认英文
无需双语标记的元素：数字/统计值、图片、DOI、作者姓名

依赖 skill

图片提取：genek-extract-figures → 原图到 figures/

组件与参考

海报布局与交互组件 → references/poster-components.md
QA 门禁清单 → references/qa-checklists.md

QA 门禁（交付前必须通过）

1) 资产完整性

figures/fig{N}.png 连续且可读
不存在临时/验证残留文件

2) 内容完整性

poster.html 含 Background / Study Design / Methods / Results / Conclusions / Footer
无占位文本（lorem、xxxx、template）

3) 版式质量底线

无明显文本溢出/重叠
无空白 Result 卡片、无破图

4) 双语

EN/ZH 切换功能正常
默认英文显示

5) 交付清单

必交付：poster.html

SKILL.md 6.8 KB Bezpośredni odnośnik Historia Czysty