ScreenMocks の MCP サーバー
Claude、Cursor、VS Code、Codex、ChatGPT を ScreenMocks に接続すれば、App Store のギャラリー一式をそのまま組み立てられます。実機どおりのデバイスフレーム、Apple が求めるすべてのキャンバスサイズ、48 言語を、あなた自身のプロジェクト上で。
あなたにできることは、
エージェントにもできる。
45 個のツール。基準はただひとつ、エディタと同じことができること。
スクリーンの組み立て
テキスト、図形、デバイスフレーム、グループを実際のキャンバス上で。
add_layers · update_layer · align_layers
App Storeの48言語
言語を追加すればセット全体が追従。1つのセルだけ上書きもできます。
set_languages · set_translations
ストアのすべてのサイズ
iPhone、iPad、Android、追加した任意のサイズ。それぞれが独自の画面を持ちます。
add_size · list_size_screens
33種のデバイスフレーム
フレームはキャンバスに追従。PlayタブのiPhoneはPixelとして描かれます。
list_catalog · update_layer
ステータスバー
本物の4種のバーを、システムUIなしのキャプチャに重ねます。
set_status_bar
キャプチャを一括で
フォルダを指定すれば、空のディスプレイを順に埋めていきます。
import_asset_from_url · set_screenshot
写真とアイコン
Pexelsの写真と9万点のベクターを、エージェントから検索。
search_stock_photos · search_icons
テンプレートライブラリ
完成したセットから始めるか、別のセットから1画面だけ借りる。
apply_template · add_template_screens
書き出しと送信
全サイズ・全言語をZIPで、またはApp Store Connectへ直接。
export_project
プロンプトをひとつ。
仕上がったギャラリーがひとつ。
Claude でのあなた
Atlas テンプレートから私のアプリの App Store セットを作って。./screenshots にある 5 枚のキャプチャを使い、見出しは自分で書いて、そのあとスペイン語と日本語を追加して iPhone と iPad のキャンバスを書き出して。
クライアントの設定に 3 行。
- サーバー名
- screenmocks
- エンドポイント
- https://www.screenmocks.com/api/mcp
- トランスポート
- Streamable HTTP。リモートサーバーなので、インストールするものもローカルで動かすものもありません。
- 認証
- Authorization: Bearer <token> — アカウント内で発行するパーソナルアクセストークン。すべてのトークンは sf_pat_ で始まります。
- ツール
- 45 個。プロジェクト、スクリーン、レイヤー、テキスト、ローカライズ、アセット、プレビュー、書き出しをカバーします。
- 利用条件
- すべての有料プラン。Pro の月額または年額と、一度きりの購入である Launch Pass。無料プランではトークンを発行できません。
- アカウントあたりのトークン数
- 同時に 5 個、クライアントごとに 1 つ。シートもチームプランもありません。
- ドキュメント
- https://www.screenmocks.com/mcp
よくある質問
Does ScreenMocks have an MCP server?
Yes. ScreenMocks runs a remote Model Context Protocol server at https://www.screenmocks.com/api/mcp, over the streamable HTTP transport. It exposes 45 tools covering everything the editor can do to a project: create projects, add screens and layers, style and align them, write captions, manage languages and canvas sizes, set screenshots, and reach the icon, stock photo and template libraries.
Which MCP clients does it work with?
Any client that speaks the streamable HTTP transport, including Claude Code, Claude Desktop, Cursor, VS Code, Codex and ChatGPT developer mode. There is nothing to install: it is a remote server, so a client only needs the URL and an access token.
How do I authenticate?
With a personal access token sent as an Authorization: Bearer header. Mint one in ScreenMocks under Settings, MCP access. The token is shown once, when it is created, and can be revoked at any time.
Do I need a paid plan to use the MCP server?
Yes. The MCP Connector is on every paid plan: Pro at $9.99 a month or $74.99 a year, and the Launch Pass at $149 once. The free plan can use the editor without limits but cannot mint an access token.
How many access tokens can one account hold?
Five at a time, one per client: an editor, a second machine, a CI job. There are no seats and no team model, so the five tokens belong to the one account that made them.
Can an agent see what it designed?
Yes. render_preview returns real images of the screens inline, rendered from the same document the export renders, and get_project with layout: true returns measured boxes, overflow, overlaps and legibility findings. Between them an agent can check its own work instead of reporting success blindly.
How do screenshots reach a project through MCP?
Image bytes never travel inside a tool call. An agent either imports a picture from a public URL with import_asset_from_url, or asks for a signed upload URL with create_upload_url and puts the file there itself. Either way it becomes an ordinary asset in the account.
Can an agent reach another account with my token?
No. Every tool runs against a project store bound to the token owner, so addressing another account is not expressible. Projects stay private to the account that owns them, and revoking a token cuts the client off immediately.