mcpField
S
shots

shots

github.com/hypersocialinc营销与增长249225 次安装26 周前更新
代码仓库

关于 shots

Shots 是用于研究应用定位并制作 App Store 截图面板的技能。它涵盖创建、修改、本地化和抓取商店信息的流程，并通过保存的策略简报指导文案与图像提示词。

主要功能

  1. 01按三面板批次创建截图
  2. 02研究应用商店页面和竞品
  3. 03保存定位与收益简报
  4. 04修改和本地化现有截图
  5. 05抓取应用商店元数据

适用场景

  1. 01为应用商店页面制作截图
  2. 02将截图文案适配至其他语言
  3. 03修改已有截图组

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/hypersocialinc/shots --skill shots

安装后在 Claude Code 中输入/shots确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

reference/
create.md
prompting.md
revise.md
scrape.md
strategy.md
translate.md
scripts/
crop.mjs
generate.mjs
package-lock.json
package.json
scaffold.mjs
scrape.mjs

详细介绍

Shots

生成高转化率的 App Store 截图。任务不是装饰现有屏幕，而是推断应用的市场定位、视觉语言和最有力的卖点，然后将其转化为适合安全裁切、旨在推动安装的截图面板。

截图质量为何重要

研究表明，优化后的应用商店截图可以实现：

  • 68.2% 的转化率，而行业平均水平为 26.4%
  • 安装率提升 720%
  • 7 秒决策窗口——前 2–3 张截图至关重要

此技能旨在结合 GPT Image 2 的优势（95% 以上的文本准确率、出色的 UI 模拟图生成能力、4K 输出）与经验证的转化模式（故事流、混合式文案、视觉层级），打造高转化率的营销素材。

意图路由

意图判定方式操作
创建未提及现有截图，或提到“新建”“创建”“生成”或 App Store URL运行创建问卷，然后按照 reference/create.md 操作
修改提及截图 ID，或说“修改”“更改”“修复”“重做”按照 reference/revise.md 操作
翻译提及语言区域，或说“翻译”“本地化”按照 reference/translate.md 操作
仅抓取提供 URL 并说“抓取”“获取元数据”“导入”按照 reference/scrape.md 操作
意图不明确无法判断用户想执行哪种流程询问用户想做什么
参数解析
  • /shots — 开始创建问卷
  • /shots <url> — 抓取应用列表信息，然后继续创建
  • /shots <description> — 根据该上下文创建
  • /shots revise [shot-id] — 修改流程
  • /shots translate [shot-id|run-id] [locale] — 本地化流程
  • /shots scrape <url> — 仅抓取

通用设置

每个子命令执行前都要运行这些检查。不要跳过。

  1. 运行 npm list --prefix {{scripts_path}} sharp 2>/dev/null。如果失败，运行 npm install --prefix {{scripts_path}}。
  2. 运行 node {{scripts_path}}/scaffold.mjs --init --output-dir .shots/。
  3. 对于创建、修改和翻译，确认已设置 OPENAI_API_KEY 或 FAL_KEY。如果两者都未设置，立即停止。
  4. 如果存在 .shots/config.json，则读取该文件。

{{scripts_path}} 是与此文件同级的 scripts/ 目录。

scaffold.mjs --init 是工作区规范的权威来源。它会创建默认的 config.json 和 manifest.json；Agent 应填写这些文件，而不是自行设计架构。

创建问卷

创建流程启动时，如果配置缺失或不完整，请在一条消息中询问以下所有信息：

  1. 应用名称
  2. App Store URL——明确询问：“您是否已有 App Store 或 Google Play 应用列表？如果有，请粘贴 URL。”这是价值最高的输入：它可以启用自动元数据抓取、竞品调研和现有截图分析。
  3. 要生成的截图数量
  4. 设备：iPhone、iPad、Android Phone
  5. 语言/语言区域

可选（仅在用户希望覆盖你的推断结果时询问）：

  1. 视觉风格覆盖选项
  2. 品牌颜色
  3. 差异化卖点覆盖选项

默认值：

  • panelCount：3
  • devices：["iphone"]
  • locales：["en"]
  • 超过 3 张的截图将拆分为多个 3 面板拼图。

研究约定

在撰写文案或生成图片之前，先在 .shots/config.json 中构建并保存 strategyBrief。它是利益点和提示词组装的事实来源。

按以下顺序使用来源：

  1. 用户提供的品牌、颜色和风格覆盖项
  2. App Store URL 和抓取的列表数据
  3. 本地仓库：README、引导流程、导航、模型、根屏幕、现有文案
  4. .shots/app-screenshots/
  5. .shots/inspo/
  6. 竞品列表和评论用语
  7. 仅在无法推断时，向用户询问价值最高的未知信息

如果存在 App Store URL，默认进行全栈调研：列表、截图、直接竞品和评论用语。如果没有 URL，先从仓库中推断。如果仓库没有线索，则从截图或灵感素材中推断。如果仍不清楚应用的定位，再询问用户。

遵循 reference/strategy.md 来：

  • 确定主题、颜色和受众
  • 梳理竞品格局
  • 提取市场惯用词和反复出现的痛点表述
  • 保存策略简报
  • 起草 6-8 条按安装意愿排序的利益点

提示词约定

始终根据已保存的 strategyBrief 和已批准的利益点构建提示词。遵循 reference/prompting.md。

硬性规则：

  • 默认每个合成图分 3 个面板批量生成截图。
  • 每个合成图都必须能干净地裁切为独立的纵向截图。
  • 除非纯文本或生活方式面板明显更适合该概念，否则每 3 个面板中至少 2 个应展示设备。
  • 标题文字必须简短、对比度高、缩略图尺寸下清晰可读，并且逐字准确。
  • 设备屏幕必须展示具体 UI，而非通用的占位应用界面。
  • 使用具体的视觉事实，而非含糊的赞美词。
  • 装饰性纵深元素必须强化所宣传的功能。
  • 不得包含应用商店徽章、下载按钮或伪造的平台界面。

现有截图流程

对于修订和翻译：

  • 如果未提供截图 ID，则读取 .shots/manifest.json 并列出近期截图。
  • 除非用户明确更改定位、受众或视觉方向，否则沿用已保存的 strategyBrief。
  • 将原始提示词视为基础内容，并附加精确的修改和保留指示。

尺寸

设备合成图最终面板Key
iPhone3456x24001284x2778iphone
iPad6144x27322048x2732ipad
Android Phone3240x19201080x1920android

配置结构

初始化后的 config.json 包含：

  • 应用元数据：appName、appStoreUrl、devices、locales、panelCount
  • 生成默认值：generation.provider、generation.quality、generation.timeoutMs、generation.partialImages
  • 品牌颜色：brandColors
  • App Store 数据：aso、ratings、scrapedAssets
  • 策略状态：strategyBrief
  • 文案状态：benefits

不要在 Agent 指令中手动编写新的结构定义。读取生成的文件并填写其中内容。

参考资料

评论

支持 Markdown