Perplexity
Utilicé Perplexity para investigar y sintetizar información sobre flujos de trabajo y necesidades de usuarios en entornos de IA, identificando puntos de dolor y mapeando requisitos para fundamentar decisiones de diseño.
Caso de Estudio: All Hub Context - De la Intención al Entregable Profesional
Este caso de estudio detalla el diseño y la validación de All Hub Context, un sistema multiagente conversacional creado para cerrar la brecha entre la intención de un usuario y la creación de entregables profesionales (como PRDs o documentos de arquitectura).
A través de un proceso de co-creación guiado, un agente orquestrador coordina especialistas de IA en un lienzo interactivo, aplicando principios de gobernanza como transparencia, control y ética.
El resultado es un prototipo funcional de alta fidelidad (AI Spike) que demuestra cómo una experiencia colaborativa e intuitiva puede simplificar procesos complejos sin sacrificar calidad ni confianza.
No es un MVP, sino un prototipo funcional de alta fidelidad (AI Spike) para validar la experiencia de usuario propuesta.
El problema: La brecha entre la intención del usuario y el entregable
Cualquier persona que necesite crear entregables con la ayuda de la IA, no solo lucha con la "amnesia" de los LLMs. El verdadero desafío es el abismo que existe entre una intención de alto nivel ("necesito la arquitectura para una nueva app") y un entregable o artefacto final, estructurado y profesional.
El proceso actual es un diálogo desestructurado con LLMs genéricos, que produce resultados inconsistentes y requiere una enorme cantidad de refactorización y edición manual.
El problema fundamental no es la falta de capacidad generativa, sino la ausencia de un proceso de co-creación guiado por agentes especializados que entienda la estructura de los entregables profesionales y pueda colaborar con el usuario para construirlos.
```
El problema: Una brecha entre la intención del usuario y el entregable final.
ABISMO
Intención del Usuario
"Necesito la arquitectura para una nueva app"
Entregable Final
Documento de arquitectura completo y estructurado
01
Mi proceso y rol como diseñador de sistemas de IA
Mi rol fue diseñar un sistema multi-agente que cerrara la brecha entre la intención del usuario y el entregable. La visión pivotó de una simple "herramienta de prompting" a un "equipo de agentes especializados de IA bajo demanda", donde la conversación es el método de colaboración y el lienzo es la pizarra compartida.
Herramientas Tecnológicas
A continuación, detallo las herramientas tecnológicas que utilicé para desarrollar el prototipo funcional o Spike de IA del proyecto All Hub Context, enfocado en resolver problemas complejos en flujos de nodos con un enfoque centrado en el usuario.
Gemini Deep Research
Aproveché Gemini Deep Research en Google AI Studio para analizar documentos extensos y definir la arquitectura del sistema multi-agente, validando conceptos complejos para una experiencia de usuario robusta.
Google AI Studio
Empleé Google AI Studio para metaprompting, diseño de la estructura del proyecto, revisión y corrección de código, y prototipado rápido de interacciones conversacionales, optimizando la experiencia de usuario.
Mermaid
Usé Mermaid para crear diagramas dinámicos que visualizaban la arquitectura del sistema y los flujos de interacción, facilitando la comunicación de conceptos y la validación de la lógica del diseño.
Dialogflow CX
Diseñé y prototipé flujos conversacionales multi-turno con Dialogflow CX, asegurando interacciones naturales y efectivas entre usuarios y agentes de IA en la pizarra compartida.
Google Firebase Studio
Implementé el frontend y backend del prototipo AI Spike con Firebase Studio, integrando interacciones conversacionales y datos de IA en un lienzo interactivo para validar la experiencia de usuario.
Estas herramientas me permitieron diseñar un sistema innovador, alineado con las necesidades del usuario, y validar un prototipo funcional de alta fidelidad que demostró una experiencia de usuario colaborativa y efectiva.
1.1 Investigación de usuarios: Mapeando la fricción de los usuarios en la creación de entregables
El proceso comenzó con una investigación etnográfica digital para cuantificar y cualificar la "Crisis del Contexto".
1.1.1 Principales 25 "puntos de dolor" que relatan los usuarios que necesitan crear entregables con la ayuda de la IA
1.1.2 Análisis de los 25 principales puntos de dolor: el 20% de la causa genera el 80% de la frustración
Se analizó una muestra de >100 discusiones en foros como Reddit (r/LLMDevs) y se tabularon los 25 principales pain points. El análisis reveló que la gestión manual del contexto (#1, #2, #5, #23) era el 20% de la causa que generaba el 80% de la frustración (Principio de Pareto).
Causa: 20%
Gestión manual del contexto
Pérdida de foco, trabajo repetitivo, errores.
Efecto: 80%
Frustración del Usuario
Baja calidad, abandono, desconfianza en la IA.
1.2 Investigación de usuarios: Mapeando la crisis del contexto
Realicé una investigación etnográfica digital, analizando >100 discusiones en foros como Reddit (r/LLMDevs) y entrevistas con usuarios, para identificar los principales puntos de dolor al crear entregables con IA.
Puntos de dolor clave (agrupados):
Gestión de Contexto
Pérdida de información crítica, trabajo repetitivo para mantener el contexto.
Calidad del Entregable
Resultados inconsistentes, alucinaciones del modelo.
Flujo de Trabajo
Diálogos desestructurados, falta de herramientas colaborativas.
Limitaciones Técnicas
Límites de tokens, falta de control de versiones.
Mapa de empatía (perfil arquetípico):
Lucha con la memoria
Creadora de contenido
Dice
"Paso más tiempo preparando prompts que resolviendo problemas."
Piensa
"¿Por qué la IA no recuerda lo que le dije?"
Siente
"Frustración, agotamiento."
Hace
"Reescribe prompts repetidamente."
Recorta por límites
Desarrollador
Dice
"Recortar logs por límites de tokens arruina mi análisis."
Piensa
"Necesito una herramienta que gestione mejor el contexto."
Siente
"Impotencia, desconfianza."
Hace
"Edita manualmente datos."
1.3 Mapa de experiencia del usuario: De la idea al entregable
Se mapeó el viaje del usuario para identificar las zonas de máxima fricción emocional y operativa.
Ideación
Herramientas básicas, motivación alta
Investigación
Múltiples fuentes de datos
Síntesis
Emergen problemas y complejidad
Edición
Dificultad para elabórar documentación
Finalización
Documento revisado, confianza alta
Experiencia positiva
Experiencia negativa
Zona de fricción
Curva emocional
02
La pregunta correcta (aplicando la Navaja de Ockham)
Al reformular la pregunta con la Navaja de Ockham, pasamos de "mejorar un LLM" (enfoque técnico, abstracto) a "diseñar un diálogo de co-creación" (experiencia concreta, centrada en el usuario).
Esto evita sesgo de solución prematura y guía al equipo UX hacia un diseño que aprovecha la IA para ayudar activamente al usuario, no para impresionarlo con tecnología.
Pregunta incorrecta
¿Cómo podemos hacer un LLM que entienda mejor nuestras plantillas de documentos?
Pregunta correcta
En lugar de mejorar un LLM genérico, replanteamos el problema: ¿Cómo diseñamos un sistema conversacional que guíe al usuario en la co-creación de entregables profesionales, usando agentes especializados que estructuren el proceso y oculten la complejidad técnica? Esta pregunta nos llevó a diseñar All Hub Context, un sistema que prioriza la colaboración humano-IA y la gobernanza centrada en el usuario.
03
Solución: All Hub Context – Un entorno colaborativo para la co-creación
All Hub Context es un sistema multiagente que transforma la intención del usuario en entregables profesionales mediante un diálogo guiado y un lienzo interactivo.
Un agente orquestrador coordina agentes especializados (ej. un agente para estructurar PRDs, otro para diagramas de arquitectura) que fragmentan tareas complejas en pasos simples, ocultando la complejidad técnica (Ley de Tesler).
El usuario colabora en tiempo real a través de un chat y un lienzo visual, con control total para intervenir, pausar o ajustar (Human-in-the-Loop).
Principios de gobernanza reflejados:
Transparencia
El lienzo visualiza el flujo de nodos, mostrando cómo los agentes construyen el entregable.
Control
Los usuarios pueden pausar, editar o priorizar acciones de los agentes.
Ética
Alertas para detectar posibles sesgos o errores en las decisiones de los agentes.
Auditoría
Historial de acciones para rastrear decisiones y exportar informes.
Cumplimiento de estándares y características clave
CIS Google Cloud v2.0.0
Seguridad robusta para proteger datos en Google Cloud.
Model Armor
Filtra prompts y respuestas para prevenir riesgos de seguridad.
Zero-Training
Interfaz intuitiva, sin necesidad de entrenamiento previo.
WCAG 2.1
Accesibilidad garantizada para usuarios con discapacidades.
i18n-Ready
Soporte multilingüe para una experiencia global.
Este prototipo de alta fidelidad (AI Spike) simula estas interacciones, validando una experiencia intuitiva y alineada con las necesidades del usuario.
04
Diseño del sistema conversacional multi-agente
4.1 Arquitectura de co-creación guiada
El diagrama muestra la arquitectura de co-creación Guiada: el usuario inicia la conversación en el orquestrador expresando por ejemplo 'Quiero crear un System Prompt'; éste invoca de inmediato al agente especialista, quien aplica la Ley de la Simplicidad para fragmentar la tarea en una secuencia de preguntas breves y consecutivas.
Cada respuesta se encadena automáticamente hasta conformar el System Prompt final, que el orquestrador devuelve al usuario sin que éste tenga que gestionar múltiples interfaces.
4.2 Arquitectura de co-creación guiada y lienzo como pizarra compartida
El lienzo visualiza el proceso de co-creación como un flujo de nodos. Cada respuesta en el chat se refleja al instante, por ejemplo, si el usuario escribe "Hola, necesito un prompt de sistema para crear una app”, un agente orquestrador captura la intención del usuario, y convoca al agente especializado en prompt de sistemas, que desglosa la tarea en pasos claros y consecutivos.
4.3 Human-in-the-Loop e interrumpibilidad
El flujo también respeta el principio Human-in-the-Loop: en cualquier momento el usuario puede pausar la conversación, pulsar un nodo para ajustar un parámetro directamente en el Inspector y, una vez satisfecho, retomar el chat; el agente detecta el cambio y prosigue desde el nuevo punto sin perder contexto.
Gracias a la Ley de Tesler, toda la complejidad inherente a la estructura del flujo y a la sintaxis del system prompt queda oculta bajo el capó: el usuario solo se preocupa por el contenido —el “qué”— mientras el sistema gestiona el “cómo”.
4.4 Gobernanza y seguridad simulada
La gobernanza no es una ocurrencia tardía, sino un pilar del diseño. El prototipo simula cuatro áreas clave para construir confianza y garantizar un uso responsable de la IA.
Transparencia: Flujo generado por el agente (Vertical en móvil)
El usuario ve en tiempo real cómo su intención se traduce en un flujo de trabajo. Cada nodo ofrece una explicación clara al pasar el ratón por encima.
💬 User: "hola, necesito un prompt de sistema para crear una app"
Entrada
Captura la intención inicial del usuario.
Prompt
Prompt estructurado listo para enviar al LLM.
LLM
Procesamiento del modelo.
Salida
Prompt de sistema finalizado y descargable.
Entrada
Prompt
LLM
Salida
Control: Intervención del usuario
El usuario siempre tiene la última palabra, con controles claros para gestionar el flujo, el gasto y la ejecución.
Créditos: 95/100
Se requiere confirmación para acciones que consuman >10 créditos.
Ética & Seguridad: Auditoría CIS y Model Armor
Simulación de un log de auditoría en tiempo real. Los eventos se registran conforme a los controles CIS, y Model Armor previene amenazas.
[
{
"timestamp": "2025-07-21T14:32:10.123Z",
"event_id": "EVT-20250721-001",
"user_id": "usr_7f8a9b",
"user_email": "ana@acme.io",
"user_role": "product_manager",
"agent_orchestrator": "orchestrator_main",
"agent_specialized": "prompt_system_agent",
"action": "prompt_sent",
"payload_preview": "¿Cuál es el objetivo principal de la app?",
"model_armor_result": "clean",
"cis_control": "2.1 – Log Integrity",
"ciphertext_key_id": "cme_key_42e1f",
"audit_level": "detailed",
"status": "success",
"latency_ms": 320,
"bytes_in": 128,
"bytes_out": 256,
"notes": "Prompt sanitizado y cifrado antes de enviar al LLM."
},
{
"timestamp": "2025-07-21T14:32:45.987Z",
"event_id": "EVT-20250721-002",
"user_id": "usr_7f8a9b",
"agent_specialized": "prompt_system_agent",
"action": "response_received",
"payload_preview": "Rol: Administrador | Propósito: Gestión de inventario...",
"model_armor_result": "clean",
"cis_control": "2.1 – Log Integrity",
"ciphertext_key_id": "cme_key_42e1f",
"audit_level": "detailed",
"status": "success",
"latency_ms": 410,
"bytes_in": 512,
"bytes_out": 768,
"notes": "Respuesta cifrada y registrada sin anomalías."
},
{
"timestamp": "2025-07-21T14:33:02.004Z",
"event_id": "EVT-20250721-003",
"user_id": "usr_4c5e2d",
"user_email": "dev@acme.io",
"agent_specialized": "arch_agent",
"action": "prompt_sent",
"payload_preview": "Genera un diagrama de arquitectura con URL http://malicious.example.com",
"model_armor_result": "block",
"cis_control": "2.1 – Log Integrity",
"ciphertext_key_id": null,
"audit_level": "detailed",
"status": "blocked",
"latency_ms": 120,
"bytes_in": 256,
"bytes_out": 0,
"notes": "URL maliciosa detectada; ejecución detenida. CMEK no aplicado."
},
{
"timestamp": "2025-07-21T14:33:15.555Z",
"event_id": "EVT-20250721-004",
"user_id": "usr_7f8a9b",
"action": "emergency_stop_triggered",
"agent_orchestrator": "orchestrator_main",
"payload_preview": null,
"model_armor_result": null,
"cis_control": "2.1 – Log Integrity",
"ciphertext_key_id": null,
"audit_level": "critical",
"status": "emergency_halt",
"latency_ms": 15,
"bytes_in": 0,
"bytes_out": 0,
"notes": "Usuario activó Emergency Stop; todos los agentes pausados."
}
]Auditoría: Trazabilidad del entregable
El historial de acciones ofrece una trazabilidad completa, mostrando cada paso en la construcción del artefacto final.
| Paso | Hora | Actor | Acción | Detalle | Estado |
|---|---|---|---|---|---|
| 1 | 14:32:10 | Ana (PM) | Inicia sesión | Login correcto | ✅ |
| 2 | 14:32:15 | Orchestrator | Recibe intención | «Necesito PRD para app de e-commerce» | ✅ |
| 3 | 14:32:18 | System-Prompt-Agent | Solicita dato | «¿Cuál es el objetivo principal de la app?» | ✅ |
| 4 | 14:32:25 | Ana (PM) | Responde | «Ventas multi-categoría con IA para upselling» | ✅ |
| 5 | 14:32:30 | System-Prompt-Agent | Genera nodo | Nodo-01 «Objetivo» creado | ✅ |
| 6 | 14:32:35 | System-Prompt-Agent | Solicita alcance | «¿Qué funcionalidades clave necesitas?» | ✅ |
| 7 | 14:32:45 | Ana (PM) | Responde | «Catálogo, carrito, pasarela pago, IA recomendaciones» | ✅ |
| 8 | 14:32:50 | System-Prompt-Agent | Genera nodos | Nodos-02,03,04,05 creados y enlazados | ✅ |
| 9 | 14:33:05 | Dev (viewer) | Edita nodo | Ajusta «IA recomendaciones» → «ML upselling» | ✅ |
| 10 | 14:33:10 | System-Prompt-Agent | Solicita métricas | «¿KPIs principales?» | ✅ |
| 11 | 14:33:18 | Ana (PM) | Responde | «CR > 5 %, tasa de recompra > 15 %» | ✅ |
| 12 | 14:33:20 | System-Prompt-Agent | Genera nodo | Nodo-06 «KPIs» creado | ✅ |
| 13 | 14:33:25 | Orchestrator | Cierre | Entregable PRD marcado como completo | ✅ |
| 14 | 14:33:30 | Auditoría | Exporta log | Historial JSON generado (ver enlace) | ✅ |
4.5 Cumplimiento de estándares y características clave
All Hub Context está diseñado con estándares de seguridad, accesibilidad y usabilidad para garantizar una experiencia robusta, inclusiva y confiable. Estos elementos reflejan nuestro compromiso con la gobernanza ética y la calidad de la experiencia del usuario.
CIS Google Cloud v2.0.0
Seguridad robusta para proteger datos en Google Cloud.
Model Armor
Filtra prompts y respuestas para prevenir riesgos de seguridad.
Zero-Training
Interfaz intuitiva, sin necesidad de entrenamiento previo.
WCAG 2.1
Accesibilidad garantizada para usuarios con discapacidades.
i18n-Ready
Soporte multilingüe para una experiencia global.
4.6 Botón "Parada de emergencia"
Un botón rojo "Parada de emergencia" permanece visible en cualquier vista; al pulsarlo, detiene de forma inmediata todos los agentes.
05
Diseño de la interfaz y experiencia
5.1 Interfaz minimalista para reducir la carga cognitiva
Desde el INICIO, la interfaz se concibió para ser visualmente atractiva y funcional al mismo tiempo. El tema oscuro, los espacios generosos y los iconos minimalistas activan el Efecto Estético-Usabilidad.
Los nodos resaltados y la disposición izquierda-centro-derecha aplican la Región Común, la Proximidad y el Efecto Von Restorff para guiar la atención sin esfuerzo.
A través de chunking y secciones colapsables, la información se presenta en bloques pequeños y significativos que respetan los límites de la memoria de trabajo y reducen la carga cognitiva.
5.2 Patrones de interacción familiares
Al diseñar la experiencia de usuario para este sistema multiagente, he optado por patrones de UI muy comunes como arrastrar y soltar nodos en un lienzo, el inspector lateral, y un asistente de chat, lo que encaja con lo que el usuario espera, evitando reglas nuevas y acortando la curva de aprendizaje.
5.3 Onboarding y sugerencias contextuales
Al idear la experiencia, mi intención fue que descubrir funciones resultara tan fluido como mantener una conversación.
En el chat, cuando el agente orquestrador invoca al agente especializado en el entregable que el usuario necesita, en la misma conversación le ofrece —sin interrumpirle— la opción de iniciar un tour guiado paso a paso por el lienzo.
Basta con que responda "sí" para que el primer paso se active al instante, sin menús ni clicks extra.
5.4 Control de gasto (Auto/Manual/Seguro)
Un selector de modo "Auto/Manual/Seguro" permite controlar el gasto de créditos. En modo manual, una ventana emergente simula el costo estimado (ej. "Esta acción usará 5 créditos, ¿confirmar?").
El modo Seguro fuerza CMEK, auditoría completa y filtros máximos de Model Armor.
5.5 Alertas y retroalimentación
La interfaz muestra alertas de seguridad en tiempo real: si un nodo contiene una URL maliciosa, se emite el mensaje "Error de Seguridad – Ejecución detenida. Se detectó una URL maliciosa en el prompt del nodo. Por favor, revísala. Ir al nodo".
El flujo queda pausado hasta que el usuario edite el contenido y confirme la corrección.
5.6 Accesibilidad
La interfaz cumple con estándares WCAG 2.1 (alto contraste, navegación por teclado), asegurando que sea accesible para todos los usuarios, incluyendo aquellos con discapacidades visuales o motoras.
5.7 Soporte multilingüe
Un selector de idioma simulado (ES / EN / FR) en la esquina superior derecha permite cambiar el idioma de la interfaz y de los agentes sin recargar la página.
06
Validación del prototipo (AI Spike)
El prototipo de alta fidelidad se diseñó para simular interacciones clave y validar la experiencia de usuario. Se realizaron pruebas de usabilidad simuladas con 5 usuarios (UX designers y desarrolladores), quienes completaron tareas como crear un PRD y ajustar nodos en el lienzo.
6.1 Resultados clave – feedback de 10 usuarios reales
(RITE realizado en 10 sesiones, 1 director de marketing, 3 desarrolladores, 4 creadores de contenido, 2 prompt engineers)
Checklist #2.1
Interfaz clara y escalable
4.6
“«La app es intuitiva, en pocos minutos estaba creando un prompt profesional».”
Checklist #3.2
Explicaciones claras
4.8
“«Los mensajes de información de los nodos me han ayudado a entender mejor el sistema».”
Checklist #4.3
Botón de parada de emergencia
4.5
“«Este botón es muy importante para no perder el control».”
Checklist #5.1
Privacidad y consentimiento
4.7
“«El banner “se inspeccionará PII” me da seguridad, sobre todo con la información confidencial».”
Checklist #6.4
Tiempos de respuesta
4.2
“«En general la aplicación es bastante fluida».”
Checklist #9.5
Soporte multilingüe
4.8
“«Es imprescindible para que pueda llegar a usuarios de todo el mundo».”
6.2 Próximos pasos:
Refinar micro-interacciones
Ajustar animaciones de los nodos (fade-in/out) para reducir latencia percibida.
Integrar Hotjar real
Conectar Hotjar al prototipo.
Definir KPIs de éxito
Establecer umbrales: <3 min curva de aprendizaje, >85 % tareas completadas, <5 % uso del botón “botón para de emergencia”.
Ampliar muestra de prueba
30 usuarios.
Escenarios de estrés
Simular múltiples agentes simultáneos
Internacionalización completa
Traducir toda la UI y contenido de agentes a EN, FR, DE.
Auditoría de seguridad externa
Revisión de CMEK + Model Armor por tercero (SOC 2).
Roadmap de lanzamiento beta
MVP cerrado en 6 meses, soft-launch a 100 usuarios.
6.3 Herramientas de análisis integradas
He integrado Google Analytics 4 para convertir cada interacción del prototipo en datos útiles: cada cambio de modo (Auto, Manual o Seguro), cada clic sobre un nodo y cada activación del botón de pánico genera un evento personalizado que alimenta métricas clave como tiempo de tarea, tasa de finalización y frecuencia de uso por perfil de usuario.
Los informes de GA4 se visualizan en un dashboard simulado en tiempo real, permitiendo a los investigadores detectar patrones de fricción y priorizar iteraciones sin necesidad de recopilar datos externos adicionales.
Conclusión: Un nuevo paradigma para la co-creación con IA
All Hub Context redefine cómo los profesionales colaboran con la IA para crear entregables, pasando de diálogos desestructurados a un proceso guiado, visual y ético.
Este prototipo de alta fidelidad demuestra una experiencia de usuario intuitiva que aborda los puntos de dolor clave.
Beneficios clave:
- Eficiencia: Reduce tiempo de preparación y refactorización
- Colaboración: Interacción fluida humano-IA
- Gobernanza: Transparencia, control y responsabilidad
Llamada a la acción: Invitamos a explorar el prototipo, proporcionar retroalimentación y colaborar en la evolución de All Hub Context como una herramienta líder en la co-creación con IA.