Enable AI-powered solution configuration through Model Context Protocol integration.

AI MCP for Designer Connector

Enable AI-powered solution configuration through Model Context Protocol integration.

Version: 0.6
Last Updated: January 25, 2026
Connector Name: DesignerMCP
Interface: TCP/IP (stdio transport)

Overview

The AI MCP for Designer service enables AI models to interact with the FrameworX Designer application, providing intelligent assistance for solution configuration tasks. Instead of manually creating and configuring objects, you can describe what you need in natural language and let AI generate the configuration.

Note: This connector is for configuration-time operations (building solutions in Designer.exe). For querying live data from running solutions, see AI MCP for Runtime Connector.

Key Capabilities

• Navigate Designer UI — AI can observe and interact with the Designer interface
• Create Objects — Generate Tags, Displays, Alarms, and other solution objects
• Query Objects — Search and inspect existing solution configuration
• Validate Configuration — Pre-check configurations before creating objects
• Generate Displays — Create Canvas and Dashboard displays with proper FrameworX patterns
• Export/Import Displays — Work with displays in AI-friendly JSON format
• Take Screenshots — Capture Designer state for context

When to Use MCP for Designer

Prerequisites

• FrameworX 10.1 Designer
• .NET 8.0 runtime
• Claude Desktop or compatible MCP client
• Network connectivity (if Designer runs on remote machine)

Configuration

Enabling MCP for Designer

1. Open FrameworX Designer
2. Navigate to Edit → Settings → MCP
3. Enable MCP Server
4. Note the Port number (default: 3102)
5. Click Apply

Connecting Claude Desktop

Configure Claude Desktop to connect to the Designer MCP server:

1. Open Claude Desktop
2. Go to Settings → Developer → Edit Config
3. Open the "claude_desktop_config.json" file
4. Add the MCP for Designer configuration:

{
  "mcpServers": {
    "FrameworX-Designer": {
      "command": "<ProductPath>\\fx-10\\net8.0\\TMCPServerDesigner\\TMCPServerDesigner.exe",
      "args": ["/port:3102"],
      "transport": "stdio"
    }
  }
}

1. Replace <ProductPath> with your FrameworX installation directory (use double backslashes)
2. Save and close the file
3. Restart Claude Desktop completely (close via Windows Task Manager)

Tip: You can run both MCP for Designer and MCP for Runtime simultaneously by including both configurations in your claude_desktop_config.json file.

Verifying Connection

1. Open Claude Desktop
2. Go to Settings → Developer
3. Verify "FrameworX-Designer" shows status "running"
4. Open a new chat and click Search and Tools — you should see the Designer tools listed

Available Tools

AI MCP for Designer provides these tools organized by category:

Session Management

Schema Discovery

Object Operations

Display Operations

Information & Navigation

Display JSON Formats

AI MCP for Designer uses simplified JSON formats for creating and modifying displays.

Canvas Display Format

Canvas displays use absolute pixel positioning:

{
  "Type": "DisplaysList",
  "Name": "TankOverview",
  "Width": 1366,
  "Height": 768,
  "DisplayMode": "Page",
  "Children": [
    {
      "Type": "Symbol",
      "SymbolName": "HMI/Tanks/TankWithLevel",
      "Left": 100,
      "Top": 50,
      "Width": 200,
      "Height": 300,
      "SymbolLabels": [
        { "Key": "Level", "Value": "@Tag.Tank1.Level" },
        { "Key": "Title", "Value": "Tank 1" }
      ]
    },
    {
      "Type": "TrendChart",
      "Left": 350,
      "Top": 50,
      "Width": 400,
      "Height": 300,
      "LinkedValue": "@Tag.Tank1.Level"
    }
  ]
}

Dashboard Display Format

Dashboard displays use grid-based positioning with resizable cells:

{
  "Type": "DisplaysList",
  "Name": "MotorDashboard",
  "Width": 1366,
  "Height": 768,
  "DisplayMode": "Page",
  "DashboardDisplay": {
    "Columns": ["*", "*", "*"],
    "Rows": ["*", "*"]
  },
  "Cells": [
    {
      "Row": 0, "Col": 0,
      "Cell": { "HeaderLink": "Motor 1" },
      "Content": {
        "Type": "Symbol",
        "SymbolName": "HMI/Motors/MotorStatus",
        "SymbolLabels": [
          { "Key": "Value", "Value": "@Tag.Motor1.Status" }
        ]
      }
    },
    {
      "Row": 1, "Col": 0, "ColSpan": 3,
      "Cell": { "HeaderLink": "Trend" },
      "Content": {
        "Type": "TrendChart",
        "LinkedValue": "@Tag.Motor1.Speed"
      }
    }
  ]
}

Key Format Features

For complete format specifications, see:

• Canvas and Symbol JSON Reference
• Dashboard JSON Reference

Example Queries

Creating Objects

• "Create a new analog tag called Tank1_Level with engineering units in gallons, range 0-1000"
• "Create 10 temperature sensor tags named Sensor_T01 through Sensor_T10"
• "Add a high alarm at 85 and high-high alarm at 95 to all temperature tags"
• "Create a Modbus TCP channel for PLC at 192.168.1.10"

Querying Configuration

• "List all tags in the Boiler area"
• "Show me the alarm configuration for Tank1_Level"
• "What displays reference the tag Pump1_Status?"
• "Show me the schema for creating historian tags"

Creating Canvas Displays

• "Create a canvas display showing Tank1 with a level gauge and numeric readout"
• "Add a status indicator that turns red when Tank1_Level exceeds 900"
• "Create a P&ID style display with three tanks connected by pipes"

Creating Dashboard Displays

• "Create a 2×3 dashboard for monitoring six motors"
• "Make a dashboard with a navigation panel on the left (200px) and content area on the right"
• "Create a dashboard with AlarmViewer spanning the bottom row"

Modifying Displays

• "Export the MotorOverview display so I can see its structure"
• "Add a CircularGauge to the Motor 1 cell showing speed"
• "Change the TrendChart to show the last 48 hours instead of 24"

Learning & Discovery

• "What object types are available in FrameworX?"
• "Show me the required fields for creating an alarm item"
• "What symbols are available for motor status?"
• "List the parameters for the HMI/Labels/ShortLabel symbol"

How AI Context Works

When you open or create a solution, the AI automatically receives context about the FrameworX object model, including:

• Available object types and their relationships
• JSON formats for creating objects and displays
• Dependencies between objects (e.g., AlarmItem requires Tag + AlarmGroup)
• Pre-defined objects available in every solution
• Runtime namespace syntax for referencing objects
• Symbol library structure and common symbols

This context enables the AI to generate valid configuration without you needing to explain the FrameworX data model. For detailed information beyond what's in the context, the AI can use the search_docs tool to query the FrameworX documentation.

Display Context

For display operations, the AI also receives:

• Available control types and their properties
• Symbol library categories and naming conventions
• Dashboard grid constraints (≤4×4 for simple format)
• Dynamic behavior options (color change, visibility, etc.)
• Theme property mappings

Best Practices

Review Before Committing

AI-generated configuration should always be reviewed before saving:

• Verify object names and hierarchy placement
• Check property values and units
• Validate alarm configurations
• Test display layouts and bindings
• Preview dashboards at different screen sizes

Use Version Control

• Save solution backups before bulk AI operations
• Use FrameworX solution versioning features
• Consider Git integration for exported JSON files

Effective Prompting

For best results when working with AI MCP for Designer:

Display Creation Tips

Start Small

• Test with single objects before bulk operations
• Verify AI understands your naming conventions
• Build complexity gradually
• Create simple displays before complex dashboards

Troubleshooting

Designer MCP Server not starting

• Verify .NET 8.0 runtime is installed
• Check that Designer is running
• Confirm MCP is enabled in Designer settings
• Check firewall settings for the configured port

Claude doesn't see Designer tools

• Ensure claude_desktop_config.json path is correct (use double backslashes)
• Restart Claude completely (close via Task Manager)
• Verify Designer MCP shows "running" in Claude settings

AI creates objects in wrong location

• Specify full path in your request (e.g., "in the Boiler/Tanks folder")
• Ask AI to show the solution structure first
• Provide explicit parent object references

Display not rendering correctly

• Check that all referenced tags exist
• Verify symbol paths are correct (use search_symbols to find)
• For dashboards, ensure grid dimensions ≤4×4 for simple format
• Check for missing SymbolLabels on symbols

Dashboard cells not positioned correctly

• Verify Row/Col values are 0-based
• Check ColSpan/RowSpan don't exceed grid bounds
• Export existing dashboard to see expected format

Changes not appearing in Designer

• Refresh the Designer view (F5)
• Check if object was created in a different location
• Verify the operation completed successfully in Claude's response
• For displays, close and reopen the display editor

Related Documentation

JSON Format References

• Canvas and Symbol JSON Reference — Complete Canvas/Symbol format specification
• Dashboard JSON Reference — Dashboard format specification
• XAML-JSON Translation Specification — How JSON maps to XAML

AI MCP for Runtime

For querying live data from running solutions:

• AI MCP for Runtime Connector — Query tags, alarms, and historian
• AI MCP for Runtime Tutorial — Step-by-step guide

Quick Start Tutorials

• AI MCP for Designer Tutorial — Create your first objects with AI
• Creating Displays with AI — Display generation walkthrough

Example Implementation

• SolarPanels MCP Demo — Full solution with MCP integration

Technology Information

• AI-Ready by Design — Platform architecture for AI integration

Reference Information

• Display XAML Reference — XAML patterns for displays
• TControl XAML Inventory — Complete control reference
• Scripts Module Reference — For creating custom MCP tools

Change Log

In this section...