零基础也能做：用AI把24小时AI资讯做成HTML杂志（附Prompt）

一句需求，AI 自己搜资讯、扒配图、画图表、搭页面，最后出来一个能在浏览器里翻的科技杂志。

这篇把 prompt 模板和每一步的实际动作都摊开，想复刻的直接拿去用。

图一：成品效果——左边 Anthropic 走向公开市场，右边 OpenAI 留在私募市场，中间竖排「同日」

图二：首屏——报头 AI 24H、期号、今日头条横带、主编手记 + 黑底数字卡

一、Prompt 模板（可直接复制）

我想让你收集《过去24小时AI圈发生了什么》，做成一个html。 要有配图（最好是合法合规地直接用信源原图）、合适的地方要有 数据可视化图表。整体要有一种线上科技杂志的感觉，丰富多彩、 信息合理准确。 【可选补充】 - 时间范围：[过去24小时 / 指定日期] - 重点方向：[大模型 / 算力芯片 / 机器人 / 全都要] - 图表数量：[4 张左右] - 视觉风格：[米白纸感+墨黑+橙色点缀 / 深色科技风 / 杂志感]

这段 prompt 的关键在三个词：「信源原图」（不编图，去原文扒）、「数据可视化」（要图表，不只是文字）、「科技杂志感」（定风格，不是随便排版）。

二、Agent 实际怎么做的

Step 01 · 检索

Agent 没有直接开写，而是先分头搜：中文关键词、英文关键词、算力芯片、国产模型，时间范围全部限定「最近一天」。

实际调了 11 次搜索，命中 Anthropic 递交 S-1、OpenAI 发布 GPT-6.1 Terra、OpenRouter 周榜前五全是中国模型、马斯克警告 200 家新云倒闭、SpaceX 400 亿租 GPU、智元 G2 Max 发布等事件。

Step 02 · 交叉核验

Anthropic 的算力采购承诺，不同媒体写 4170 亿、5180 亿、6500 亿、8000 亿美元。Agent 没有随便挑一个，而是继续翻原文，最后确认招股书写的是「未来最低算力付款义务约 4170 亿美元」，其他是不同统计范围。

处理方式是在成品里标注口径差异，而不是当成一个确定数字。这一步是人给 agent 定的规矩——不许编，只许标。

Step 03 · 抓图

Agent 直接去信源文章里扒原图，不自己生成。带 Referer 和 UA 请求头，绕过部分防盗链。

失败清单：虎嗅、中国证券网、OFweek 返回 403。成功来源：新浪、搜狐、东方财富、36氪、UC、上海证券报。26 张原图统一压成 webp，总计 1.35MB，平均 53KB。

Step 04 · 画图

Agent 先下载思源黑体注册到 matplotlib，再画图。中间踩了三个坑，都是自己发现并修掉的。

坑一是中文字体缺失，得手动注册思源黑体，负号还要单独设 axes.unicode_minus。坑二是临时脚本命名 inspect.py 顶掉了 Python 标准库，matplotlib 直接导入失败，改个文件名就好。坑三是柱状图 Y 轴上限设 12，最高柱子正好 12，标签被裁一半，改成 16 留白。

Step 05 · 搭页面

米白纸感 + 墨黑 + 电光橙，宋体标题配无衬线正文。加了纸张颗粒肌理（SVG 噪点）、滚动进度条、入场动画、图片点击放大。

验证方式是起本地服务、浏览器打开、截图、视觉模型检查。第一轮发现标题重叠和标签被裁，修图重验，共迭代 3 轮。

这类需要反复读写本地文件、跑批量脚本的活儿，我用 AiPy 比较多。它的默认工作方式是在本地执行，文件不用先上传到某个服务再下载回来，处理几十张图和几轮图表迭代时，中间环节少一些，调试起来也直接。

Step 06 · 自检

Agent 用 JS 检查每张图的 naturalWidth，确认无裂图；切到 390px 视口确认无横向溢出；点击图片确认灯箱正常。

最终结果：16 张图全部加载，移动端无溢出，灯箱正常，4 张图表中文无乱码。

三、最终产出

数据来自公开信源，配图版权归原作者及原媒体所有。