Guides·AI

AI assistants & MCP

Connect any MCP-capable AI client to Protok Studio and let it build screens, wire logic, and edit bindings with typed tools.

Protok Studio exposes your project through the Model Context Protocol — the open standard AI clients use to call external tools. Instead of generating text you have to paste back into the editor, the assistant calls real operations: add_widget, link_nodes, create_animation, and the rest of the Protok tool set. Every call is schema-validated, lands on your canvas instantly, and shows up in the AI panel's activity log.

1. Live endpoint — drive the open project

While the desktop app is running, it serves an MCP endpoint on localhost:

endpoint
http://127.0.0.1:7100/mcp

Add it to your client's MCP configuration:

mcp config
{
  "mcpServers": {
    "protok": {
      "url": "http://127.0.0.1:7100/mcp"
    }
  }
}

The AI then edits the project you have open — you watch widgets appear on the canvas, see a toast per action, and review everything in Recent AI calls inside the AI tab. Changes are marked unsaved; Ctrl+S writes them when you're happy.

Any MCP client that supports the Streamable HTTP transport can connect — desktop apps, CLI agents, and IDE plugins alike. Drop the mcpServers block into your client's MCP configuration (or run its mcp add command with the URL above) and restart the client. If your client stores MCP config inside the repo instead, commit it there and every session picks the endpoint up automatically.

Nothing to authenticate

The endpoint binds to 127.0.0.1 only — it never leaves your machine and needs no keys or tokens.

2. Offline server — edit files without the IDE

The desktop app also ships protok-mcp, a standalone stdio server that edits .lowcode/.pui project files directly. Point it at a project and the AI can restructure screens even while Studio is closed:

mcp config
{
  "mcpServers": {
    "protok": {
      "command": "node",
      "args": ["<IDE>/dist-electron/protok-mcp.cjs", "<path-to-project-dir>"]
    }
  }
}

In the installed app the file lives under resources/app.asar.unpacked/dist-electron/protok-mcp.cjs.

3. What the AI can do

The registry exposes typed tools grouped by area:

  • Project — project_info, project_summary, open_project, save_project, project info & settings (.psettings)
  • Screens — list/add/update/remove/duplicate screens, set the active screen
  • Widgets — list/add/update/remove widgets with type defaults, list_widget_types catalog
  • Events — set_widget_event for screen switches, animations, and lowcode actions
  • Animations & timelines — create, update, and delete global or per-screen animations and timelines
  • Lowcode — add nodes, link/unlink ports, patch properties, delete nodes, list_node_types catalog
  • CAN/DBC — load .dbc databases, list messages, bind signals to widget properties
  • Bus simulation — start/stop buses, send frames once or cyclically, pin signal values, run waveform generators, replay recorded logs
  • Runtime preview — enter Hand mode and drive the WASM simulator like a user would
  • TRDP — inspect the TRDP database, add/remove RX bindings and TX telegrams
  • Variables & structs — create and edit project variables and struct types
  • Themes — list/add/remove themes, set and unbind design tokens (@token), pick the default theme
  • i18n — add languages, edit translations, set the default language
  • Assets — list/add/remove project assets
  • Figma — inspect a connected Figma file and import/export frames into the project

Widget and node ids are auto-generated collision-free; port ids are validated when linking, so a bad connection is rejected instead of silently breaking codegen.