ADK Studio

Visual development environment for building AI agents with drag-and-drop.

Overview

ADK Studio provides a low-code interface for designing, testing, and deploying AI agents built with ADK-Rust. Create complex multi-agent workflows visually, then compile them to production Rust code.

Installation

# Install from crates.io (self-contained binary)
cargo install adk-studio

# Or build from source
cargo build --release -p adk-studio

Quick Start

# Start the studio server
adk-studio

# Open in browser
open http://localhost:3000

CLI Options

# Bind to all interfaces for remote access
adk-studio --host 0.0.0.0 --port 8080

# Custom projects directory
adk-studio --dir ./my-projects

---

Step-by-Step Tutorial

Follow this walkthrough to build your first AI agent in ADK Studio.

Step 1: Create a New Project

Click the + New Project button in the top-right corner.

Enter a name for your project (e.g., "Demo Project") and click Create.

Step 2: Add an Agent to the Canvas

The left sidebar contains the Agent Palette with available agent types:

• LLM Agent - Single AI agent powered by a language model
• Sequential - Execute sub-agents in order
• Parallel - Execute sub-agents concurrently
• Loop - Iterate until exit condition
• Router - Route to sub-agents based on input

Click on LLM Agent to add it to the canvas.

Step 3: Configure the Agent

When you select an agent, the Properties Panel appears on the right side. Here you can configure:

• Name - Identifier for the agent
• Model - LLM provider and model (Gemini, OpenAI, etc.)
• Instructions - System prompt for the agent

Step 4: Add Tools to the Agent

Scroll down in the left sidebar to find the Tool Palette:

• Function - Custom Rust function with code editor
• MCP - Model Context Protocol server
• Browser - 46 WebDriver automation actions
• Google Search - Grounded web search
• Load Artifact - Load files into context

Click on a tool to add it to your agent.

Step 5: Build and Test

Click Build Project to compile your agent. Once built, use the Chat Panel at the bottom to test your agent with real conversations.

The chat supports:

• Live SSE streaming responses
• Agent execution animations
• Event trace panel for debugging

Step 6: View Generated Code

Click View Code to see the production-ready Rust code generated from your visual design.

You can copy this code or use Compile to generate a complete Rust project.

---

Features

Agent Types

Tool Types

Real-Time Chat

Test agents directly in the studio:

• Live SSE streaming responses
• Agent execution animations
• Event trace panel for debugging
• Session memory persistence

Code Generation

Convert visual designs to production code:

1. View Code - Preview generated Rust with syntax highlighting
2. Compile - Generate complete Rust project
3. Build - Compile to executable with real-time output
4. Run - Execute the built agent

Architecture

┌─────────────────────────────────────────────────────────────┐
│                     ADK Studio UI                           │
│  ┌─────────────┐  ┌─────────────┐  ┌─────────────────────┐ │
│  │   Palette   │  │   Canvas    │  │   Properties        │ │
│  │  - Agents   │  │  ReactFlow  │  │  - Name             │ │
│  │  - Tools    │  │  Workflow   │  │  - Model            │ │
│  │             │  │  Designer   │  │  - Instructions     │ │
│  └─────────────┘  └─────────────┘  └─────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼ HTTP/SSE
┌─────────────────────────────────────────────────────────────┐
│                    ADK Studio Server                        │
│  ┌─────────────┐  ┌─────────────┐  ┌─────────────────────┐ │
│  │   Routes    │  │   Codegen   │  │   Storage           │ │
│  │  /api/*     │  │  Rust code  │  │  Projects           │ │
│  │  /chat      │  │  generation │  │  File-based         │ │
│  └─────────────┘  └─────────────┘  └─────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼ Build
┌─────────────────────────────────────────────────────────────┐
│                   Generated Rust Project                    │
│  ┌─────────────────────────────────────────────────────┐   │
│  │  Cargo.toml + src/main.rs                           │   │
│  │  Uses: adk-rust, adk-agent, adk-model, etc.        │   │
│  └─────────────────────────────────────────────────────┘   │
└─────────────────────────────────────────────────────────────┘

API Endpoints

Projects

Code Generation

Chat

Environment Variables

Generated Code Structure

my-project/
├── Cargo.toml
└── src/
    └── main.rs

Example generated main.rs:

use adk_rust::prelude::*;
use adk_rust::Launcher;

#[tokio::main]
async fn main() -> Result<(), Box<dyn std::error::Error>> {
    dotenvy::dotenv().ok();
    let api_key = std::env::var("GOOGLE_API_KEY")?;
    let model = GeminiModel::new(&api_key, "gemini-2.0-flash")?;

    let agent = LlmAgentBuilder::new("assistant")
        .description("Helpful AI assistant")
        .instruction("You are a helpful assistant.")
        .model(Arc::new(model))
        .build()?;

    Launcher::new(Arc::new(agent)).run().await?;
    Ok(())
}

Templates

Studio includes pre-built templates:

• Basic Assistant - Simple LLM agent
• Research Agent - Agent with Google Search
• Support Router - Multi-agent routing
• Code Assistant - Agent with code tools

Best Practices

---

Previous: ← Memory | Next: Development Guidelines →