itch-weekly-xhs
给一个文章链接，一键生成小红书笔记(txt) + 配图(PNG)。
When to use
用户给了一个链接（头条/知乎/B站等），内容是 itch.io 一周免费独立游戏汇总，要求生成小红书笔记和配图。典型触发语：
- "帮我生成这期itch游戏的笔记"
- "这个链接里的游戏帮我做成小红书"
- "itch一周游戏汇"
- 用户粘贴了一个含 itch.io 游戏列表的文章链接
Steps
第1步：提取游戏数据
- 用 WebFetch 抓取文章内容
- 提取每款游戏的信息：
- 中文名（自行翻译英文名）
- 英文名（原文）
- 一句话简介（中文，带emoji，口语化风格）
- 开发者名称
- 使用的游戏引擎（如有）
- itch.io 页面链接
- 游戏类型分类（射击/动作/解谜/休闲/平台/策略等）
- 给每个游戏分配一个类型emoji：射击🔫 解谜🧩 动作⚔️ 休闲☕ 平台🥕 策略🧠 街机🕹️
第2步：下载游戏封面图
- 对每个游戏的 itch.io 页面用 WebFetch 抓取，提取封面图URL
- itch.io 封面图URL规律：
https://img.itch.zone/aW1hZ2Uv.../original/xxx.jpg - 优先用
/original/ 路径获取最高质量 - 如果 /original/ 不可用，回退到
/347x/ 路径
- 用 Bash + curl 下载到工作目录的
game_assets/ 文件夹 - 文件命名：英文游戏名小写下划线格式，如
wake_the_beacon.jpg
mkdir -p game_assets
curl -o game_assets/wake_the_beacon.jpg "https://img.itch.zone/aW1hZ2Uv.../original/xxx.jpg"
第3步：生成小红书笔记
按照以下模板生成纯txt笔记（禁止markdown符号）：
itch.io本周X款免费独立游戏神作！打开网页直接玩
姐妹们！本周 itch.io 又上新了一波宝藏独立游戏，全部免费、全部可以直接在网页上玩，不用下载不用安装！我帮你们整理好了，赶紧收藏
🔫 射击类
游戏中文名 英文名
一句话简介！
开发者：xxx
引擎：xxx
https://xxx.itch.io/xxx
（每类重复以上格式）
📊 本周游戏类型分布
射击类 X款
解谜类 X款
...
🎯 我的推荐
如果想玩刺激的：游戏A、游戏B
如果想动动脑子：游戏C、游戏D
如果想放松：游戏E、游戏F
💡 小提示
itch.io 上的游戏都是开发者直接发布的，很多是 Game Jam 作品，虽然体量不大但创意拉满！遇到喜欢的记得给开发者点个赞
你最近有在 itch.io 上发现什么宝藏游戏吗？评论区安利给我！
#itchio #独立游戏 #免费游戏 #网页游戏 #indiegame #游戏推荐 #小众游戏 #像素游戏 #休闲游戏 #解谜游戏
笔记规范：
- 纯txt格式，禁止
**、#、- 等markdown符号 - emoji做视觉锚点
- 亲切朋友安利风，略带兴奋感
- 每款游戏控制在3-4行
- 整体800-1200字
第4步：生成配图
使用 HTML + Playwright 截图方案，生成5张 720x1280 竖版配图。
4.1 准备 generate_slides.js
在工作目录创建 generate_slides.js，核心模板代码见 @scripts/generate_slides_template.js
关键设计参数：
- 画布：720x1280px，deviceScaleFactor:2（Retina）
- 暗色主题：背景
#0f0f23 → #1a1a2e 渐变，强调色 #ff8c42（itch.io橙） - 游戏页：每页2个游戏，大图上下布局（截图占上半部分，文字占下半部分）
- 汇总页：类型分布进度条 + 2x2带截图的推荐卡片 + 亮点框
- 图片转base64内嵌，不依赖HTTP服务
4.2 修改游戏数据
将第1步提取的游戏数据填入 generate_slides.js 的 games 对象中，按类型分组。
4.3 运行截图
cd <工作目录>
node generate_slides.js
脚本会自动查找 Chromium 和 playwright-core，无需手动配置路径。
如果自动查找失败，需要先安装：
npm install playwright-core
npx playwright install chromium
4.4 输出文件
- slide_01_cover.png — 封面（itch.io品牌 + 数量 + 日期）
- slide_02_games.png — 游戏页1（每页2个，大图上下布局）
- slide_03_games.png — 游戏页2
- slide_04_summary.png — 汇总（类型分布 + 推荐 + 亮点）
- slide_05_ending.png — 结尾互动引导
如果游戏超过6个，可增加游戏页数量。
第5步：预览和交付
- 用 preview_url 预览配图效果
- 用 deliver_attachments 交付所有PNG和txt文件
- 检查是否有大面积留白 — 如有，调整卡片间距或flex:1让内容撑满
Pitfalls
- CDN问题：国内网络
cdn.jsdelivr.net 可能无法访问，Chart.js 用 cdn.bootcdn.net - Chromium路径：Playwright缓存中二进制叫 "Google Chrome for Testing" 不是 "Chromium"，脚本会自动查找
- 不要触发 npx playwright install：如果Chromium找不到，脚本可能尝试自动下载169MB，超时且污染环境。脚本已内置自动查找逻辑
- 图片留白：游戏页每页只放2个游戏时用大图上下布局（flex:1撑满），汇总页推荐卡片也要 flex:1 让截图区域自动撑大，避免底部大面积留白
- itch.io 原图可能很小：部分游戏封面只有几KB（如PICO-8游戏），在卡片中可能模糊，无法避免
- 小红书笔记禁用markdown：纯txt，用emoji和空行做视觉分隔
- Playwright 需要 playwright-core：不是
playwright 包，是 playwright-core
Verification
- [ ] 所有游戏都有封面图下载到 game_assets/
- [ ] 笔记txt文件生成，无markdown符号
- [ ] 5张PNG配图生成，尺寸720x1280
- [ ] 配图无大面积留白
- [ ] 封面图显示正确的游戏数量和日期
- [ ] 汇总页包含类型分布、推荐卡片、亮点框