制作社交媒体配图：Tokeny 实操案例

准备这次任务的输入

在 Tokeny 中新建工作空间，将下载的样例解压到工作空间，选择支持工具调用的模型。本例使用合成演示数据或文中列出的公开资料。

product-brief.md

把任务交给 Tokeny

为产品设计三种社交平台配图版式：1080×1080、1080×1440、1200×630；使用 SVG 排版与几何图形，保留安全边距。

交付文件：square.svg、portrait.svg、landscape.svg。
验收要点：
- 三个 SVG 的 viewBox 符合尺寸
- 价格和功能一致
- 不截断标题
这是使用合成演示输入或指定公开资料的真实操作案例。请先读取工作空间输入，再实际生成文件并自检。所有写入、脚本与临时服务限于当前工作空间；临时服务只监听 127.0.0.1，执行后关闭；不触达外部收件人、不发布、不付款、不更改系统设置，不调用子智能体。需要公开资料时可读取给定 URL。只启用完成任务必需的工具。另写 report.md（中文）和 report.en.md（英文），简洁、完整，包含输入、处理步骤、真实结果、检查方式和局限；失败或未验证部分如实记录，不能宣称成功。最终回复用中文列出产物、关键结果与待核实项。

复核后追加的任务（1 次）

真实浏览器渲染发现 square.svg 的副标题“清楚分工 · 看见截止日期 · 随时导出”与深绿色斜切背景边缘相交，右半段浅色文字落到浅色背景上而难以阅读。请检查三种尺寸的真实渲染，将整行副标题放在统一高对比背景中（例如上移或调整背景形状），保留全部文案、价格和尺寸。修复后生成实际浏览器截图自检，更新双语报告，不要求固定字数。

本次使用独立演示工作空间。复现时，请根据自己的文件与权限设置检查操作，确认后继续。

实际执行过程

任务从 Tokeny 输入框提交，由在线模型读取资料并调用工具实际执行。本例核对本地演示任务与实际生成的文件，结果和检查方法见下文。

Tokeny 1.7.8 中「制作社交媒体配图」的真实执行会话与生成文件。点击可查看原图。

产物、结果与复核

输入

来源：工作空间 product-brief.md。
产品：松果任务板（虚构演示产品），面向 3–10 人的小团队。
功能：任务列表、负责人、截止日期、CSV 导出。
价格：免费版最多 3 人；团队版 29 元/人/月。
视觉输入：品牌色 #176B52。未使用客户评价、销量或第三方背书。

处理步骤

读取并核对工作空间产品简报和环境说明。
使用 SVG 原生文本、矩形、圆形、路径和线条，制作方形、竖版、横版三种版式。
三张图保留同一组功能和价格文案；根据比例调整信息布局。
统一使用浅色背景、品牌绿和黄色强调色，并按约 72–96 px 预留主要内容安全边距。
读回生成文件，使用 XML 解析检查结构、尺寸和必需文案。
针对真实渲染反馈，在三种版式的副标题下增加整行深绿色底带，确保浅色副标题不跨越深浅背景。
使用本地 127.0.0.1 临时服务和 Edge + Playwright 逐个加载 SVG，按目标画布尺寸生成截图。

真实结果

已生成 square.svg：1080 × 1080，viewBox 为 0 0 1080 1080。
已生成 portrait.svg：1080 × 1440，viewBox 为 0 0 1080 1440。
已生成 landscape.svg：1200 × 630，viewBox 为 0 0 1200 630。
三个 SVG 均可被 XML 解析；共同描述中的功能和价格一致。
三个文件均包含：任务列表、负责人、截止日期、CSV 导出、免费版最多 3 人、团队版 29 元/人/月。
标题拆为“让小团队，”和“按时交付”两行，未依赖单行溢出；根据文字坐标和画布边界做了静态安全区检查。
已修复副标题跨越斜切背景的问题：三种尺寸均使用统一品牌绿底带承载整行副标题，保留全部功能和价格文案。
Edge 实际渲染截图已生成：.tmp/tokeny/svg-render-check/square.png、.tmp/tokeny/svg-render-check/portrait.png、.tmp/tokeny/svg-render-check/landscape.png。
浏览器输出的副标题边界为：方形 x=72..494.97, y=353..389；竖版 x=72..510.63, y=414..451；横版 x=72..447.97, y=329..360，均位于对应底带范围内。

检查方式

使用 Python xml.etree.ElementTree 逐个解析 SVG。
断言 width、height、viewBox 与目标尺寸一致。
断言必需功能、价格文案均出现。
断言三个文件的 desc 文案完全一致。
读取生成文件复核标题、功能区和价格区的坐标；横版价格字号在检查后收紧，以增加右侧余量。
Playwright 输出确认三个页面的 viewport 与 SVG viewBox 分别为 1080×1080 / 0 0 1080 1080、1080×1440 / 0 0 1080 1440、1200×630 / 0 0 1200 630。
使用 Pillow 对每张截图的副标题底带上下边缘进行 8 点像素抽样，三张图均为 #176B52，结果为 8/8 通过。

局限

本次真实浏览器验证使用本机 Edge 和当前环境字体；其他系统的字体替换可能改变中文实际像素宽度。
本次截图验证针对本地原始 SVG，没有覆盖社交平台压缩、字体替换和自动裁切流程。
产品简报未提供公开网址，因此没有额外读取外部资料。

下载产物，自己核对

压缩包保存本次执行生成的文件。替换成自己的资料后，可以按下面的检查点验收。

三个 SVG 的 viewBox 符合尺寸
价格和功能一致
不截断标题

square.svg · 3 KBportrait.svg · 3 KBlandscape.svg · 3 KBreport.md · 3 KBreport.en.md · 4 KB

下载本次实际产物