Construyendo un Reloj Geológico con Claude Code: HTML Único + Three.js

✍️ OpenClawRadar📅 Publicado: 5 de mayo de 2026🔗 Source
Construyendo un Reloj Geológico con Claude Code: HTML Único + Three.js
Ad

Owen Thomas, un diseñador de productos con habilidades básicas de HTML/CSS, creó eona.earth, un reloj geológico que asigna los 4.500 millones de años de historia de la Tierra a una esfera de reloj de 12 horas sincronizada con la hora local. El proyecto se construyó completamente usando Claude Code (plan Pro) y se distribuye como un único archivo HTML con JavaScript vanilla, Three.js para WebGL y un shader de fragmentos personalizado, sin paso de compilación.

Detalles clave de la construcción

  • Uso de Claude Code: Principalmente se usó Sonnet para la implementación, cambiando a Opus 4.6 para trabajos complejos o cuando se quedaba atascado. Inicialmente probó Opus 4.7, pero resultó ser sobredimensionado (por ejemplo, ejecutando 4 pases de ruido por píxel a 60 fps).
  • Shader WebGL personalizado renderiza el globo con datos de continentes paleogeográficos. Nubes procedurales y neblina atmosférica evolucionan a medida que avanzas en el tiempo geológico.
  • Paleta de colores diseñada en Gemini (plan gratuito, modo Pensamiento) para crear un sistema para 14 fases de la evolución de la Tierra. Opus 4.6 luego construyó un editor de paleta interactivo (sin solicitud) para ajustar colores, superficies y nubes, disponible en eona.earth/colour-lab.html.
  • Interacción: Arrastra un control deslizante para recorrer manualmente 4.500 millones de años. Activa o desactiva capas mediante los controles en la esquina superior derecha.
  • Correspondencias temporales: 12:06 — se forma la Luna, 2:45 — primera vida, 11:39 — los dinosaurios se extinguen, los humanos aparecen en los últimos 3 segundos.
  • Deriva continental: La Tierra bola de nieve post-criogénica se renderiza usando datos de continentes paleogeográficos (series de mapas con interpolación de formas).
Ad

Flujo de trabajo y limitaciones

Owen trabajó por las tardes durante 2 semanas, manteniéndose dentro de los límites del plan Pro siendo intencional: sesiones cortas, horas valle, trabajando fuera de Claude cuando era posible y usando archivos de contexto. El código fuente está en GitHub en github.com/owen-thomas/eona-earth.

Funciones planeadas

  • Navegación por teclado para saltar entre eventos
  • Avance sin que el globo gire (para observar la deriva continental)
  • Proyección futura de la Tierra que cubra la vida restante del planeta (segundo período de 12 horas)
  • Versión física con pantalla redonda Waveshare + Raspberry Pi 4
  • Diseño de sonido
  • Aplicación para reloj, móvil y escritorio

📖 Lee la fuente completa: r/ClaudeAI

Ad

👀 Ver también

Argyph: Un Servidor MCP Único para Claude Code con 19 Herramientas Estructuradas de Comprensión de Código
Herramientas

Argyph: Un Servidor MCP Único para Claude Code con 19 Herramientas Estructuradas de Comprensión de Código

Argyph es un servidor MCP local que le da a Claude Code 19 herramientas — ir a definición, buscar referencias, grafos de llamadas, búsqueda semántica, empaquetado de repositorio con presupuesto de tokens — reemplazando múltiples servidores MCP separados con una sola instalación. No requiere clave API; todo el procesamiento permanece en tu máquina.

OpenClawRadar
Superglue CLI: Permite que los Agentes de IA Ejecuten Llamadas API Sin Herramientas Preconstruidas
Herramientas

Superglue CLI: Permite que los Agentes de IA Ejecuten Llamadas API Sin Herramientas Preconstruidas

Superglue CLI proporciona una habilidad que enseña a los agentes de IA de programación cómo usar sus comandos, manejar autenticación, construir herramientas y depurar fallos. En lugar de crear herramientas predefinidas para cada integración de API, los agentes pueden leer las especificaciones de la API en tiempo de ejecución y planificar llamadas de múltiples pasos.

OpenClawRadar
Claw Code Agent: Reimplementación en Python de la Arquitectura Claude Code para Modelos Locales
Herramientas

Claw Code Agent: Reimplementación en Python de la Arquitectura Claude Code para Modelos Locales

Claw Code Agent es una reimplementación en Python de la arquitectura del agente Claude Code que funciona con modelos de código abierto locales a través de backends compatibles con OpenAI como vLLM y Ollama, incluyendo llamadas a herramientas, comandos de barra y permisos escalonados.

OpenClawRadar
Auto-optimización: Un Complemento de Código Claude para Optimización Autónoma del Rendimiento
Herramientas

Auto-optimización: Un Complemento de Código Claude para Optimización Autónoma del Rendimiento

Un desarrollador creó auto-optimize, un complemento de Claude Code que ejecuta de forma autónoma ciclos de perfilado → planificación → evaluación comparativa para optimizar el rendimiento del código. En una prueba, logró una tabla hash un 27% más rápida en todos los escenarios de evaluación en aproximadamente 3 horas.

OpenClawRadar