讓 Claude Code、Codex 或 Gemini CLI 為你設計應用商店截圖。AI 代理建立可編輯專案,在瀏覽器中審查,並把匯出連結交給你。
https://appscreenshots.net/api/mcp一條命令即可加入。免費與付費方案均包含 MCP。
甚麼是 MCP?
AppScreenshots 在 https://appscreenshots.net/api/mcp 運行一個託管式 MCP(Model Context Protocol,模型上下文協定)伺服器,讓 Claude Code、Codex、Gemini CLI 等 AI 工具在你的帳戶中建立、編輯和審查應用商店截圖專案——透過 OAuth 瀏覽器登入,無需 API 金鑰。
設計與文案由你的 AI 代理提供。MCP 伺服器儲存的是真實、可編輯的專案:範本、裝置樣機、標題與背景都會成為你可以逐幀持續打磨的專案。
預覽與匯出始終在網站編輯器完成,未經你過目,任何內容都不會發佈。
它用你授權的範本與素材,建立商店級行銷截圖——裝置樣機、標題、漸層背景與本地化文案——並儲存為可編輯專案。
simctl、fastlane snapshot 等工具拍攝的是裝置螢幕上已有的畫面。用它們做原始擷取,再把圖片作為素材上傳到這裡。
快速開始
把下面的端點加入你的用戶端,然後完成瀏覽器登入以完成授權。本頁列出的用戶端均支援 Streamable HTTP 與 OAuth。
claude mcp add --transport http --scope user appscreenshots https://appscreenshots.net/api/mcpclaude mcp add --transport http --scope user appscreenshots https://appscreenshots.net/api/mcp然後: 在 Claude Code 中執行 /mcp,並在瀏覽器中授權 AppScreenshots。
{
"mcpServers": {
"appscreenshots": {
"type": "http",
"url": "https://appscreenshots.net/api/mcp"
}
}
}{
"mcpServers": {
"appscreenshots": {
"type": "http",
"url": "https://appscreenshots.net/api/mcp"
}
}
}codex mcp add appscreenshots --url https://appscreenshots.net/api/mcpcodex mcp add appscreenshots --url https://appscreenshots.net/api/mcp然後: 執行 codex mcp login appscreenshots 開啟瀏覽器登入。
[mcp_servers.appscreenshots]
url = "https://appscreenshots.net/api/mcp"[mcp_servers.appscreenshots]
url = "https://appscreenshots.net/api/mcp"gemini mcp add --transport http --scope user appscreenshots https://appscreenshots.net/api/mcpgemini mcp add --transport http --scope user appscreenshots https://appscreenshots.net/api/mcp然後: 在 Gemini CLI 中執行 /mcp auth appscreenshots。
{
"mcpServers": {
"appscreenshots": {
"httpUrl": "https://appscreenshots.net/api/mcp",
"oauth": {
"enabled": true
}
}
}
}{
"mcpServers": {
"appscreenshots": {
"httpUrl": "https://appscreenshots.net/api/mcp",
"oauth": {
"enabled": true
}
}
}
}https://appscreenshots.net/api/mcphttps://appscreenshots.net/api/mcp然後: 在 Kimi Code 中開啟 /mcp-config,加入上面的 HTTP 伺服器,然後執行 /mcp-config login appscreenshots。儲存後重新啟動工作階段。
{
"mcpServers": {
"appscreenshots": {
"url": "https://appscreenshots.net/api/mcp"
}
}
}{
"mcpServers": {
"appscreenshots": {
"url": "https://appscreenshots.net/api/mcp"
}
}
}https://appscreenshots.net/api/mcphttps://appscreenshots.net/api/mcp然後: 把設定合併到 ~/.zcode/cli/config.json 的 mcp.servers 下,或在 Settings → MCP 中加入 HTTP 服務。重新啟動工作階段,並在出現提示時完成 OAuth 登入。
{
"mcp": {
"servers": {
"appscreenshots": {
"type": "http",
"url": "https://appscreenshots.net/api/mcp"
}
}
}
}{
"mcp": {
"servers": {
"appscreenshots": {
"type": "http",
"url": "https://appscreenshots.net/api/mcp"
}
}
}
}https://appscreenshots.net/api/mcphttps://appscreenshots.net/api/mcp然後: 使用你的帳戶或工作區提供的自訂 MCP 連接入口,填入上面的端點並選擇 OAuth。可用性取決於工作區設定。
GitHub 上的公開連接套件提供本頁所有用戶端的現成設定檔、一個教授工作流程的可選代理 Skill,以及一條從終端機檢查伺服器的 doctor 命令。
在 GitHub 上檢視 appscreenshots-mcp工具
讀取類工具檢視能力、範本、專案與素材;寫入類工具建立專案並執行帶版本校驗的結構化編輯。
| 工具 | 作用 |
|---|---|
get_capabilities | 讀取你的權益、設計邊界、裝置與預覽/匯出模式 |
search_templates | 搜尋公開範本中繼資料 |
get_template | 讀取你有權使用的範本 |
list_projects | 列出已授權專案,每頁 25 個 |
get_project | 讀取專案目前版本與可編輯設計 |
get_project_preview | 取得編輯器連結、版本、頁面與瀏覽器審查說明 |
list_assets | 列出共用素材與已授權專案內的素材 |
| 工具 | 作用 |
|---|---|
create_project | 從範本或空白畫布建立專案 |
update_project | 執行帶版本與冪等保護的結構化編輯 |
運作方式
每個已連接的 AI 代理都可以遵循的預設流程。
在用戶端加入 MCP 伺服器,並用你的 AppScreenshots 帳戶登入。在授權頁選擇該工具可使用的專案與素材,以及是否允許它建立專案。
用自然語言描述想要的截圖組合。代理讀取能力、搜尋範本並建立可編輯專案。
預覽工具傳回編輯器連結。帶瀏覽器工具的代理會開啟連結、檢查截圖並透過 MCP 修正視覺問題。
每次寫入都帶版本校驗與冪等保護,因此可以隨時本地化、換裝置或改風格,不會破壞既有幀。
在網站編輯器中開啟同一個專案並匯出商店級圖片。預覽與匯出始終由你掌控。
用可用的範本和我的已授權素材,建立一個英文 App Store 截圖專案。使用簡短標題與乾淨版面。用可用的瀏覽器工具開啟編輯器,檢查截圖並修正視覺問題,然後給我用於網站匯出的專案連結。
範例
專案保持可編輯,後續修改成本很低。
“把目前的幀複製為日語和德語版本。保持版面不變,翻譯標題,並讓譯文長度控制在英文版的 20% 增幅以內。”
“把裝置樣機換成更大的 Pro Max 機型,並調整背景漸層,讓構圖依然平衡。”
“把第二幀改為深色背景,標題移到上三分之一處,說明文字使用輔助色。”
安全與限制
MCP 存取按範圍授權、可觀察、可隨時撤銷。
常見問題
連接 AI 工具前開發者最常問的問題。
把 AppScreenshots MCP 伺服器加入你的 AI 工具,用一句提示詞得到可編輯、可上架的截圖專案。