Cronotopo

Cuando uno estudia historia, el mapa y la cronología casi siempre van por separado: un libro te dice en qué año pasó algo y otro te muestra dónde. Quería verlos juntos. El globo es el espacio, la línea de abajo es el tiempo, y tú decides dónde y cuándo mirar.

Por eso el nombre. Cronotopo viene del griego chrónos (tiempo) y tópos (lugar). Arranca con los primeros Homo sapiens en Omo Kibish y llega hasta el mundo contemporáneo sin cambiar de pantalla.

Un atlas de historia que inventa fechas no sirve. Cada lugar tiene cinco elementos, uno por categoría: un monumento, un personaje, una tecnología, una expresión cultural y un acontecimiento. Todos llevan año, coordenadas, nivel de confianza y enlace a la fuente.

Zod valida los 300 elementos en cada build: ids únicos, años coherentes con su era, coordenadas en rango y fuentes https. Después pasé el contenido por una auditoría adversarial que encontró cuatro errores factuales y varias coordenadas mal puestas. Las fechas con "c." bajaron a confianza media, aunque eso hiciera ver el contenido menos seguro.

El movimiento sigue una regla: lo importante se mueve primero y más. La cámara antes que los marcadores, los marcadores antes que los arcos y los arcos antes que la interfaz. Todo sale de un solo archivo con cuatro timelines de GSAP (intro, cambio de era, selección y cierre), y cualquiera se puede interrumpir a mitad sin que nada salte.

Al cambiar de era, un barrido de luz recorre el globo de polo a polo y el color de toda la interfaz cambia con la época. La escena 3D y la UI solo se hablan a través de un store de Zustand. Three.js y GSAP se cargan aparte, así que el JavaScript inicial bajó de 363 a 273 KB comprimidos.

Seis tarjetas tienen un botón "Ver escena". No es un video: es una escena 3D procedural, sin modelos ni texturas descargadas, y cada subtítulo describe lo que se está viendo en ese momento. Hay escenas sobre el nacimiento de la escritura en Uruk, la Gran Pirámide, el Partenón, la imprenta de Maguncia, las fábricas de Mánchester y la erupción del Vesubio.

El estado visual de cada escena depende solo del tiempo: una timeline pausada que se mueve con seek y números aleatorios con semilla. Eso permite adelantar, retroceder o mandarle a alguien un enlace a un segundo exacto, y que siempre se vea igual.

Las escenas las construyeron seis agentes de Claude en paralelo, cada uno en su propio worktree de git. Yo fijé el contrato técnico, los hechos del guion y las reglas editoriales, y les di libertad con los planos y el ritmo. Para que no se pisaran, cada escena registra su propio archivo de metadatos y nadie toca los archivos compartidos.

Lo que aprendí: el paralelismo rinde cuando el contrato está claro desde el inicio. Las escenas todavía tienen pulido pendiente, sobre todo los finales, y eso está anotado en el repositorio.

En escritorio el lugar se abre en un panel lateral y en el celular en una hoja inferior, sin scroll horizontal desde 360 px. Se puede usar entero con teclado, el foco se gestiona en cada transición y hay modo de movimiento reducido que cambia los vuelos por fundidos. El estado vive en la URL, así que cualquier era o lugar se puede compartir y los botones de atrás y adelante funcionan.

Catorce tests e2e con Playwright cubren el recorrido completo, y otro arnés graba en video las cuatro transiciones para revisarlas cuadro a cuadro.