Cómo Construir un Asistente IA Conversacional para Gestión de Proyectos
Share
Cómo Construir un Asistente IA Conversacional para Gestión de Proyectos
Introducción
Imagina poder gestionar tus proyectos simplemente hablando con tu navegador. En lugar de navegar por múltiples menús y formularios, escribes "Crea una tarea urgente para revisar el diseño" y automáticamente se crea en tu sistema de gestión de proyectos. Este tipo de experiencia no es ciencia ficción: es completamente posible con las herramientas actuales.
En este artículo, exploraremos la arquitectura y componentes de un asistente IA conversacional que se inyecta automáticamente en aplicaciones web existentes, permitiendo controlarlas mediante lenguaje natural. Veremos cómo combinar modelos de lenguaje avanzados, APIs REST y técnicas de inyección web para crear una experiencia fluida y productiva.
Arquitectura del Sistema
La solución se compone de tres capas principales que trabajan en conjunto:
1. Frontend: Widget Flotante Inteligente
El frontend es un widget de chat que flota sobre la aplicación web existente. Sus características principales incluyen:
- Botón de acción flotante (FAB) posicionado en la esquina inferior derecha
- Panel de chat expandible con historial persistente
- Memoria local que preserva hasta 50 mensajes en localStorage
- Comandos especiales como `/clear`, `/status` para control del sistema
- Diseño adaptativo que puede expandirse de 380px a 700px
El widget utiliza una paleta de colores oscura (`#0f172a`) con gradientes vibrantes (`#667eea` a `#764ba2`) que lo hacen visualmente atractivo sin interferir con la aplicación subyacente.
// Ejemplo de persistencia de historial
localStorage.setItem('lordoflight_history', JSON.stringify(messages));
// Restauración al cargar
const history = JSON.parse(localStorage.getItem('lordoflight_history') || '[]');
2. Backend: Orquestador Flask con IA
El cerebro del sistema es una API Flask que actúa como puente entre el usuario y el sistema de gestión de proyectos:
GEMINI_MODEL = "gemini-2.5-flash"
OP_BASE = "https://pm.example.com/api/v3"
OP_PROJECT_ID = 4
El flujo de procesamiento es:
- Recibe el mensaje del usuario junto con el historial de conversación
- Envía el contexto a Gemini 2.5 Flash con capacidades de búsqueda y razonamiento
- El modelo genera un JSON estructurado con las acciones a ejecutar
- El backend ejecuta esas acciones contra la API del sistema de gestión
- Devuelve la respuesta al usuario
Este diseño permite que el modelo de IA decida qué acciones son necesarias basándose en el contexto de la conversación, sin requerir comandos rígidos del usuario.
3. Inyección Automatizada con Nginx
La magia que hace que el widget aparezca automáticamente en todas las páginas ocurre a nivel de servidor web usando `sub_filter` de Nginx:
sub_filter '