Affinity MCP vs code: why I make my thumbnails with a script

A developer found that generating a 1920×1080 thumbnail by having Claude Code write a Node script that assembles an SVG and renders it with rsvg-convert took six prompts and 3 minutes 54 seconds, versus twelve prompts and 17 minutes of active work through Affinity's MCP server. The Affinity MCP route, added in Affinity's September 2026 update with in-app scripting and a Claude AI Connector, failed to produce a usable finished thumbnail across multiple attempts, while the code-first approach produced a repeatable, editable scene file. The developer cautions the comparison is session notes rather than a benchmark, since the prompt copy changed between runs and multiple models were tried on the Affinity side.

Failing is hard. Especially when the tutorial is already recorded. I wanted to show how an agent can make a good thumbnail with Affinity MCP. I tried it multiple times. It didn't work as expected. Affinity's September 2026 update https://www.affinity.studio/blog/affinity-update-september-2026 added in-app scripting and an AI Connector for Claude. Affinity's pitch is that you describe a process once, and Claude builds a reusable script https://www.affinity.studio/blog/affinity-automation-scripting-claude . I connected it to Claude Code as an MCP https://argbe.tech/blog/webmcp-vs-mcp?utm source=devto&utm medium=syndication&utm campaign=affinity-mcp-code-first-thumbnails server and asked for a finished thumbnail. Using Sonnet 5.5 https://www.anthropic.com/claude-sonnet-5-5 with high reasoning was better. Opus 5.5 on xHigh was just thinking the whole time, so slow that I even cancelled it. Here is the prompt I used. Create an exceptional, finished, polished 1920 × 1080 LinkedIn video thumbnail in Affinity through MCP. Aim for award-winning, résumé-showreel quality. Go all out. Create assets with codex imagen. You can reimagine my pose and restyle myself as needed, angle, camera, appearance. But make me look happy and smiling. And look at the user. Create the new asset together with details for max conversions. But keep in mind to request transparent background. For other details use programmatic approach to make the scene complete. Headline: "I hate making thumbnails." Subtitle: "Made with Claude Code + Affinity MCP" Subtle branding: favicon + "argbe.tech". Add requirements graph. - Affinity Studio - Affinity MCP enabled - Claude Code Affinity MCP enabled You have 5 minutes. Fix obvious issues only; skip minor adjustments. I was so exhausted with the Affinity approach that I just tried code first. Same prompt, only the copy updated. And it worked much better. Code first means Claude Code writes a small Node script that builds the whole thumbnail as one SVG: the background, the headline, the branding and the photo of me as an embedded image. A command-line renderer then turns the SVG into a PNG. When I need extra assets, I create them with ChatGPT Image. A shortened version of the script from that run: python import fs from 'node:fs' import { execSync } from 'node:child process' const cut = fs.existsSync 'code-only/assets/alex-point.png' ? 'code-only/assets/alex-point.png' : 'assets/alex-cutout.png' const img = fs.readFileSync cut .toString 'base64' const svg = <svg width="1920" height="1080" viewBox="0 0 1920 1080" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" <rect width="1920" height="1080" fill=" 100C24"/ <image x="950" y="10" width="1120" height="1120" xlink:href="data:image/png;base64,${img}"/ <text x="84" y="536" font-family="Helvetica Neue, Arial, sans-serif" font-weight="800" font-size="196" fill=" fff" thumbnails.</text < -- glows, grid, the rest of the headline, subtitle, favicon and "argbe.tech" -- </svg fs.writeFileSync 'code-only/scene.svg', svg execSync 'rsvg-convert -w 1920 -h 1080 code-only/scene.svg -o code-only/thumbnail-code-only-1920x1080.png' The script is text. Claude Code can read all of it, change one coordinate, run it again and get the same image every time. The link previews on my site come from code too: a script renders one for each page when the site builds. If your product needs images like that, it's a small piece of software, not a design job. Affinity MCP took twelve prompts and seventeen minutes of active work. Code only took six prompts and three minutes fifty-four seconds. Those are my notes from these sessions, not a benchmark. The copy changed between the runs, and I tried more than one model on the Affinity side. The result is better than the original one. It finally generated me from a different angle. The proportions are still off. But at least it was fast. I hate making thumbnails. But we are almost at the point where they are created automatically. When I first posted this, I predicted YouTube would soon offer it as a feature. It already had. On 2026-09-23, two weeks before my post, YouTube announced https://blog.youtube/news-and-events/made-on-youtube-new-tools-power-creation-journey/ that creators can generate channel-matched thumbnails, and that Ask Studio can review older videos and suggest and test refreshed thumbnails. The announcement doesn't say who gets these features or when. A shorter version of this first appeared on LinkedIn on 2026-10-07. The maintained version, with every source and the date I last checked them, is on argbe.tech https://argbe.tech/blog/affinity-mcp-code-first-thumbnails?utm source=devto&utm medium=syndication&utm campaign=affinity-mcp-code-first-thumbnails .