asc-app-shots

Name: asc-app-shots
Author: tddworks

github.com/tddworks设计与 UI590 次安装5 周前更新

代码仓库

关于 asc-app-shots

这是一个使用 `asc app-shots` 为 App Store 截图设计单页或多页画面的技能，适用于制作应用商店营销素材的团队。它提供模板、图库和主题流程，并支持可选的 Gemini AI 图像增强。

主要功能

01浏览并应用单页模板
02生成多屏图库截图
03应用可复用的主题设计
04使用 Gemini AI 增强截图
05预览并导出 HTML 或图像

适用场景

01为单张应用截图添加标题布局
02制作包含主视觉和功能页的截图组
03将同一主题应用于多张截图
04使用风格参考或提示词增强素材

安装

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

$npx skills add https://github.com/tddworks/asc-cli-skills --skill asc-app-shots

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

附带文件references/commands.md

详细介绍

asc-app-shots：App Store 截图设计器

三种工作流：

	A：模板	B：图库	C：主题
流程	浏览 → 应用 → 生成	图库模板 → 所有屏幕	模板 → ThemeDesign → 应用
屏幕	单张	多张（主视觉 + 功能）	每张幻灯片
AI	可选（Gemini 增强）	可选	1 次 AI 调用用于设计，其余步骤确定性执行

工作流 A — 单个模板

浏览模板，将其应用到截图，并可选择使用 Gemini AI 增强。

步骤 1 — 浏览并应用

asc app-shots templates list --output table
asc app-shots templates get --id top-hero --preview > preview.html && open preview.html

# Apply to screenshot → HTML preview
asc app-shots templates apply \
  --id top-hero --screenshot screen.png --headline "Ship Faster" \
  --preview html > composed.html && open composed.html

# Apply to screenshot → PNG export
asc app-shots templates apply \
  --id top-hero --screenshot screen.png --headline "Ship Faster" \
  --preview image --image-output marketing.png

步骤 2 — 使用 Gemini AI 增强（可选）

asc app-shots generate --file marketing.png
asc app-shots generate --file marketing.png --device-type APP_IPHONE_67
asc app-shots generate --file marketing.png --style-reference inspiration.png
asc app-shots generate --file marketing.png --prompt "warmer colors, deeper shadows"

工作流 B — 图库模板

协调一致的多屏幕套组（主视觉 + 功能屏幕）。

# Browse gallery templates
asc app-shots gallery-templates list --output table

# Preview all screens in horizontal strip
asc app-shots gallery-templates get --id neon-pop --preview > gallery.html && open gallery.html

# Get gallery details (JSON with shots, template, palette)
asc app-shots gallery-templates get --id neon-pop --pretty

图库模板包含可供自定义的示例内容（标题、徽章、信任标记）。

工作流 C — 主题截图

在模板上应用视觉主题。分两步进行：生成一次 ThemeDesign（1 次 AI 调用），然后以确定性方式将其应用到任意数量的截图。

步骤 1 — 浏览主题

asc app-shots themes list --output table
# → Cartoon, Joyful, Holiday, Zen, Neon, Nature, Retro, Space, Luxury

asc app-shots themes get --id luxury --pretty
asc app-shots themes get --id luxury --context   # AI prompt string

步骤 2 — 生成 ThemeDesign（1 次 AI 调用，可重复使用）

asc app-shots themes design --id luxury > design.json

返回包含 palette（背景 + textColor）和 decorations（带动画的浮动元素）的 JSON。

步骤 3 — 应用 ThemeDesign（确定性执行，不使用 AI）

# HTML preview
asc app-shots themes apply-design \
  --design design.json --template top-hero \
  --screenshot screen.png --headline "Ship Faster" \
  --preview html > themed.html

# PNG export
asc app-shots themes apply-design \
  --design design.json --template top-hero \
  --screenshot screen.png --headline "Ship Faster" \
  --preview image --image-output themed.png

替代方案：完整 AI 重设计（备用方案）

asc app-shots themes apply \
  --theme luxury --template top-hero \
  --screenshot screen.png --headline "Ship Faster"

逐张幻灯片使用 AI 重设计——速度较慢，但创意更丰富。当 design 不可用时，将回退到此方案。

命令参考

完整的标志表请参阅 references/commands.md。

模板

asc app-shots templates list [--size portrait] [--preview] [--output table]
asc app-shots templates get --id <ID> [--preview]
asc app-shots templates apply --id <ID> --screenshot <FILE> --headline <TEXT> [--preview html|image]

图库模板

asc app-shots gallery-templates list [--output table]
asc app-shots gallery-templates get --id <ID> [--preview]

主题

asc app-shots themes list [--output table]
asc app-shots themes get --id <ID> [--context]
asc app-shots themes design --id <ID>
asc app-shots themes apply-design --design <FILE> --template <ID> --screenshot <FILE> --headline <TEXT>
asc app-shots themes apply --theme <ID> --template <ID> --screenshot <FILE> --headline <TEXT>

生成（Gemini AI）

asc app-shots generate --file <FILE> [--device-type <TYPE>] [--style-reference <FILE>] [--prompt <TEXT>]

导出与配置

asc app-shots export --html <FILE> --output <PNG>
asc app-shots config --gemini-api-key <KEY>

可用模板

类别	模板
醒目	Top Hero、Bold CTA、Tilted Hero
简约	Minimal Light、Device Only
优雅	Dark Premium、Sage Editorial、Cream Serif、Ocean Calm、Blush Editorial
专业	Top & Bottom、Left Aligned、Bottom Text
活泼	Warm Sunset、Sky Soft、Cartoon Peach、Cartoon Mint、Cartoon Lavender
展示	Duo Devices (2)、Triple Fan (3)、Side by Side (2)

可用主题

主题	风格
Cartoon	粗描边、明亮的纯色、活泼的形状
Joyful	五彩纸屑、闪光、暖色渐变
Holiday	节日装饰、雪花
Zen	宁静、简约、飘落的树叶
Neon	深色背景、发光的霓虹点缀
Nature	有机形状、花瓣、水彩
Retro	复古色盘、几何元素、80 年代/90 年代风格
Space	宇宙背景、闪烁的星星
Luxury	金色点缀、深色背景、优雅风格

Gemini API 密钥

解析顺序：

--gemini-api-key 标志
$GEMINI_API_KEY 环境变量
~/.asc/app-shots-config.json（通过 asc app-shots config）

设备尺寸

设备类型	宽 × 高	必需
`APP_IPHONE_69`	1320 × 2868	✅
`APP_IPHONE_67`	1290 × 2796	✅
`APP_IPHONE_65`	1260 × 2736	✅
`APP_IPAD_PRO_129`	2048 × 2732	✅

支持 Markdown

登录后评论