
效果预览
相似 Skill
查看全部 Skills你将获得
- 一整套互相连通的页面:首页、带结账的定价、登录与注册、可操作的产品、后台、更新日志、联系、隐私、条款和 404,共用一个故事和一份状态
- 琥珀剪贴簿视觉:极简居中的 Hero,一句琥珀渐变标题加贴纸图块;往下是胶带照片、手写批注、奶油色便当网格、路线图看板和瀑布流评价
- 明暗双主题下都能用的交互:实时解析的任务录入、消耗额度的规划操作、计费切换、后台搜索排序筛选,以及命令菜单
适合
- 想要温暖手作感发布页、而不是千篇一律企业渐变页的 SaaS、效率工具和独立软件团队
- 需要把营销站、定价、产品和后台做成一个可信演示,用于发布或早期验证的创始人
- 有清晰核心流程(录入、整理、生成结果)、能在产品视图里真实演示出来的产品
不适合
- 正式的大企业或强监管品牌:贴纸、和纸胶带和手写批注刻意保持轻松俏皮
- 需要真实账号、支付或数据的线上应用:登录、结账和邮件都是如实标注的页面内模拟
- 没有软件产品的业务,比如咖啡馆或个人作品集:这套页面围绕产品、定价和后台搭建
产品发布与应用增长网站与数字体验制作网页/单页站/仪表盘制作落地页风格锁定成果可编辑Amber ScrapbookCream BentoTilted Ui CollageHand AnnotatedPlayful Editorial
适合做落地页
关于此 Skill

Amber Scrapbook Suite 把一个 SaaS 产品的所有界面做成一组互相连通的视图:营销首页、定价、登录、可操作的产品、后台和各类辅助页面。营销部分用奶油色纸面、和纸胶带、拍立得和手写批注营造手工拼贴感,产品和后台则保持冷静精确。示例是虚构的 AI 日程规划产品 Dayfold。

你将获得
- 完整的一套页面:首页、带结账抽屉的定价、登录与注册、产品、后台、更新日志、联系、隐私、条款和 404
- 首页从极简 Hero 开始,依次是字标滚动条、带倾斜卡片和胶带照片的功能分栏、奶油色便当网格、客户故事、路线图看板、瀑布流评价、FAQ 和便签纸收尾区
- 产品视图支持自然语言录入任务、消耗额度的规划操作;后台有数据卡、图表和可搜索的用户表
- 状态共享:注册或购买套餐后,账户菜单、额度、定价徽标和后台表格会一起更新
- 明暗双主题、命令菜单,最终是一个自包含文件,任意浏览器打开,离线可用

如何使用
- 提供产品名、一句话卖点、8 到 10 个功能(标出 3 个主打)、定价结构和几条路线图事项。
- Agent 把产品核心流程映射到你的领域,规划并生成照片,再用你的文案搭好每个视图。
- 打开文件,在明暗两种主题下逐页点一遍,再按需要修改文案、套餐或区块。

有生图工具时照片由 Agent 自带的工具生成,可能产生该工具的用量费用。简报里没给的信息会先写成占位文案,Agent 会列出来请你确认。
开始前需要准备什么
- 你需要提供
- 产品名、一句话卖点和目标用户 · 8 到 10 个功能(标出 3 个主打),以及定价结构 · 路线图事项、一个客户故事,以及真实评价或照片(可选)
- 依赖项
- Agent 所在电脑需要 Node.js 18 或更高版本,用来运行随附脚本,生成单个离线网页文件 · 生成文件时需要联网,字体只下载一次并嵌入文件 · Agent 里的生图工具,用来生成照片(可选;没有时由你提供照片或使用标注好的占位图)
- 外部成本
- 有生图工具时,照片由 Agent 自带的生图工具生成,可能产生该工具的用量费用。没有时,Agent 会向你要照片,或放上明确标注的占位图。除此之外不使用任何付费服务。
- 最近实测
- v1.0.9 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
用户评价
评价加载中…








