如果你正在搜尋「App Store 截圖產生器」或「AI 商店截圖工具」，需要的多半不只是在圖片外加上手機邊框。你想製作的是一組能傳達應用程式價值、符合尺寸規範，而且方便持續更新的行銷素材。開源專案 ParthJadhav/app-store-screenshots 正是為這套完整流程而設計。
App Store Screenshots Skill 是什麼？
App Store Screenshots Skill 是一項開源 Skill，適用於 Claude Code、Cursor、Windsurf、OpenCode 和 Codex 等 AI 程式設計 Agent。安裝後，它會引導 Agent 在你的專案中使用 Next.js、React 和 TypeScript 產生商店截圖編輯器。最後得到的是可以繼續編輯的工具，而不是難以修改的靜態圖片。
編輯器會分別提供 iPhone、iPad、Android 手機、Android 平板電腦和 Google Play Feature Graphic 的畫布。你可以拖曳裝置、文字與裝飾元素，切換主題和語言，再將所有必要尺寸匯出成一組 PNG 檔案。
「截圖是廣告，不是說明文件。」
App Store Screenshots Skill 的核心原則
這項原則說明了它與一般 mockup 工具的差異：商店截圖應該先在一秒內傳達使用者能獲得的好處，再展示介面。每張圖片只放一個賣點，標題也要在搜尋結果的縮圖尺寸下清楚可讀。
為什麼這比請 AI 產生幾張圖片更實用？
圖片生成工具很適合探索視覺方向，但商店素材還需要準確的 UI 與文字、可靠的尺寸，以及配合新版本和不同語言持續更新。這項 Skill 讓 Agent 負責更合適的工作：建立製作工具、整理素材並提出設計方案，同時把最後的控制權留在視覺化編輯器中。
- 成果通常只有一張靜態圖片
- 尺寸和語言都需要重複手動處理
- 難以追蹤修改內容
- 交付完整的 Next.js 編輯器
- 集中管理裝置和語言
- 將專案狀態存成可提交至 Git 的 JSON
六項實用功能
Connected Canvas
並排設計整組截圖。手機、路徑和裝飾可以跨越相鄰畫面，匯出時再精準裁切。
Visual Inspector
使用右側面板調整標題、標籤、版面、圖層、旋轉、縮放和截圖來源，不必手動編輯頁面程式碼。
多平台畫布
一套工作流程涵蓋 iPhone、iPad、Android 手機、7 英吋與 10 英吋平板電腦，以及 Feature Graphic。
本地化與 RTL
依語言地區儲存文案與畫面，並檢查阿拉伯文和希伯來文等由右至左語言的版面。
持久保存專案狀態
app-store-screenshots.json 是可閱讀、可審查的單一真實來源，因此換到另一台電腦後仍能繼續工作。
批次匯出
依平台、裝置、解析度和語言整理匯出的檔案，減少提交前調整尺寸與重新命名的工作。
從原始截圖到商店上架素材
整套流程分成六個步驟：準備真實裝置截圖與應用程式圖示；安裝 Skill；請 Agent 產生或遷移編輯器；在 Connected Canvas 上調整敘事與視覺；完成每個語言地區的版本；最後匯出商店要求的圖片套件。
如何安裝並開始使用？
最快的方式是透過 skills CLI。專案需要 Node.js 18 或更新版本，並支援 bun、pnpm、yarn 或 npm。
npx skills add ParthJadhav/app-store-screenshots
安裝後，請提供比「做幾張截圖」更完整的資訊。一份涵蓋產品價值、功能優先順序、目標裝置、語言、風格與畫面數量的簡報，能讓第一版成果好上許多。
建議的提示詞範本
為我的習慣追蹤應用程式製作 App Store 截圖。它用簡單的每日計畫協助使用者維持連續紀錄。最重要的功能依序是快速簽到、趨勢回顧和主畫面小工具。我需要兩組 iPhone 截圖，一組英文、一組簡體中文，每組六張。視覺風格要簡潔、溫暖且細緻。真實截圖位於 ./marketing/screenshots，圖示位於 ./AppIcon.png。
預先準備的素材
- 來自 iOS 模擬器、Android 模擬器或實體裝置的真實應用程式截圖
- 透明背景或高解析度的應用程式圖示
- 一句話的產品說明，以及三到五個主要賣點
- 目標商店、裝置、語言和畫面數量
- 品牌色彩、字型或參考應用程式
它能匯出哪些 App Store 與 Google Play 尺寸？
這項 Skill 會先以各平台支援的最大尺寸進行設計，再產生較小的版本。下表列出專案內建的常用匯出預設。提交前，請查看最新的 Apple 截圖規格與 Google Play 預覽素材要求。
| 商店 | 裝置／素材 | 匯出解析度 |
|---|---|---|
| Apple App Store | 6.9 英吋 iPhone | 1320 × 2868 |
| 6.5 英吋 iPhone | 1284 × 2778 | |
| 6.3 英吋 iPhone | 1206 × 2622 | |
| 6.1 英吋 iPhone | 1125 × 2436 | |
| Google Play | 手機，直向 | 1080 × 1920 |
| 7 英吋平板電腦 | 1200 × 1920 / 1920 × 1200 | |
| 10 英吋平板電腦 | 1600 × 2560 / 2560 × 1600 | |
| Feature Graphic | 1024 × 500 |
注意：Google Play 對特定裝置類型另有規範，包括 Wear OS 和 Android Automotive OS。截圖必須準確呈現應用程式現有的功能，請避免使用誤導性的圖片或行銷宣稱。
適合哪些人使用？有哪些限制？
適合使用的情況
- 獨立開發者與小型產品團隊
- 同時在 iOS 與 Android 發佈的應用程式
- 經常更新功能截圖的專案
- 需要維護多語言商店素材的團隊
需要留意的事項
- 仍然需要高品質的真實產品截圖
- 第一版文案仍需產品判斷與人工審閱
- 複雜的品牌視覺可能需要擴充主題程式碼
- 每張匯出的圖片仍需檢查縮圖效果與規範遵循情況
它可以省下重複工作與建立工具的成本，但無法取代產品定位、品牌策略或最終審閱。讓 Agent 建立工作空間並提出選項，再由設計師或開發者做出決定並檢查成果。
常見問題
它只能產生 iOS App Store 截圖嗎？
不是。這個專案支援 iPhone、iPad、Android 手機、Android 平板電腦，以及 1024 × 500 的 Google Play Feature Graphic。
沒有設計背景也能使用嗎？
可以。這項 Skill 提供主題、版面和文案撰寫原則，編輯器也支援拖放調整。如果你的應用程式有嚴格的品牌規範，最後仍應交由設計師審閱。
我能把截圖專案交給團隊嗎？
可以。圖片素材和 app-store-screenshots.json 都能提交至 Git。團隊成員可以複製專案、安裝相依套件，再繼續編輯。
它會自動擷取應用程式中的每個畫面嗎？
不會。這項 Skill 專注於設計、編排和匯出商店行銷截圖。若是 iOS 專案，作者的 ios-marketing-capture Skill 可以協助自動擷取原始截圖。其他技術堆疊則需要先手動準備素材。
該把它加入版本發佈工作流程嗎？
如果每次發佈版本都要重複調整尺寸、套用裝置外框、放置文案和整理語言資料夾，就值得考慮。App Store Screenshots Skill 的主要價值，是把分散的行銷素材流程變成一個可以編輯、重複使用、審閱並交接的專案。