ADK Studio

Visuelle Entwicklungsumgebung zum Erstellen von KI-Agenten per Drag-and-drop.

Übersicht

ADK Studio bietet eine Low-Code-Oberfläche zum Entwerfen, Testen und Bereitstellen von KI-Agenten, die mit ADK-Rust erstellt wurden. Erstellen Sie komplexe Multi-Agenten-Workflows visuell und kompilieren Sie sie anschließend in produktionsreifen Rust-Code.

Installation

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

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

Schnellstart

# Start the studio server
adk-studio

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

CLI-Optionen

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

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

---

Schritt-für-Schritt-Tutorial

Folgen Sie dieser Anleitung, um Ihren ersten KI-Agenten in ADK Studio zu erstellen.

Schritt 1: Neues Projekt erstellen

Klicken Sie oben rechts auf die Schaltfläche + Neues Projekt.

Geben Sie einen Namen für Ihr Projekt ein (z. B. „Demo-Projekt“) und klicken Sie auf Erstellen.

Schritt 2: Einen Agenten zur Arbeitsfläche hinzufügen

Die linke Seitenleiste enthält die Agentenpalette mit den verfügbaren Agententypen:

• LLM Agent – Einzelner KI-Agent, der von einem Sprachmodell unterstützt wird
• Sequenziell – Unteragenten der Reihe nach ausführen
• Parallel – Unteragenten gleichzeitig ausführen
• Schleife – Bis zur Beendigungsbedingung iterieren
• Router – Anhand der Eingabe an Unteragenten weiterleiten

Unterhalb der Agentenpalette bietet die Aktionsknotenpalette 14 nicht auf LLM basierende programmgesteuerte Knoten für deterministische Vorgänge (HTTP-Anfragen, Datenbankabfragen, Verzweigungen, Schleifen usw.). Weitere Informationen finden Sie im Leitfaden zu Aktionsknoten.

Klicken Sie auf LLM Agent, um ihn zur Arbeitsfläche hinzuzufügen.

Schritt 3: Den Agenten konfigurieren

Wenn Sie einen Agenten auswählen, wird auf der rechten Seite das Eigenschaftenfenster angezeigt. Hier können Sie Folgendes konfigurieren:

• Name – Bezeichner für den Agenten
• Modell – LLM-Anbieter und -Modell (Gemini, OpenAI usw.)
• Anweisungen – System-Prompt für den Agenten

Schritt 4: Tools zum Agenten hinzufügen

Scrollen Sie in der linken Seitenleiste nach unten, um die Tool-Palette zu finden:

• Funktion – Benutzerdefinierte Rust-Funktion mit Code-Editor
• MCP – Model Context Protocol-Server
• Browser – 46 WebDriver-Automatisierungsaktionen
• Google Search – Fundierte Websuche
• Artefakt laden – Dateien in den Kontext laden

Klicken Sie auf ein Tool, um es zu Ihrem Agenten hinzuzufügen.

Schritt 5: Erstellen und testen

Klicken Sie auf Projekt erstellen, um Ihren Agenten zu kompilieren. Nach der Erstellung können Sie das Chat-Panel unten verwenden, um Ihren Agenten mit echten Gesprächen zu testen.

Der Chat unterstützt:

• Live-Streaming-Antworten von SSE
• Animationen bei der Agentenausführung
• Ereignisverfolgungs-Panel zur Fehlerbehebung

Schritt 6: Generierten Code anzeigen

Klicken Sie auf Code anzeigen, um den produktionsbereiten Rust-Code zu sehen, der aus Ihrem visuellen Entwurf generiert wurde.

Sie können diesen Code kopieren oder Kompilieren verwenden, um ein vollständiges Rust-Projekt zu generieren.

---

Funktionen

Agententypen

Aktionsknoten

14 nicht-LLM-programmatische Knoten für deterministische Workflow-Operationen. Ausführliche Informationen finden Sie im Leitfaden zu Aktionsknoten.

Auslöser

Workflows beginnen mit einem Trigger-Knoten. Ausführliche Informationen finden Sie im Leitfaden zu Auslösern.

Tool-Typen

Echtzeit-Chat

Testen Sie Agents direkt im Studio:

• Live-Streaming-Antworten von SSE
• Animationen der Agent-Ausführung
• Ereignisverfolgungsbereich zum Debuggen
• Persistenz des Sitzungs-Speichers

Codegenerierung

Visuelle Entwürfe in produktionsreifen Code umwandeln:

1. Code anzeigen – Generierten Rust-Code mit Syntaxhervorhebung in der Vorschau anzeigen
2. Kompilieren – Vollständiges Rust-Projekt generieren
3. Erstellen – In eine ausführbare Datei kompilieren und die Ausgabe in Echtzeit anzeigen
4. Ausführen – Den erstellten Agent ausführen

Die Schaltfläche „Erstellen“ wird automatisch angezeigt, wenn sich Ihr Workflow seit dem letzten Erstellen geändert hat.

Codegenerierung für Aktionsknoten

Aktionsknoten werden zusammen mit LLM-Agents in produktionsreifen Rust-Code kompiliert. Abhängigkeiten werden automatisch erkannt und dem generierten Cargo.toml hinzugefügt.

Alle Aktionsknoten unterstützen die Interpolation von {{variable}} und erhalten automatisch die Ausgaben der Vorgängerknoten.

Unterstützte Datenbanken

Architektur

┌─────────────────────────────────────────────────────────────┐
│                     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 Endpunkte

Projekte

Codegenerierung

Chat

Auslöser

Umgebungsvariablen

Hinweis: Sie benötigen nur den API-Schlüssel für die Provider, die Ihre Agents verwenden. ADK Studio erkennt den Provider automatisch anhand des Modellnamens und generiert den korrekten Code.

Struktur des generierten Codes

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

Der generierte Code passt sich an die in Ihrem Projekt verwendeten Provider an. ADK Studio erkennt den Provider anhand des Modellnamens jedes Agents und generiert die korrekten Imports, die API-Schlüsselauflösung und die Modellkonstruktoren.

Beispiel für generierten main.rs-Code (Gemini):

use adk_model::gemini::GeminiModel;
// ...

let gemini_api_key = std::env::var("GOOGLE_API_KEY")
    .or_else(|_| std::env::var("GEMINI_API_KEY"))
    .expect("GOOGLE_API_KEY or GEMINI_API_KEY must be set");

let model = Arc::new(GeminiModel::new(&gemini_api_key, "gemini-3.7-flash")?);

Beispiel mit OpenAI:

use adk_model::openai::{OpenAIClient, OpenAIConfig};
// ...

let openai_api_key = std::env::var("OPENAI_API_KEY")
    .expect("OPENAI_API_KEY must be set");

let model = Arc::new(OpenAIClient::new(OpenAIConfig::new(&openai_api_key, "gpt-5.6-terra"))?);

Beispiel mit Ollama (lokal, ohne API-Schlüssel):

use adk_model::ollama::{OllamaModel, OllamaConfig};
// ...

let model = Arc::new(OllamaModel::new(OllamaConfig::new("llama3.2"))?);

Der generierte Cargo.toml enthält automatisch die korrekten adk-model-Feature-Flags:

# Only Gemini
adk-model = { version = "2.1.0", default-features = false, features = ["gemini"] }

# Mixed providers (e.g., Gemini + Anthropic)
adk-model = { version = "2.1.0", default-features = false, features = ["gemini", "anthropic"] }

# Ollama only (no API key needed)
adk-model = { version = "2.1.0", default-features = false, features = ["ollama"] }

Generierter Code mit Aktionsknoten

Wenn Ihr Workflow Aktionsknoten enthält, verwendet der generierte Code adk-graph für die Workflow-Orchestrierung mit FunctionNode-Closures:

use adk_graph::prelude::*;

// HTTP action node → reqwest call
let http_node = FunctionNode::new("fetch_data", |ctx| async move {
    let client = reqwest::Client::new();
    let resp = client.get("https://api.example.com/data")
        .bearer_auth(&ctx.get("API_TOKEN").unwrap_or_default())
        .send().await
        .map_err(|e| GraphError::NodeExecutionFailed {
            node: "fetch_data".into(),
            message: e.to_string(),
        })?;
    let body: serde_json::Value = resp.json().await?;
    Ok(NodeOutput::new().with_update("apiData", body))
});

// Code action node → boa_engine JS execution
let code_node = FunctionNode::new("process", |ctx| async move {
    let mut js_ctx = boa_engine::Context::default();
    // Graph state injected as global `input` object
    // User code executed in thread-isolated sandbox
    Ok(NodeOutput::new().with_update("result", output))
});

Automatisch erkannte Abhängigkeiten werden zum generierten Cargo.toml hinzugefügt (reqwest, sqlx, mongodb, redis, lettre, imap, boa_engine).

Vorlagen

Studio enthält vorgefertigte Vorlagen:

• Einfacher Assistent – Einfacher LLM-Agent
• Recherche-Agent – Agent mit Google Search
• Support-Router – Multi-Agent-Routing
• Code-Assistent – Agent mit Code-Tools

Teamzusammenarbeit: Repository-lokale Projekte

Standardmäßig speichert ADK Studio Projekte in einem benutzerlokalen Verzeichnis (~/.local/share/adk-studio/projects unter Linux, ~/Library/Application Support/adk-studio/projects unter macOS). Dies funktioniert gut für die individuelle Nutzung, aber Teams, die Studio-Projekte zusammen mit ihrem Quellcode versionieren und teilen möchten, können stattdessen ein repository-lokales Projektverzeichnis verwenden.

Empfohlene Konvention

Speichern Sie Projekte im .adk-studio/projects-Verzeichnis im Stammverzeichnis Ihres Repositorys:

my-repo/
├── .adk-studio/
│   └── projects/       # Studio project JSON files
├── src/
├── Cargo.toml
└── .gitignore

Starten Sie Studio mit dem repository-lokalen Verzeichnis:

adk-studio --dir ./.adk-studio/projects

Hinweise zu .gitignore

Entscheide anhand deines Workflows, was du committen möchtest:

# Option A: Version-control project definitions, ignore build artifacts
.adk-studio/projects/*/build/
.adk-studio/projects/*/target/

# Option B: Ignore all Studio data (treat as local-only)
.adk-studio/

Option A wird für Teams empfohlen — damit könnt ihr Agent-Entwürfe teilen und gleichzeitig verhindern, dass kompilierte Ausgaben in die Versionsverwaltung gelangen.

Tipps

• Jedes Teammitglied startet Studio mit demselben Flag --dir, um an gemeinsam genutzten Projekten zu arbeiten.
• Projektdateien JSON sind die maßgebliche Quelle; generierter Rust-Code kann daraus erneut generiert werden.
• Der benutzerlokale Standardpfad bleibt unverändert — wenn --dir weggelassen wird, wird weiterhin der Systemstandard verwendet.

Bewährte Vorgehensweisen

---

Vorherige: ← Memory | Nächste: Action Nodes →