Navegación por la Interfaz del Editor

El lienzo es tu principal espacio de trabajo en NappAI. Desde aquí puedes añadir componentes, probar tus automatizaciones y gestionar tus proyectos. Esta guía detalla cada uno de los elementos de la interfaz.

La Barra de Herramientas Principal

Esta barra vertical a la derecha contiene las acciones clave para la gestión y prueba de tu proyecto.

Añadir Componente (+)

• Abre el panel de componentes para que puedas buscar y arrastrar nuevos componentes a tu proyecto.

Despliegue y Consumo (Icono de Cohete)

Este botón es el portal para llevar tu proyecto a producción. Se divide en dos funcionalidades distintas. Antes de que un proyecto pueda ser consumido externamente, debes crear una “versión” oficial del mismo.

• Paso 1: Desplegar una Versión Esta opción te permite crear una “versión” estable y publicada de tu proyecto. Es como guardar una fotografía de tu flujo que podrá ser utilizada desde fuera de NappAI.

  • Si no tienes ninguna versión previa creada, NappAI te pedirá que introduzcas los datos para tu primera versión desplegada.
  • Si ya existen versiones, podrás seleccionarlas del listado para gestionarlas.

  

  Para crear una versión, debes configurar:

  • Selecciona la versión a desplegar: Por defecto, será la versión activa de # Desarrollo.
  • Versión: Dale un nombre único y descriptivo a esta versión (ej: v1.0.0, Produccion-Inicial). Este nombre te ayudará a identificarla más tarde.
  • Descripción: Añade una descripción opcional para recordar qué cambios o características incluye esta versión.

  Una vez que haces clic en el botón Desplegar, esa versión queda “publicada” y lista para ser consumida.

• Paso 2: Consumir la Versión (Acceso por API) Esta opción te proporciona el código necesario para ejecutar tu versión desplegada desde una aplicación externa.

  

  Para generar el código, debes seleccionar:

  • Clave API: Elige una Clave API que hayas creado previamente. Esta clave es la que autoriza a tu aplicación externa a ejecutar el flujo. Puedes gestionar tus claves en el Panel de Navegación.
  • Versión Desplegada: Selecciona la versión que acabas de crear (ej: v1.0.0). Es crucial seleccionar una versión desplegada para habilitar el consumo.

  Una vez seleccionadas la clave y la versión, NappAI generará automáticamente fragmentos de código en varios lenguajes (cURL, Python, JavaScript, etc.) que puedes copiar y pegar directamente en tu aplicación para ejecutar este flujo de forma remota.

Entorno de Pruebas (Icono de Insecto)

• Abre el Playground, la interfaz interactiva para probar tu flujo en tiempo real sin tener que desplegarlo. El panel de la izquierda se divide en 2 opciones:
  • Ejecuciones: Esta es la pestaña más importante para depurar. Cada vez que envías un mensaje en el chat, aquí aparece un registro detallado de cómo se ejecutó el flujo, componente por componente.
    • Visión Paso a Paso: Podrás hacer clic en cada componente de tu flujo (como Chat Input, Agent, Gemini) y ver exactamente los datos de entrada que recibió y los datos de salida que generó.
    • Identificación de Errores: Si algo falla, aquí es donde verás qué componente dio el error y por qué, facilitando enormemente la corrección.
  • Memorias: Esta pestaña gestiona el historial de la conversación. Cuando construyes flujos conversacionales, es crucial que el agente recuerde interacciones pasadas para mantener el contexto.
    • Historial de Conversación: Aquí puedes ver y gestionar la memoria a corto y largo plazo que el agente está utilizando. Esto es fundamental para construir chatbots coherentes y avanzados.

Historial de Versiones

• Propósito: Este panel es tu “máquina del tiempo”. Te permite gestionar, visualizar y restaurar diferentes estados de tu proyecto a lo largo de su desarrollo. Es fundamental para mantener un control de cambios y para diferenciar entre tu trabajo en progreso y las versiones estables.

• Componentes del Historial:

  • Versión de Desarrollo: Esta es siempre la primera en la lista. Representa el estado actual de tu lienzo. Todos los cambios que haces en tiempo real se guardan automáticamente aquí. Esta versión no se puede desplegar directamente; es tu borrador o “sandbox”.
  • Versiones Creadas (ej: 0.1, 0.2): Son “fotografías” o puntos de guardado manuales que has creado. Cada una representa un estado específico de tu proyecto en un momento dado.
  • Icono de Cohete (🚀): Este icono aparece junto a una versión para indicar que ha sido desplegada. Esto significa que es una versión estable que puede ser consumida a través de la API. Como se ve en la imagen, la versión 0.1 está desplegada, mientras que la 0.2 no lo está.

• Acciones Disponibles: Al seleccionar una versión creada (como la 0.2 en la imagen), aparecen dos opciones principales:

  • Restaurar: Esta acción reemplaza tu lienzo de Desarrollo actual con el contenido de la versión que has seleccionado. Es extremadamente útil si quieres volver a un estado anterior de tu proyecto.
  • Eliminar: Esta acción borra permanentemente una versión guardada. Importante: No puedes eliminar una versión que está actualmente desplegada (la que tiene el icono del cohete). Primero tendrías que desplegar una nueva versión para “liberar” la antigua.

Registros / Ejecuciones

• Propósito: Este panel es tu bitácora de vuelo. Muestra un historial detallado de todas las veces que tu proyecto se ha ejecutado fuera del Entorno de Pruebas (por ejemplo, a través de una llamada API o una tarea programada). Es tu principal herramienta para monitorear y depurar tus flujos en producción.

  

• Cómo Leer la Lista de Ejecuciones:

  • Cada entrada en la lista representa una ejecución única de tu proyecto, ordenada cronológicamente.
  • Código de Colores: La lista utiliza un sistema de colores intuitivo para que puedas ver el estado de cada ejecución de un vistazo:
    • Verde: La ejecución se completó con éxito, sin errores en ninguno de los componentes.
    • Rojo: La ejecución se detuvo debido a un error en uno de los componentes.

• Inspeccionar una Ejecución (Vista Detallada):

  • Al hacer clic en una ejecución específica de la lista, se abre una vista de depuración detallada. Esta vista es fundamental para entender exactamente qué sucedió durante la ejecución.
  • Visualización Paso a Paso: Podrás ver una traza de la ejecución componente por componente. Al seleccionar un componente en el panel de la izquierda (como OpenAI en la imagen), el panel principal te mostrará los datos exactos de Entrada (Input) que recibió y los datos de Salida (Output) que generó.

  

  Esta capacidad de inspección es invaluable para depurar errores, entender por qué tu flujo tomó una decisión particular o verificar los datos que se están procesando en cada etapa.

Ayuda (Icono de Bombilla)

• Abre un panel de ayuda contextual con guías y tutoriales rápidos sobre cómo usar la interfaz.

Controles del Lienzo

Esta barra de herramientas en la parte inferior izquierda te permite controlar la vista de tu lienzo de flujo.

• + / -: Aumenta o disminuye el zoom del lienzo.
• Centrar Vista (Icono de expandir): Ajusta automáticamente el zoom y la posición para que todo tu flujo sea visible en la pantalla.
• Bloquear Flujo (Icono de candado): Bloquea la edición del flujo. No podrás mover ni eliminar componentes, pero sí podrás ejecutarlo en el Entorno de Pruebas.
• Auto-organizar (Icono de flechas): Reorganiza automáticamente tus componentes en el lienzo para que sigan una disposición lineal y ordenada.
• Disposición de Cuadrícula (Icono de cuadrados): Alterna entre dos modos de posicionamiento en el lienzo.
  • Modo Grid (Activado): Fuerza a los componentes a alinearse en una cuadrícula predefinida.
  • Modo Auto (Desactivado): Te permite mover y posicionar los componentes con total libertad.
• Añadir Nota (Icono de hoja): Te permite añadir notas de texto adhesivas directamente en el lienzo para documentar partes de tu flujo.