Neon Studio IDE & AI Agents

Neon Studio IDE (neon_studio_ide.dart & neon_studio/web/index.html) is an interactive development workbench that combines the best visual design workflows of Apple Xcode, the deep inspection power tools of Android Studio, and exclusive Neon capabilities including Time-Travel State Debugging, 1-Click Universal Cross-OS Packaging, and the Google Antigravity Multi-Agent Dock.


1. Launching the Neon Studio IDE Live Workbench

Start the Neon Studio IDE server from your terminal or open it directly in your browser:

# Start the Neon Studio IDE Live Workbench on port 9090
neon studio --port 9090

Once started, open the interactive workbench at:

Live Workbench URL: http://localhost:9090


2. What You Can Do Inside Neon Studio IDE (http://localhost:9090)

A. Live .neon → .dart Compilation

  • Type or edit declarative UI code in the NeonLang (.neon) Editor (center pane) or click ⚡ Compile .neon → .dart.
  • Watch the bottom-right pane automatically generate the live, 100% interoperable Neon Framework Dart (.dart) code in real time with 1:1 Source Maps.

B. Xcode-Style Dual-OS Live Canvas (iOS 18 UIKit + Android 15 Kotlin)

  • Preview and interact with both iOS 18 UIKit and Android 15 Kotlin (Material 3) device shells side by side in real time.
  • Click + Add Quick Task inside either the iOS or Android device preview to test live reactive state updates across both platforms simultaneously.
  • Switch to the Visual Route Storyboard Graph to inspect all NeonRouter routes and deep-link transitions, or open Unified Signing & Capabilities to manage Info.plist and AndroidManifest.xml permissions from a single panel.

C. Android Studio Power Tools: 3D Layer Inspector & RFC-6902 Patch Profiler

  • Exploded 3D Widget Layer Hierarchy Inspector: Inspect widget nesting depth, layout bounds, padding, and elevation in 3D space.
  • RFC-6902 Patch Profiler: Monitor every incremental JSON patch (update, replace, insert, remove) sent over the bridge and track real-time bandwidth savings (up to 98% payload reduction vs. full-tree renders).

D. Neon Exclusives: Time-Travel Scrubber & 1-Click Cross-OS Builder

  • ⏱️ Interactive Time-Travel State Scrubber: Drag the timeline slider in the bottom-left dock backward and forward to scrub through historical state frames and replay UI mutations without restarting the app.
  • 📦 1-Click Universal Cross-OS Mobile Package Builder:
    1. In the top toolbar, select your Host OS (Apple macOS, Windows 11, or Linux Ubuntu).
    2. Choose your Target Artifact (Android .apk, Android .aab / .bundle, iOS .app Bundle, or iOS .ipa Signed Archive).
    3. Click 📦 1-Click Cross-OS Build — it builds and signs the real package into NeonFramework-2/neon_framework/build/studio_packages/ and streams the complete build steps in the console.

3. Feature Architecture Matrix

| Capability | Origin / Inspiration | Implementation in NeonStudioIdeWorkbench | | :--- | :--- | :--- | | Split-Pane Dual-OS Live Canvas | Apple Xcode | Simultaneous interactive iOS UIKit & Android Kotlin preview canvas | | Visual Route Storyboard Graph | Apple Xcode | Interactive node graph of NeonRouter routes and modal stacks | | Unified Signing & Capabilities | Apple Xcode | Single-click sync for Info.plist entitlements & AndroidManifest.xml | | Exploded 3D Widget Layer Inspector | Android Studio | 3D Z-axis layer inspection for widget bounds and hierarchy depth | | RFC-6902 Patch Profiler | Android Studio | Live delta stream inspector measuring byte savings per action | | Time-Travel State Scrubber | Neon Exclusive | Scrub backward and forward across recorded state snapshots | | 1-Click Cross-OS Package Builder | Neon Exclusive | Build .apk, .aab/.bundle, .app, and .ipa on Windows, macOS, & Ubuntu | | Google Antigravity Agent Dock | Neon Exclusive | Multi-agent AI assistant powered by Gemini Cloud, Gemma 4, & Ollama |


4. neon-mcp-server & Google Antigravity SDK Multi-Agent Integration

Neon Studio IDE integrates directly with the Model Context Protocol (MCP) and the Google Antigravity SDK (antigravity_agent_hub.dart & antigravity_orchestrator.py).

A. Neon MCP Server (neon_mcp_server.dart)

NeonMcpServer exposes four core tools over JSON-RPC / MCP so AI agents can inspect, compile, migrate, and package Neon apps autonomously:

| MCP Tool Name | Description | | :--- | :--- | | neon_compile_file | Compiles a .neon source file into optimized .dart code and returns AST diagnostics and source maps. | | neon_build_package | Invokes NeonCrossOsBuilder to package and sign .apk, .aab/.bundle, .app, or .ipa archives on Windows, macOS, or Linux Ubuntu. | | neon_update_feature_options | Dynamically toggles runtime NeonFeatureOptions (diffing, navigation, rendering, diagnostics) on the active server. | | neon_transpile_flutter_to_neon | Runs the AST converter to migrate Flutter .dart widgets into Neon Framework code. |

B. Multi-Model Backend Support

In the Google Antigravity Multi-Agent Dock (right pane of Neon Studio IDE), you can switch seamlessly between cloud and 100% local offline model backends:

  1. Gemini Cloud (LocalAgentConfig): High-reasoning cloud orchestration powered by Gemini models.
  2. On-Device Gemma 4 26B (LiteRTAgentConfig): Runs locally on-device via LiteRT with zero cloud latency or API cost.
  3. Local Ollama / LM Studio (LocalOpenAIAgentConfig): Connects to any local OpenAI-compatible inference server.

C. Specialist Subagents

Click 🚀 Dispatch Antigravity Subagent to delegate tasks to any of the four built-in specialist subagents:

  • neon_ui_architect: Designs and writes declarative .neon components from natural language prompts, validating them against the compiler and previewing them in the Dual-OS Canvas.
  • neon_bridge_doctor: Inspects RFC-6902 patch streams and widget keys to eliminate unnecessary full-tree fallbacks and optimize bridge performance.
  • neon_flutter_migrator: Automates Flutter-to-Neon AST transpilation, resolving imports, widget mappings, and key assignments.
  • neon_release_packager: Orchestrates cross-OS .apk, .aab, .app, and .ipa builds, verifying CodeResources SHA-256 sealing and signing manifests.

5. Verification & Test Suite

All language, compiler, LSP, MCP, cross-OS builder, and IDE workbench modules are verified by test/neon_language_ide_test.dart — with all 427/427 framework tests passing.