Horacio Ontiveros

El Problema

Revisar tus propios estados de cuenta es lento y propenso a errores cuando se hace manualmente: cargos duplicados, aumentos silenciosos en suscripciones recurrentes y suscripciones “zombie” que olvidaste cancelar se mezclan en una pared de líneas, y no hay registro trazable de en qué categoría debe caer un comercio una vez que lo corregiste.

La Solución

Arquitectura de un pipeline de auditoría multi-agente con LangGraph, orquestando 7 nodos especializados a lo largo del flujo — extraer → normalizar → categorizar → detectar anomalías → revisión humana → aprender del feedback → generar reporte. Las transacciones ambiguas o marcadas se enrutan al usuario para una decisión final mediante un paso explícito de INTERRUPT, y cada corrección alimenta un motor de reglas con puntuación de confianza para que el mismo comercio se categorice correctamente la próxima vez sin otra llamada a la API.

Pipeline RAG sobre pgvector

Capa de recuperación con pgvector y embeddings de Gemini sobre el historial de transacciones del propio usuario, que alimenta una interfaz de chat en lenguaje natural (“¿cuánto gasté en restaurantes en abril?”) anclada en sus estados de cuenta reales en lugar del conocimiento paramétrico del modelo — cada respuesta traza de vuelta a filas de transacciones reales.

Revisión Humana en el Loop

El grafo está diseñado para que la etapa de categorización/detección de anomalías pause la ejecución y presente sus hallazgos al usuario para aprobación o corrección antes de continuar, usando el mecanismo de interrupt de LangGraph. Esto mantiene al usuario en control de la decisión final sobre transacciones marcadas, mientras el agente maneja la categorización repetitiva y el cruce de anomalías entre estados.

Arquitectura FastAPI + Next.js

Backend con FastAPI, exponiendo el estado del grafo y el historial de auditoría por usuario a través de una API tipada con scope de autenticación (sesiones reales de Supabase Auth). Frontend en Next.js/TypeScript renderiza la cola de revisión, seguimiento de presupuesto y un reporte de auditoría exportable detrás de un paywall de Stripe para la versión express.

Economía Unitaria

Desplegado en el tier gratuito de Render, con un estado de carga consciente del cold-start en el frontend que enmascara la latencia de arranque del backend tras períodos de inactividad — manteniendo el costo de infraestructura cerca de cero fuera del uso activo, apropiado para un proyecto en desarrollo activo.

El Problema

Los portafolios arquitectónicos exigen fidelidad visual extrema: imágenes de alta resolución que documentan detalles estructurales. Los frameworks tradicionales introducen Layout Shifts masivos (CLS), tiempos de LCP deficientes y un SEO fragmentado entre regiones, destruyendo tanto la experiencia de usuario como la visibilidad en buscadores.

La Solución

Ingeniería de una plataforma estática multiidioma de alto rendimiento con Astro 5 + Vue.js 3, combinando arquitectura de islas con pipelines de imágenes en tiempo de build para lograr estados de entrada sin JavaScript, integridad de layout perfecta e internacionalización instantánea.

Arquitectura de Islas e Hidratación Parcial

En lugar de forzar un bundle JS monolítico al cliente, los componentes interactivos se hidratan quirúrgicamente:

• HeroSlider.vue usa hidratación diferida (client:idle) para priorizar la carga del contenido crítico above-the-fold.
• MasonryGallery.vue usa client:visible, inicializando el grid dinámico con Macy.js únicamente cuando entra en viewport, ahorrando tiempo de ejecución en el hilo principal.

Pipeline Automatizado de Imágenes

Para gestionar fotografías arquitectónicas de varios megabytes, se implementó un pipeline de procesamiento en tiempo de build con Sharp:

• Inspección dinámica de metadatos y aplicación de anchos máximos estructurales (1920px)
• Generación automática de formatos next-gen (.webp, .avif)
• Hardcoding de aspect ratios dinámicos en el DOM para eliminar por completo el CLS

Filtrado Asíncrono Multi-Criterio

Sistema de filtrado event-driven entre elementos Astro estáticos y componentes Vue reactivos: CustomEvent('projectFilter') a través de listeners globales en window. El grid de masonry actualiza su estado, ejecuta los cambios de DOM vía nextTick y fuerza recálculos de layout exactamente después de cada micro-interacción.

SEO Multiregión e i18n

• Enrutamiento multi-locale concurrente (/es/, /en/, /fr/)
• Sitemaps de idioma automatizados con inyecciones regionales (sitemap-en.xml, etc.)
• Estructuras JSON-LD estrictas con palabras clave contextuales como VisualArtwork y metadatos geo-targetizados dinámicos

Resultado

Lighthouse 100/100 en Mobile Performance. Carga total por debajo de 1 segundo con componentes visuales pesados, enrutamiento multiidioma dinámico y sets de imágenes responsive que eliminaron completamente el overhead de datos entre dispositivos.

🚀 Caso de Estudio: Motor de Logística Empresarial y Flujo de Órdenes

Rol: Lead Product Engineer (Arquitectura & UI)
Tech Stack: Python, FastAPI, React/UI, PostgreSQL (Supabase), Google Cloud Platform (Cloud Run), Docker, Asyncio.

🛑 El Problema

Las operaciones regionales del cliente estaban bloqueadas por un sistema manual y desarticulado. Procesar logística, calcular polígonos de entrega complejos, aplicar niveles de precios dinámicos y notificar a los clientes requería múltiples intervenciones humanas. Esto resultaba en alta latencia operativa y un mayor margen de errores críticos mientras el negocio intentaba escalar.

📐 La Arquitectura

Abordé este desafío con una mentalidad de Design-to-Deployment: primero mapeando una experiencia de usuario impecable, y luego ingeniando un backend altamente tolerante a fallos y orientado a eventos para soportarla.

⚙️ Ejecución Técnica e Impacto

1. UI y Frontend sin fricción
Aproveché mi experiencia en diseño para construir una interfaz intuitiva y reactiva que abstrae la complejidad subyacente de los operadores, reduciendo el tiempo de capacitación a casi cero.

2. Orquestación Serverless (GCP & Python)
Diseñé un OrderWorkflowManager central usando Python y FastAPI. El backend está contenerizado mediante un Dockerfile multi-stage y desplegado en Google Cloud Run, optimizado para eliminar cold starts y mantener tiempos de respuesta por debajo de 200ms.

3. Procesamiento Async y Orientado a Eventos
Para evitar el bloqueo de la UI durante operaciones pesadas, implementé patrones avanzados de asyncio. Mientras el sistema calcula ray-casting complejo para polígonos de entrega vía Google Maps y ejecuta transacciones ACID en PostgreSQL, simultáneamente:

• Genera recibos PDF físicos en memoria y los sube a Google Cloud Storage.
• Sincroniza tratos y datos de clientes con Pipedrive CRM.
• Dispara Webhooks de WhatsApp en tiempo real vía Respond.io.

🏆 Resultados de Negocio

Se entregó un sistema robusto cubierto por +100 pruebas unitarias (pytest + mocking) para garantizar cero tiempo de inactividad en producción. La plataforma digitalizó por completo el flujo de trabajo regional de la organización, transformando un proceso manual lento y propenso a errores en un motor logístico automatizado y en tiempo real.

El Problema

Los fotógrafos profesionales operan con un flujo de trabajo fragmentado: una herramienta para entregar galerías de alta resolución, otra para rastrear selecciones del cliente, y un CMS separado para actualizar su portafolio público. Esta desconexión les cuesta horas de entrada manual de datos y gestión de assets por cada sesión fotográfica.

La Solución

Arquitectura y desarrollo de una plataforma SaaS centralizada y por suscripción que unifica la entrega al cliente con la generación de portafolio. El sistema permite a los fotógrafos compartir galerías de forma segura mediante códigos de acceso, que los clientes curren sus tomas favoritas, y publica automáticamente las imágenes aprobadas en un portafolio público optimizado para SEO.

Pipeline de Media de Alto Rendimiento

Pipeline automatizado de assets con Python/FastAPI: al subir una imagen RAW de alta resolución, el backend la intercepta, procesa un preview .webp liviano con Pillow, y sube ambos archivos a Google Cloud Storage. Para proteger la propiedad intelectual, todo el acceso a imágenes está restringido detrás de Signed URLs generadas dinámicamente con expiraciones estrictas.

Uploader Concurrente en Lotes (Vue 3)

Para manejar cientos de archivos de varios megabytes sin colapsar el navegador, desarrollé un componente Vue 3 personalizado (GCSUploader.vue) que procesa archivos en lotes concurrentes de tres. Ofrece seguimiento de progreso en tiempo real por archivo y captura instantáneamente errores de cuota excedida del backend (HTTP 403) para activar modales de upsell premium.

Motor de Suscripción con Stripe Webhooks

Motor de suscripción completamente funcional mediante Stripe Webhooks: el backend escucha eventos checkout.session.completed para actualizar automáticamente a usuarios al tier PRO. Lógica de negocio para aplicar cuotas en base de datos (tier Free: 3 galerías vs. PRO: 50 galerías) y revocaciones de acceso por vencimiento de tiempo.

UI Dark Mode y Portafolios Dinámicos

Interfaz dark mode intuitiva inspirada en Adobe construida con Tailwind CSS. Los portafolios públicos dinámicos incluyen generación de schema JSON-LD para SEO y galerías lightbox reactivas con navegación por teclado.

Economía del Negocio

Aplicación production-ready con PostgreSQL Row-Level Security (RLS). La plataforma está arquitectada para operar con un margen de ganancia superior al 90% en sus tiers de suscripción: hosting de media en Google Cloud Storage a fracciones de centavo y deployments serverless para el frontend mantienen los costos de infraestructura prácticamente en cero.

🚀 Caso de Estudio: Agenda Citara — SaaS de Agendamiento Multi-tenant & Control de Flujo en Tiempo Real

Rol: Lead Full Stack & Architecture Engineer
Tech Stack: Next.js 15 (App Router), Supabase (PostgreSQL, RLS, WebSockets), Tailwind CSS, Stripe (Metered Billing), Node.js (Baileys WA Socket), AWS S3.

🛑 El Problema

Los profesionales de servicios (médicos, terapeutas, consultores) lidian con calendarios rígidos. Cuando una sola cita se extiende 15 minutos, el resto del día colapsa — salas de espera llenas y clientes frustrados. Además, los recordatorios automáticos de WhatsApp vía proveedores tradicionales como Twilio tienen costos unitarios elevados que erosionan los márgenes de los profesionales independientes.

📐 La Solución

Diseñé una plataforma de agendamiento multi-tenant altamente escalable. Más allá de las funciones estándar de reserva, Citara introduce un Módulo de Control de Flujo en Tiempo Real (MTR) que recalcula y desplaza dinámicamente toda la agenda del día si una cita se extiende. Para resolver el problema del costo de notificaciones, construí una arquitectura de mensajería híbrida que permite a los usuarios usar plantillas oficiales o conectar su WhatsApp personal mediante un microservicio descentralizado.

⚙️ Ejecución Técnica & Arquitectura

1. Motor MTR & Reprogramación Dinámica
Un motor algorítmico (/api/mtr/appointment/delay) intercepta los check-outs tardíos. Cuando una sesión excede su tiempo asignado, el sistema calcula el desfase en minutos, verifica los límites de buffer configurados por el usuario y propaga el retraso a todas las citas siguientes. Los clientes reciben automáticamente un mensaje de WhatsApp con su nuevo horario ajustado.

2. Microservicio Híbrido de WhatsApp Desacoplado
Diseñé un sistema de mensajería de doble canal para reducir drásticamente los costos de notificación. Los usuarios pueden optar por entrega estándar vía Twilio, o conectar su WhatsApp personal usando un microservicio Node.js/Express basado en @whiskeysockets/baileys. Un pipeline de sincronización con AWS S3 persiste los estados de autenticación entre reinicios de contenedores serverless — habilitando mensajería automatizada de costo cero directamente desde el número del profesional.

3. Facturación por Excedente con Stripe (Webhooks)
Diseñé una integración compleja de Stripe que maneja suscripciones de tarifa plana (Pro/Premium) junto con facturación por uso. El backend registra la cuota mensual de notificaciones en PostgreSQL. Si un usuario supera su límite, el sistema dispara un webhook checkout.session.completed para agregar automáticamente un ítem de excedente medido a su suscripción de Stripe, limitando dinámicamente para evitar facturas inesperadas.

4. Base de Datos en Tiempo Real & Row-Level Security (RLS)
Aseguré la arquitectura multi-tenant con Row-Level Security de Supabase, garantizando aislamiento absoluto de datos entre profesionales. La replicación lógica de PostgreSQL (Supabase Realtime) transmite actualizaciones instantáneas de UI vía WebSockets — el dashboard del operador refleja los estados de citas sin polling manual.

🏆 Resultados de Negocio & Economía Unitaria

Se entregó una plataforma SaaS de alto margen. Al ofrecer el microservicio de WhatsApp personal, se reduce la fricción de adquisición (sin costos extra de mensajes), mientras que los usuarios avanzados ascienden naturalmente a tiers Premium para reportes avanzados y funciones MTR. La arquitectura serverless y optimizada para edge mantiene los costos de infraestructura despreciables, escalando de forma rentable desde el día uno.

Arquitectura de Catálogo

Hialuroniz representa un sistema de información para la salud y el bienestar. El núcleo del proyecto es un motor de búsqueda y filtrado lógico que clasifica cientos de productos basándose en objetivos de bienestar, permitiendo una navegación sistémica y no solo visual.

Eficiencia en la Selección

• Taxonomía Inteligente: Desarrollo de una estructura de categorías cruzadas que optimiza el camino de compra del usuario, reduciendo el número de clics necesarios para encontrar soluciones específicas de salud.
• Optimización de Assets: Implementación de un flujo de carga diferida (lazy loading) avanzado, permitiendo que el catálogo extenso sea fluido incluso en conexiones móviles limitadas.

Impacto Comercial

La arquitectura eficiente del catálogo ha resultado en una mejora directa en la tasa de conversión, facilitando que el usuario tome decisiones informadas basadas en un sistema de información claro y bien estructurado.

Ingeniería de Sistemas

HiPets es un sistema de planificación de recursos (mini-ERP) verticalizado para clínicas veterinarias. La solución integra un motor de persistencia distribuido mediante Supabase, permitiendo que los expedientes médicos digitales estén disponibles de forma segura e instantánea desde cualquier dispositivo en la red de la clínica.

Eficiencia y Automatización

• Control de Inventarios y Citas: Automatización del flujo de citas vinculado a la base de datos de pacientes, lo que previene errores manuales en la programación de refuerzos médicos.
• Backend Reactivo: Implementación de una API ligera en Python/Flask desplegada en GCP, diseñada para tiempos de respuesta ultra-bajos en entornos de alta demanda operativa.

Resultados de Implementación

El sistema centraliza la operación administrativa, reduciendo el tiempo de ingreso de pacientes en un 30% y garantizando un control total sobre el historial clínico digital, vital para la continuidad del tratamiento médico.

El Problema

Operar un estudio de producto implica mantener sincronizados sistemas que no se hablan entre sí: el CRM con el pipeline de leads y clientes, el portafolio público con los proyectos activos, el blog con su SEO, las tareas internas de cada proyecto, y la facturación. Cualquier actualización cruzada requería abrir múltiples herramientas y hacer el mismo cambio manualmente en cada una.

La Solución

Construí un servidor MCP (Model Context Protocol) propio que expone más de 60 herramientas tipadas como contexto operativo para cualquier agente de IA (Claude Desktop, Amazon Q). Un solo prompt puede mover un lead en el pipeline, actualizar el portafolio público, publicar un post en el blog, revisar métricas de GA4/Search Console y registrar una factura — sin salir del flujo de conversación.

Arquitectura

El servidor implementa el protocolo MCP sobre StdioServerTransport, comunicándose por stdin/stdout con el cliente LLM. Las herramientas se ejecutan como llamadas POST a un bridge PHP (McpBridgeController) desplegado en el sitio, que accede directamente a MariaDB vía PDO. La autenticación usa Bearer token con hash_equals para prevenir timing attacks, y un límite de 50 requests por sesión corta cualquier uso abusivo.

LLM (Claude / Amazon Q)
  ↓ MCP protocol (stdio)
index.ts — Node.js + TypeScript
  ↓ POST /api/mcp + Bearer token
McpBridgeController.php
  ↓ PDO
MariaDB

Dominios Operativos

El servidor cubre el estudio completo en seis dominios:

• CRM — pipeline de leads con paginación, conversión a cliente con deduplicación por email y registro de sale_value para Enhanced Conversions, perfiles completos con proyectos y testimonios
• Portafolio — CRUD de proyectos con contenido i18n ES+EN por combo proyecto+servicio
• Blog — creación, edición y publicación de posts con categorías y campos multiidioma
• Gestión de proyectos — listas de tareas, milestones, onboard_project que crea toda la estructura desde templates en un solo llamado, activate_phase para cambiar estado en cascada
• Facturación — facturas por proyecto y estado de cuenta
• Analytics / SEO — GA4 y Search Console por slug individual o sitio completo, con dimensiones configurables

Además expone cuatro MCP Resources de lectura pasiva (nucleo://services, nucleo://projects, nucleo://blog/posts, nucleo://clients) y una herramienta de búsqueda global que cruza servicios, proyectos, posts y clientes simultáneamente.

Integración de Sistemas

Para Galau Consultoría, el sistema se diseñó como una plataforma de adquisición de prospectos (lead generation). Se integró el núcleo de WordPress con una capa de rastreo avanzado mediante Google Tag Manager, permitiendo medir la eficiencia de cada punto de contacto en el flujo de selección de talento.

Eficiencia en el Embudo

• Automatización de Seguimiento: Configuración de Workspaces integrados que permiten la sincronización de datos entre el portal web y las herramientas de gestión interna del equipo.
• Arquitectura de Bajo Mantenimiento: Despliegue en Google Compute Engine con políticas de backup y escalamiento manual, garantizando la estabilidad operativa del portal.

Impacto en Negocio

El sistema ha profesionalizado la entrada de talento, permitiendo que la consultora gestione un mayor volumen de candidatos sin aumentar su carga administrativa, mejorando la velocidad de respuesta hacia sus clientes corporativos.

Sobre el Proyecto

Desarrollo integral de la presencia digital del Instituto Jalisciense de Cancerología. El enfoque principal fue la accesibilidad de la información para pacientes y personal médico.

Eficiencia Operativa

• CMS a Medida: Desarrollé un backend administrativo optimizado para usuarios no técnicos, permitiendo que la información vital se publique en segundos, eliminando silos de información internos.
• Arquitectura de Base de Datos: Optimización de consultas en MariaDB para soportar altos volúmenes de tráfico concurrente durante periodos de avisos oficiales.

Impacto en el Servicio

La digitalización de procesos de consulta de trámites y directorios ha reducido el flujo de atención telefónica de primer nivel, permitiendo al personal del instituto enfocarse en la atención directa y gestión clínica más compleja.