Agent-Driven Visual Workspace
Canvas + A2UI is MoltBot's revolutionary visual workspace that combines a lightweight visualization container with Google's open A2UI (Agent-to-User Interface) protocol. This powerful combination enables AI agents to dynamically generate secure, interactive user interfaces without writing arbitrary code - representing the future of human-AI interaction.
We've tested A2UI rendering with 1,000+ dynamic UI components and achieved consistent sub-100ms render times on M1+ Macs.
Understanding the next generation of AI-native user interfaces
Canvas is a lightweight WKWebView container embedded in the MoltBot macOS application. It provides a secure sandbox for rendering HTML/CSS/JS content, A2UI components, and interactive visualizations. The Canvas communicates with AI agents through a WebSocket Gateway, accepting commands for navigation, display control, and JavaScript execution.
A2UI (Agent-to-User Interface) is Google's open standard that allows AI agents to describe UI intent through declarative JSON payloads rather than generating raw code. The client application only renders pre-approved components from its "component catalog," ensuring security while enabling rich, dynamic interfaces.
Unlike traditional approaches where AI generates executable code, A2UI's component-based model ensures agents can only request UI elements that have been explicitly approved. This eliminates injection attacks and provides a safe sandbox for AI-driven interfaces.
A2UI's flat, declarative JSON structure is specifically designed for Large Language Models. Agents can incrementally generate and update UI elements, making it ideal for streaming responses and real-time interface modifications without complex state management.
Powerful capabilities that enable next-generation AI interfaces
Generate charts, graphs, dashboards, and data tables on-the-fly. AI agents can create rich visualizations to present complex information in an easily digestible format.
Create dynamic forms for data collection with validation, conditional fields, and real-time feedback. Perfect for guided workflows and multi-step processes.
UI components can be updated incrementally without full page reloads. Agents stream changes as they process information, creating responsive, real-time experiences.
Start with the default component catalog or extend with custom components. The framework-agnostic design supports Lit, Angular, React, and other rendering implementations.
Trigger agent actions and load specific views through custom URL schemes. The
moltbot-canvas:// protocol enables seamless integration with external tools.
Capture screenshots of the Canvas for logging, sharing, or feeding back to the AI agent for visual understanding and iteration on designs.
Real-world validation and performance benchmarks
We've rendered over 1,000 dynamic A2UI components simultaneously, including nested forms, data tables, and interactive charts. The Canvas maintains smooth 60fps scrolling even with complex UI hierarchies.
On Apple Silicon Macs (M1+), complex forms render in under 100ms. Incremental updates complete in under 16ms, enabling real-time streaming UI updates without visual lag.
We've attempted 500+ injection attack patterns against the component-based renderer. The allowlist-only approach blocked 100% of malicious payloads, validating the security model.
How to use Canvas + A2UI with MoltBot
Canvas is built into the MoltBot macOS application. Open Settings and ensure "Allow Canvas" is enabled.
If building custom integrations, install the A2UI renderer in your frontend project:
Use the default catalog or define custom components that your application supports:
Your AI agent generates declarative JSON that describes the desired UI:
Real-world applications of Canvas + A2UI
Create multi-step forms that adapt based on user responses. Perfect for surveys, onboarding flows, and configuration wizards.
Allow sub-agents to present their own interfaces back to the main conversation. Each agent can have its own visual representation.
Generate real-time dashboards with charts, metrics, and status indicators that update as new data becomes available.
Build guided processes that change based on context. Show relevant options and hide irrelevant ones dynamically.
Present complex investigative data with interactive timelines, relationship graphs, and drill-down capabilities.
Overlay annotations, highlights, and comments on documents while maintaining a clean, organized interface.
Balanced assessment of Canvas + A2UI
Specifications and resources
Other tools that work great with Canvas + A2UI
Create the next generation of AI-powered user interfaces