AI ツールを接続する
AI にスクリーンショットの作成・編集を許可し、ウェブサイトで確認して書き出します。
サービスに接続
MCP が有効な環境では、AI ツールで HTTP / Streamable HTTP と OAuth を選び、下記のアドレスを設定します。ブラウザーで AppScreenshots にログインし、アクセスを許可するプロジェクトと素材を選択して、新規作成を許可するか決めます。データベースへのアクセスや API キーは不要です。
https://appscreenshots.net/api/mcp素材を準備
まずウェブエディターで元のスクリーンショットをアップロードし、そのプロジェクトまたは個別の素材を許可します。選択したプロジェクトに添付済みの素材も含まれます。MCP にアップロード機能はなく、チャットの添付ファイルは自動で利用可能にはなりません。検索結果の選択は表示中の項目だけを追加し、既存の選択を保持します。
プロンプト例
許可した素材と利用可能なテンプレートで、英語の App Store スクリーンショットを作成してください。短い見出しと明快なレイアウトにし、利用可能なブラウザーツールでエディターを開いて画像を確認・修正してください。最後に、ウェブサイトで書き出せるプロジェクトリンクを教えてください。
確認と書き出し
AI がデザインと文章を作り、MCP が編集可能なプロジェクトを保存します。get_project_preview はエディターのリンクと確認手順を返し、画像は生成しません。ブラウザーのログインは MCP OAuth とは別です。再読み込み前に未保存の変更を保存するか解決してください。ブラウザーや画像ツールがなければ、AI はリンクを返して視覚的な確認が未完了と伝える必要があります。PNG/JPEG はウェブエディターで確認して書き出します。
アクセスを管理
「設定 → 接続済みの AI ツール」でプロジェクトや素材を変更し、接続を取り消せます。取り消すとアクセスは直ちに失われ、再接続は AI ツールから行います。未許可のプロジェクトにはアクセスできません。同時編集で競合した場合は、最新版を読み込んでから変更してください。
プランとクライアント
プロジェクト数、有料テンプレート、カスタムフォント、一括書き出しの制限は引き続き適用されます。MCP はクラウド描画、サイト内 AI 画像生成、購入、削除、ストア公開を提供しません。ブラウザーでの確認に Browserless やバックグラウンド描画キューは不要です。
クライアントには Streamable HTTP とブラウザー OAuth の対応が必要です。Claude Code、Codex、Gemini CLI、Z Code、Kimi Code は設定方法が異なるため、インストール済みバージョンの HTTP/OAuth 設定を使ってください。ChatGPT ではアカウントやワークスペースにカスタム接続機能、または別途公開された連携が必要です。ブラウザー操作と画像確認はクライアントのツールに依存します。認証が失効したら AI ツールから接続をやり直してください。
AppScreenshots ドキュメント