--- title: "Caso web de Hyper: hacer visible la inteligencia de clientes" description: "Hyper: de señales dispersas a un perfil de cliente con fuentes, contado con una historia 3D en el navegador, e investigación pagada de 10 USD en Cloudflare." url: "https://dardo.studio/es/proyectos/hyper/" language: "es" translations: {"en":"https://dardo.studio/en/work/hyper/","pt":"https://dardo.studio/pt/projetos/hyper-estudo-de-caso-web-design/"} updated: "2026-10-12T12:00:00Z" --- Caso de estudio # Hyper Hyper convierte señales dispersas sobre un cliente en un perfil único con fuentes enlazadas, prueba cada oferta candidata contra ese mismo perfil y prepara a un agente de IA para una llamada personalizada. Dardo diseñó y desarrolló su experiencia web, desde el "gemelo del cliente" interactivo del inicio hasta el flujo de investigación pagada que lo respalda, en inglés y español. 2026 · Diseño web / Desarrollo creativo / Animación [Visitar sitio](https://hypers.dev/) ![Hyper — vista previa del sitio](https://dardo.studio/work/motion/hyper-signals-v3.webp) Hyper / Proyecto de Dardo · [Visitar sitio ](https://hypers.dev/) ## Dónde empezó Hyper nació en julio de 2026 como el MVP de una hackatón sobre ofertas de crédito hiperpersonalizadas, hecho por un equipo pequeño. Nicolás Cerón, fundador de Dardo, escribió la mayor parte del código, lideró la interfaz web y estuvo a cargo del módulo de enriquecimiento; el resto del equipo se encargó de la decisión de ofertas y de la llamada de voz. Después de la hackatón el producto siguió como hypers.dev, que hoy vende investigaciones que empiezan por un nombre: 10 USD por informe, sin suscripción. ## El problema de comunicación Los productos de inteligencia de clientes suelen abrir con una pared de categorías: captura de datos, resolución de identidad, predicción, segmentación, activación. El inicio de Hyper empieza con una persona. A medida que se hace scroll, los datos autorizados, la evidencia pública, las afiliaciones y la actividad reciente se reconcilian en un perfil unificado, y ese perfil se mantiene fijo mientras cada oferta preseleccionada se prueba contra él. Ese orden le da una función al movimiento: cada transición explica un cambio de significado en vez de decorar una pantalla terminada. Ese es el centro de nuestro trabajo de [desarrollo creativo](https://dardo.studio/es/servicios/desarrollo-creativo/). ## Qué construyó Dardo - **La historia del inicio:** una secuencia guiada por el scroll, hecha con React Three Fiber y three.js, que va de las señales sueltas a un solo cliente y luego al "gemelo agéntico" que prueba ofertas contra un perfil fijo. - **La etapa de enriquecimiento** del flujo de investigación, que busca evidencia pública, enlaza cada dato a su fuente y deja como desconocido lo que no tiene respaldo, en lugar de adivinar. - **Investigación pagada:** un producto de pago único de 10 USD con Dodo Payments, verificado por webhook, con reembolsos y disputas que retiran el acceso, y límites de capacidad de dos investigaciones simultáneas y 20 por día. - **Control de costos:** el costo de cada consulta a un modelo de IA queda registrado en la base de datos, para comparar el precio de cada informe con lo que realmente cuesta producirlo. - **Versiones en inglés y español** del sitio, y copias en Markdown para los agentes de IA que las piden. ## Tecnología El frontend es Next.js 16 sobre Cloudflare Workers con OpenNext, con React Three Fiber, three.js y Lenis para la historia interactiva. El backend de investigación es un servicio en Python con FastAPI que corre en un Cloudflare Container conectado por service binding, con datos en Cloudflare D1 y Redis. ## Evidencia de implementación El 12 de octubre de 2026 revisamos el sitio en vivo en hypers.dev, sus versiones en inglés y español y su oferta de investigación de 10 USD, junto con la implementación: el frontend en Next.js y su despliegue en Cloudflare, el servicio en FastAPI, el webhook de pagos y las reglas de acceso, y el registro de costos. Todos los ejemplos de clientes de la página pública, incluido el perfil de la compradora de vivienda, son sintéticos. ## Evidencia y límites Esta página describe el producto entregado y las partes que construyó Dardo. No afirma ingresos, usuarios ni informes vendidos, que no se han publicado, y no presenta la hackatón como una competencia ganada ni los ejemplos sintéticos como datos reales de clientes. ![Hyper — Una primera impresión más personal](https://dardo.studio/_astro/01M4H70GR17KNKBYV19EK8WXXE_1zdGoO.webp) Una primera impresión más personal ![Hyper — La visualización del gemelo del cliente](https://dardo.studio/_astro/01M4H70GS5QC6HB68FTN7B2387_1TH8Aq.webp) La visualización del gemelo del cliente [Visitar sitio](https://hypers.dev/) ## Fuentes y lecturas Evidencia principal del proyecto: el despliegue público y los detalles de implementación revisados por Dardo para este caso. - [Sitio web de Hyper](https://hypers.dev/) · hypers.dev [Dardo](https://dardo.studio/es/) · [Proyectos](https://dardo.studio/es/proyectos/) · Hyper ## Sigue explorando. - [Servicio · **Agencia de diseño web en Bogotá para Colombia, EE. UU. y Latinoamérica**](https://dardo.studio/es/servicios/diseno-web/) - [Servicio · **Desarrollo web creativo: animación, interacción y WebGL**](https://dardo.studio/es/servicios/desarrollo-creativo/) - [Tu proyecto · **Inicia una conversación**](https://dardo.studio/es/contacto/)