ShotOps Cloud · Hosted MCP

Hosted MCP runs ShotOps on our hardware. Use it when you are working in ChatGPT or CI, when the screenshots are already reachable by URL, or when you do not want a local renderer. The same public endpoint works for every client:

https://mcp.shotops.dev/mcp

#Connect Claude Code or Cursor

Browser sign-in is the preferred path for an interactive client. Add the endpoint with no token or custom authorization URL:

claude mcp add --transport http shotops https://mcp.shotops.dev/mcp

On first use, the client discovers ShotOps's authorization flow, opens your browser and asks you to approve the connection. The endpoint publishes the standard OAuth metadata; you do not configure its internal authorization endpoints by hand.

In Cursor or another client with a server form, choose HTTP, enter the same endpoint and leave the headers empty. If the client accepts only JSON, the manual fallback is:

{
  "mcpServers": {
    "shotops": {
      "url": "https://mcp.shotops.dev/mcp"
    }
  }
}

Re-run sign-in from the client's MCP settings when the connection is revoked or points at the wrong account.

#Connect ChatGPT

ChatGPT can reach Hosted MCP and cannot start Local MCP. In ChatGPT on the web:

1. Create a custom app

   Open Settings → Apps → Create. Your workspace administrator may need to allow Developer Mode or custom apps before the control appears.

2. Scan the endpoint

   Enter https://mcp.shotops.dev/mcp, choose OAuth, then select Scan Tools. Complete the ShotOps browser sign-in and wait for the scan to finish.

3. Use the app

   Create the app, start a new chat and select ShotOps from the tools menu. Do not paste a personal shotops_ token into the app definition; ChatGPT maintains the browser-authorized connection.

The tools return a model-readable result in every supported client. ChatGPT may also show the optional panel gallery or bundle download interface. The workflow still works when that interface is unavailable.

OpenAI controls which workspace plans can create write-capable custom apps. If Create or write actions are missing, check OpenAI's current custom MCP app setup.

#Connect CI with an API token

Use a static token only when the client cannot open a browser.

1. Create the token

   Sign in to ShotOps, open the account menu, choose API tokens…, then Create token. Copy the shotops_… value when it appears; it is shown once.

2. Store it as a secret

   Put it in the CI provider's secret store. Never commit it or print it in a build log.

3. Send the bearer header

   Add Authorization: Bearer shotops_… to every request. A missing, unknown or revoked token gets a 401 before a tool runs, so it creates no partial work and spends nothing.

claude mcp add --transport http shotops https://mcp.shotops.dev/mcp \
  --header "Authorization: Bearer shotops_…"

The equivalent manual JSON fallback is:

{
  "mcpServers": {
    "shotops": {
      "url": "https://mcp.shotops.dev/mcp",
      "headers": { "Authorization": "Bearer shotops_…" }
    }
  }
}

Run it in CI covers refs, preview-first spending, durable production and cleanup after the connection works.

#Try a preview without an account

A connection with no sign-in can still call account_status, import screenshots and render a real low-resolution preview. It cannot save account state or produce store-ready output.

The anonymous allowance and limits come from Plans and output. Call account_status before the preview to see what this connection can do without consuming an attempt. If the allowance is exhausted, the refusal names sign-in as the remedy; that condition is distinct from an authenticated account running out of cloud credits.

#Getting screenshots in

Hosted MCP cannot read a path on your computer. The shortest route moves nothing at all: a project whose screenshots are stored on your account already holds them, so the agent renders it with no attachment, no upload and no shell. That is the one route that works in every client, ChatGPT on a phone included.

1. Open a project in the browser

   Sign in at shotops.dev and create or open the project for this app.

2. Drop the raw screenshots in

   Add the raw PNGs to the project's frames, in the panel order you want.

3. Store them on your account

   Open the project's settings, choose Screenshots, and select Your account. The screenshots now travel with the project instead of living in that one browser.

Then ask for the strip by name — “render my Tidebook project” — and the agent calls render_project with nothing attached.

When the screenshots exist only in the conversation, choose the form that matches where the PNG is:

Use refs for real screenshots. Inline screenshot data is bounded for small fixtures and can exceed the host request limit before the server can explain the refusal. Screenshots and assets owns the exact input forms, retention and cleanup model.

#Check the connection

Ask your agent:

Check my ShotOps account status and tell me whether this Hosted connection can preview, save a project and produce store-ready output.

account_status is read-only and spends no cloud credits or anonymous preview attempt. Its structured result distinguishes authentication, plan, choice, balance and billing conditions. Use its nextStep rather than guessing from the accompanying sentence.

#Render your first preview

With the screenshots reachable — stored on the project, attached, or at a URL — ask for the strip in words. Nothing here needs a shell or a file on your disk, so it works in ChatGPT as written:

Turn my five Tidebook screenshots into an App Store preview. Keep them in filename order, use these headlines: “Know the tide before you go”, “Seven days of swell”, “Every spot you surf”, “Your own session log”, and “Wake up to the right swell”. Show me the preview before making store-ready files.

That request says nothing about how the strip should look, so the agent may open with two styling questions — a palette and a layout — before it renders anything. Answer them, or say “surprise me” and it chooses. Naming a palette and a layout in the request skips the questions.

Say preview explicitly. It is the low-resolution decision copy and the right artifact for iteration; store-ready output is a later, deliberate step. Plans and output is the authority for what a Hosted preview spends and what production requires.

Five panels come back in order, each with one screenshot, one device treatment and its headline. ChatGPT may also show them in a gallery panel; the same result is readable without it. Before revising, check three things:

• The longest headline is readable and does not sit on the device.
• Every screenshot appears in the intended panel.
• The response reports no layout finding and no missing source.

Then make one change in words — “give the headlines more room by using the bleed layout, then render another preview” — and compare the two. Troubleshooting maps each observed refusal to its remedy.

#Continue to production

Once the design is approved:

• Plans and output is the authority for entitlement, cloud credits and the preview/store-ready boundary.
• Work on a saved project keeps the design and available screenshots.
• Run it in CI explains how a production operation survives a disconnect and how to collect its result without starting or paying for the work twice.