ADK Studio

Entorno de desarrollo visual para construir AI Agent con arrastrar y soltar.

Resumen

ADK Studio proporciona una interfaz de bajo código para diseñar, probar y desplegar AI Agent construidos con ADK-Rust. Cree flujos de trabajo multi-Agent complejos visualmente, luego compílelos a código Rust de producción.

Instalación

# Instalar desde crates.io (binario auto-contenido)
cargo install adk-studio

# O construir desde el código fuente
cargo build --release -p adk-studio

Inicio rápido

# Iniciar el servidor de estudio
adk-studio

# Abrir en el navegador
open http://localhost:3000

Opciones de CLI

# Enlazar a todas las interfaces para acceso remoto
adk-studio --host 0.0.0.0 --port 8080

# Directorio de proyectos personalizado
adk-studio --dir ./my-projects

---

Tutorial paso a paso

Siga este tutorial para construir su primer AI Agent en ADK Studio.

Paso 1: Crear un nuevo proyecto

Haga clic en el botón + Nuevo proyecto en la esquina superior derecha.

Introduzca un nombre para su proyecto (ej., "Proyecto de demostración") y haga clic en Crear.

Paso 2: Añadir un Agent al lienzo

La barra lateral izquierda contiene la Paleta de Agent con los tipos de Agent disponibles:

• LLM Agent - AI Agent único impulsado por un modelo de lenguaje
• Sequential - Ejecutar sub-Agent en orden
• Parallel - Ejecutar sub-Agent concurrentemente
• Loop - Iterar hasta la condición de salida
• Router - Enrutar a sub-Agent basándose en la entrada

Haga clic en LLM Agent para añadirlo al lienzo.

Paso 3: Configurar el Agent

Cuando selecciona un Agent, el Panel de propiedades aparece en el lado derecho. Aquí puede configurar:

• Name - Identificador para el Agent
• Model - Proveedor y modelo de LLM (Gemini, OpenAI, etc.)
• Instructions - Mensaje de sistema para el Agent

Paso 4: Añadir Tool al Agent

Desplácese hacia abajo en la barra lateral izquierda para encontrar la Paleta de Tool:

• Function - Función Rust personalizada con editor de código
• MCP - Servidor de Model Context Protocol
• Browser - 46 acciones de automatización de WebDriver
• Google Search - Búsqueda web con fundamento
• Load Artifact - Cargar archivos en el contexto

Haga clic en un Tool para añadirlo a su Agent.

Paso 5: Construir y probar

Haga clic en Construir proyecto para compilar su Agent. Una vez construido, use el Panel de chat en la parte inferior para probar su Agent con conversaciones reales.

El chat soporta:

• Respuestas de streaming SSE en vivo
• Animaciones de ejecución de Agent
• Panel de rastreo de eventos para depuración

Paso 6: Ver código generado

Haga clic en Ver código para ver el código Rust listo para producción generado a partir de su diseño visual.

Puede copiar este código o usar Compilar para generar un proyecto Rust completo.

---

Características

Tipos de Agent

Tipos de Tool

Chat en Tiempo Real

Prueba los agents directamente en el estudio:

• Respuestas de streaming SSE en vivo
• Animaciones de ejecución de Agent
• Panel de seguimiento de eventos para depuración
• Persistencia de la memoria de Session

Generación de Código

Convierte diseños visuales en código de producción:

1. Ver Código - Previsualiza el Rust generado con resaltado de sintaxis
2. Compilar - Genera un proyecto Rust completo
3. Construir - Compila a ejecutable con salida en tiempo real
4. Ejecutar - Ejecuta el agent construido

Arquitectura

┌─────────────────────────────────────────────────────────────┐
│                     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.        │   │
│  └─────────────────────────────────────────────────────┘   │
└─────────────────────────────────────────────────────────────┘

Puntos de Conexión de la API

Proyectos

Generación de Código

Chat

Variables de Entorno

Estructura del Código Generado

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

Ejemplo de main.rs generado:

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(())
}

Plantillas

Studio incluye plantillas predefinidas:

• Asistente Básico - Agente LLM simple
• Agente de Investigación - Agente con búsqueda de Google
• Enrutador de Soporte - Enrutamiento multi-agente
• Asistente de Código - Agente con herramientas de código

Mejores Prácticas

---

Anterior: ← Memory | Siguiente: Development Guidelines →