Product Mockups With ChatGPT or Claude From One Product Photo

An assistant needs two files to make a mockup: one photo of the blank product and the design. It needs no PSD, no Photoshop and no template library, because SudoMock turns the photo itself into the mockup.

• The product photo. The blank product with its printable face straight on to the camera, in even light, with nothing printed on it. A photo of your own sample works, and so does the plain product image already in your store. How to make your own mockup shows what makes a photo work.
• The design. The print file you send to your print provider, ideally a transparent PNG.
• A link to each file. The hosted connector reads files by HTTPS link, such as the image URL in your store. A photo that sits only on your computer can become a photo mockup once in the SudoMock dashboard, and the assistant finds it there with list_photo_mockups. Each design needs a link too, such as its file URL in your store or at your print provider. A coding agent such as Claude Code, Cursor or Codex CLI gets one for a file on your disk with create_upload_url.

Both assistants add SudoMock's hosted MCP server, https://mcp.sudomock.com, as a custom connector. Access is approved in a SudoMock sign-in window, never with a key pasted into the chat.

• ChatGPT. OpenAI's steps for a custom MCP server, read on 7 October 2026: open ChatGPT Plugins, select the plus button, then Add custom MCP server, enter the server URL, set up the sign in and select Create as a plugin, then install the plugin and pick it with @ in a new chat. OpenAI notes that "Account and workspace policies apply to adding and using custom MCP servers."
• Claude. Open Customize, then Connectors, choose Add custom connector and enter the same URL (if the dialog asks how Claude registers, choose Register automatically), then turn SudoMock on in a chat from + and Connectors. Claude's guide to custom connectors, read on 7 October 2026, lists adding a connector by URL on the Free, Pro, Max, Team and Enterprise plans, with one custom connector on Free, and on Team and Enterprise an Owner adds it for the organization.
• Claude Code, Cursor and Codex CLI. A command or a click each, listed on Connect an agent.

Then ask the assistant to run get_account. It reads your account and creates nothing, and an answer means the tools are live.

The assistant sends the photo's link to create_photo_mockup. SudoMock finds the product's printable surface and returns a reusable mockup that stays in your account for every later design.

We ran it on 7 October 2026 with the photo below, a white square pillow on a sofa.

The input: a 1536 px photo of a blank pillow, made with an AI image model for this example.

The connector makes the same request as the Photo Mockups API. This is the answer we got, trimmed to the fields the next step uses:

{
  "data": {
    "mockup_id": "1b30241b-f94a-4b7c-8c6b-7068f47560a9",
    "status": "ready",
    "source_width": 1536,
    "source_height": 1536,
    "quads": [],
    "surfaces": [
      {
        "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
        "bbox": { "x": 205.0, "y": 283.0, "width": 1170.0, "height": 1015.0 }
      }
    ]
  },
  "success": true
}

surfaces holds the whole front of the pillow, addressed by surface_uuid. quads would hold bounded print areas such as a chest panel, and here it is empty, so the design goes on the surface. Print areas and surfaces explains both lists.

Before the first render, the assistant compares the printable area with where the print provider prints that product. A mockup should show the print where the finished product carries it.

On the pillow the surface covers the front face from seam to seam, 1170 x 1015 px of the 1536 px photo, which is the face a pillow is printed on, so it needed no change. For a tee, a tote or a hoodie, read the placement in your provider's catalog (front, back, sleeve). When your provider prints elsewhere on the product, the assistant draws a print area with update_photo_mockup_print_areas (it replaces the whole list of print areas, up to eight convex areas of four corner points each, in the photo's own pixels, from the top left corner clockwise) and renders on the print_area_id it returns.

Each design is one render_photo_mockup call naming the mockup, the surface and the design's link. The mockup does not change between calls, so the hundredth design lands exactly like the first.

These are the arguments for the lemon design, as a 1024 px JPG:

{
  "mockup_uuid": "1b30241b-f94a-4b7c-8c6b-7068f47560a9",
  "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
  "artwork_url": "https://example.com/designs/lemon-branch.png",
  "coverage": 75,
  "image_format": "jpg",
  "image_size": 1024
}

coverage sets how much of the surface the design spans, from 10 to 100, centered unless a position says otherwise. The tool answers with the finished image's URL. A script makes the same render with one request, and the image is at data.print_files[0].export_path:

curl -X POST https://api.sudomock.com/api/v1/photo-mockups/1b30241b-f94a-4b7c-8c6b-7068f47560a9/render \
  -H "x-api-key: $SUDOMOCK_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "print_areas": [
      {
        "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
        "artwork_url": "https://example.com/designs/lemon-branch.png",
        "placement": { "coverage": 75 }
      }
    ],
    "export_options": { "image_format": "jpg", "image_size": 1024 }
  }'

const response = await fetch('https://api.sudomock.com/api/v1/photo-mockups/1b30241b-f94a-4b7c-8c6b-7068f47560a9/render', {
  method: 'POST',
  headers: {
    'x-api-key': process.env.SUDOMOCK_API_KEY,
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    "print_areas": [
      {
        "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
        "artwork_url": "https://example.com/designs/lemon-branch.png",
        "placement": {
          "coverage": 75
        }
      }
    ],
    "export_options": {
      "image_format": "jpg",
      "image_size": 1024
    }
  }),
});

const data = await response.json();
console.log(data);

import os
import requests

response = requests.post(
    "https://api.sudomock.com/api/v1/photo-mockups/1b30241b-f94a-4b7c-8c6b-7068f47560a9/render",
    headers={
        "x-api-key": os.environ["SUDOMOCK_API_KEY"],
        "Content-Type": "application/json",
    },
    json={
        "print_areas": [
            {
                "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
                "artwork_url": "https://example.com/designs/lemon-branch.png",
                "placement": {
                    "coverage": 75,
                },
            },
        ],
        "export_options": {
            "image_format": "jpg",
            "image_size": 1024,
        },
    },
)

print(response.json())

package main

import (
	"bytes"
	"fmt"
	"io"
	"net/http"
	"os"
)

func main() {
	payload := []byte(`{
  "print_areas": [
    {
      "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
      "artwork_url": "https://example.com/designs/lemon-branch.png",
      "placement": {
        "coverage": 75
      }
    }
  ],
  "export_options": {
    "image_format": "jpg",
    "image_size": 1024
  }
}`)

	req, err := http.NewRequest("POST", "https://api.sudomock.com/api/v1/photo-mockups/1b30241b-f94a-4b7c-8c6b-7068f47560a9/render", bytes.NewBuffer(payload))
	if err != nil {
		panic(err)
	}
	req.Header.Set("x-api-key", os.Getenv("SUDOMOCK_API_KEY"))
	req.Header.Set("Content-Type", "application/json")

	resp, err := http.DefaultClient.Do(req)
	if err != nil {
		panic(err)
	}
	defer resp.Body.Close()

	body, _ := io.ReadAll(resp.Body)
	fmt.Println(string(body))
}

<?php

$payload = <<<'JSON'
{
  "print_areas": [
    {
      "surface_uuid": "f554662e-43eb-40bb-9ecc-c5b7d5d76a8f",
      "artwork_url": "https://example.com/designs/lemon-branch.png",
      "placement": {
        "coverage": 75
      }
    }
  ],
  "export_options": {
    "image_format": "jpg",
    "image_size": 1024
  }
}
JSON;

$ch = curl_init('https://api.sudomock.com/api/v1/photo-mockups/1b30241b-f94a-4b7c-8c6b-7068f47560a9/render');
curl_setopt_array($ch, [
    CURLOPT_CUSTOMREQUEST => 'POST',
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => [
        'x-api-key: ' . getenv('SUDOMOCK_API_KEY'),
        'Content-Type: application/json',
    ],
    CURLOPT_POSTFIELDS => $payload,
]);

$response = curl_exec($ch);
curl_close($ch);

echo $response;

Two designs on the same pillow, rendered on 7 October 2026. Both designs were made with an AI image model for this example.

Lemon branch design rendered on the pillow photo at coverage 75, 2048 px, 7 October 2026.

Sleeping cat badge on the same photo mockup at coverage 70, same day.

Only artwork_url and coverage changed between the two calls. The average SudoMock render finishes in under a second, and for files you upload to a marketplace, SudoMock's render guide recommends JPG.

When the seller owns a layered mockup template, the assistant renders on it instead. The PSD carries the designer's warp, shadows and masks, so render_psd_mockup only places the design in the template's smart object.

The assistant finds the template with list_psd_mockups, or adds a new one with upload_psd from a link, which has no file size limit over the API. The dashboard takes PSD files up to 300 MB. SudoMock's guide to choosing a mockup type puts the rule in one line: "Let the files you already own pick the mockup type." For a color range from one template, see T-shirt color variant mockups.

Paste the rules below into your assistant's instructions: a ChatGPT or Claude project, or the AGENTS.md of a coding agent. They make it ask one question, pick the right tool and hand back finished images, and they name the tools exactly as the server publishes them.

You make product mockups for my shop with the SudoMock tools.
1. For each product, ask me once what I have: a PSD mockup
   template, a photo of the blank product, or neither.
   Never render to find out.
2. PSD template: find it with list_psd_mockups and render each
   design with render_psd_mockup.
3. Product photo: look for its mockup with list_photo_mockups
   and read its surface_uuid with get_photo_mockup.
   If there is none, run create_photo_mockup with the photo's
   HTTPS link and keep the mockup_id and the surface_uuid.
4. Before the first render, compare the printable area with
   where my print provider prints this product. If it is off,
   draw a print area with update_photo_mockup_print_areas and
   keep its print_area_id.
5. Render each design with render_photo_mockup: on the surface,
   coverage 60 to 80 for a centered design, on a print area,
   fit. Use jpg for marketplace uploads, at image_size 1024
   unless I ask for a larger width.
6. Use my design file as it is. Never redraw the design or the
   product with an image model.
7. Neither a PSD nor a photo: ask me for one photo of the blank
   product, or point me to the templates at sudomock.com/mockups.
8. Reply with each image URL, the design and the product it
   shows, and the products that still need a photo.

A coding agent that is not connected to the server gets the same choice and the request shapes from SudoMock's skill, installed with npx skills add https://sudomock.com/docs.

Connect the server with the steps on Connect an agent, then give the assistant one product photo and one design. The Photo Mockups overview covers the create and render calls step by step, and agents can read every docs page as Markdown from the docs index. To have Claude write whole Etsy listings from the renders, see Etsy listing generator with Claude and SudoMock. With no product photo yet, start from the mockup template library.