Menu
iOS アプリの App Store 用スクリーンショットを実シミュレータキャプチャとデバイスフレーム合成で自動生成する。「ストアスクリーンショット」「/store-screenshot」などで自動適用。
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
App Store アセットの ASO 品質を LLM-as-Judge 方式で 5 軸定量評価する。スクリーンショット・メタデータ・Apple ガイドライン準拠を 100 点満点で採点し改善提案を出力。「ストア評価」「ASO評価」「/store-evaluate」などで自動適用。
App Store アイコンを SVG 設計から 1024x1024 PNG に変換して生成する。Apple HIG 準拠。「ストアアイコン」「/store-icon」などで自動適用。
App Store メタデータ（タイトル・サブタイトル・キーワード・説明文）を日本語 ASO 原則に基づいて最適化生成し fastlane/metadata/ に出力する。「ストアメタデータ」「ASO メタデータ」「/store-metadata」などで自動適用。
ASO 評価結果に基づきスクリーンショットのコピーとメタデータを CVR インパクト順に改善し Before/After 比較レポートを出力する。「ストア最適化」「ASO最適化」「/store-optimize」などで自動適用。
store-craft エンジンの開発サーバーを起動しブラウザでスクリーンショットをプレビューする。「ストアプレビュー」「/store-preview」などで自動適用。
| name | store-screenshot |
| description | iOS アプリの App Store 用スクリーンショットを実シミュレータキャプチャとデバイスフレーム合成で自動生成する。「ストアスクリーンショット」「/store-screenshot」などで自動適用。 |
iOS/macOS アプリの App Store 用スクリーンショットを自動生成する。 実際のシミュレータスクリーンショットをデバイスフレーム + テキストオーバーレイと合成して App Store 仕様の PNG を出力する。
store-assets/raw/ に保存screen フィールドは生スクリーンショットの絶対パスxcrun simctl が使えること| 属性 | 内容 |
|---|---|
| 専門性 | App Store スクリーンショットの ASO 最適化、シミュレータスクリーンショット撮影、合成レンダリング |
| 権限 | store-craft.config.json 生成、シミュレータ操作、PNG レンダリング実行 |
| 責任 | 実際のアプリ UI に基づく高品質 App Store スクリーンショットの生成 |
対象アプリをシミュレータで起動し、実画面をキャプチャして、ASO 最適化されたスクリーンショットセットを生成する。
screen フィールドが実 PNG パスを指しているENGINE_DIR="$(find ~/.claude/plugins/cache/store-craft -type d -name engine | head -1)"
if [ ! -d "${ENGINE_DIR}/node_modules" ]; then
cd "${ENGINE_DIR}" && npm install && npx playwright install chromium
fi
screenshot-designer エージェントを起動し、対象アプリを分析する。
Agent(subagent_type: "store-assets:screenshot-designer")
prompt: |
対象アプリ: {app_path}
分析してスクリーンショット構成案を出力してください。
どの画面をキャプチャすべきか、画面への遷移方法を含めてください。
エージェントの出力:
対象アプリをシミュレータでビルド・起動し、各画面をキャプチャする。
キャプチャ方法（優先順位）:
xbm-run でアプリ起動 → xbm-ui-verify で画面遷移・スクリーンショットxcrun simctl io booted screenshot {output.png}保存先: {project}/store-assets/raw/
store-assets/
├── raw/ # 生スクリーンショット（シミュレータから直接キャプチャ）
│ ├── 01_hero.png
│ ├── 02_chat.png
│ ├── 03_skills.png
│ └── ...
├── screenshots/ # 合成スクリーンショット（最終出力）
└── store-craft.config.json
撮影の注意点:
xcrun simctl status_bar booted override --time "9:41"各エントリの screen フィールドに 生スクリーンショットの絶対パス を設定する。
{
"app": { "name": "アプリ名", "tagline": "キャッチコピー" },
"devices": ["iphone-6.9"],
"theme": "ocean",
"locale": "ja",
"screenshots": [
{
"id": "hero",
"order": 1,
"headline": "メインキャッチコピー",
"subtext": "サブテキスト",
"textPosition": "top",
"screen": "/absolute/path/to/store-assets/raw/01_hero.png"
}
],
"outputDir": "./store-assets/screenshots"
}
エンジンの render スクリプトで生スクリーンショットをデバイスフレーム + テキスト + 背景と合成する。
cd "${ENGINE_DIR}"
npx tsx src/render.ts --config "${PROJECT_DIR}/store-craft.config.json"
生成された合成 PNG を確認し、テキストやテーマを調整する。
store-assets/raw/*.png — 生スクリーンショット（シミュレータキャプチャ）store-assets/screenshots/*.png — 合成スクリーンショット（最終出力、1320×2868）store-craft.config.json — スクリーンショット設定Do:
Don't: