Combine UI and agent work

You can edit a Misaki Studio project in the visual UI and through MCP because both routes operate on the same project and file models. The safest collaboration uses explicit handoffs: finish the current UI gesture, give the agent a precise target, let it change and verify a bounded result, then review that result before continuing manually.

Coverage: UI + MCP for project content; separate session state for navigation.

What is shared

Stored project content is shared between the routes, including supported:

• files and folders;

• visual element trees and styles;

• screens, variants, properties, states, events, logic, and timelines;

• design-system and data files;

• export settings and other project configuration.

A Component created by an agent appears in the File Explorer. An element changed in the editor can be read through MCP. Supported design-file content edits also use the same per-file undo/redo history.

What is not shared

Editor navigation is session state rather than project content. MCP project selection does not need to match:

• the project or file currently visible in the app;

• open file tabs and their order;

• Previous/Next file-navigation history;

• expanded File Explorer or Element Explorer rows;

• canvas zoom, panel widths, or visible inspector tab;

• the user's current selection.

An agent should use explicit project, file, and node targets. Do not rely on “the thing on my screen” unless the target is also supplied through a copied reference or a current read.

A reliable handoff

1. Finish the active drag, text edit, rename, or inspector input in the UI.

2. Save or wait for the project state to settle when the current workflow requires it.

3. Copy Copy Path For MCP from a file/folder, or Path → Copy For MCP from an element.

4. Tell the agent what it may change, what it must preserve, and what proof to return.

5. Avoid editing the same file while the agent's write is in progress.

6. Review the changed hierarchy, inspector values, Preview behavior, and any generated output.

7. Continue in the UI, request a bounded correction, or undo the relevant design-file content step.

Example:

In the selected Website project, inspect <element reference>. Change only its base padding to 24px; preserve its children, screen overrides, variants, states, logic, and timelines. Read the resolved style back and show a Preview screenshot. Do not change any other element or file.

Choose the route that fits the moment

The UI is especially useful for:

• direct visual composition and spatial judgment;

• drawing paths and manipulating handles;

• scrubbing animation and comparing responsive screens;

• selecting an element by sight;

• reviewing the whole workspace before accepting a result.

An agent is especially useful for:

• reading structure and contracts across several files;

• applying a repeated, explicit change to known targets;

• creating a planned nested subtree;

• inspecting logic, generated code, diagnostics, or machine-readable Preview state;

• comparing current values against a precise requirement.

These are working strengths, not restrictions. The UI-to-MCP capability map records current coverage and exceptions.

Avoid conflicting edits

Do not make overlapping writes to the same design file at the same time. Both UI and MCP edits enter that file's live state and history, so the next undo reverses whichever eligible transaction is currently on top—not necessarily “the agent's last idea.”

If parallel work is necessary, use different files and require each agent task to re-read its target before writing. Re-read again after a file move, rename, conversion, deletion, or substantial tree replacement.

Review activity without mistaking it for proof

The desktop editor can mark files and elements affected by MCP calls. Collapsed ancestors can carry rolled-up activity so you can locate work without leaving every hierarchy expanded.

Those marks are temporary review aids. They do not prove that the visual result, behavior, generated code, or external destination is correct. Use Review agent activity to locate work and Verify agent work to accept it.

External effects need a separate handoff

Project edits and external operations have different recovery boundaries. Pause and confirm before the agent exports to a local folder, changes Git, publishes, runs an external database action, or writes to another service. The design-file undo stack cannot reverse those destinations.

Current limits

• The packaged desktop app must run for the production MCP endpoint and host-assisted Preview operations.

• A reconnect creates a new MCP session; select the project again.

• A stale copied path can stop resolving after its file or folder is renamed or moved.

• Some UI actions are editor navigation only, while some MCP reads have no ordinary button equivalent.

• Whole-file operations and external writes are not covered by design-file content undo.