Construire une horloge géologique avec Claude Code : HTML unique + Three.js

✍️ OpenClawRadar📅 Publié: May 5, 2026🔗 Source
Construire une horloge géologique avec Claude Code : HTML unique + Three.js
Ad

Owen Thomas, un designer produit avec des compétences de base en HTML/CSS, a construit eona.earth — une horloge géologique qui projette les 4,5 milliards d'années d'histoire de la Terre sur un cadran de 12 heures synchronisé avec l'heure locale. Le projet a été entièrement réalisé avec Claude Code (formule Pro) et livré sous forme d'un fichier HTML unique avec du JavaScript vanilla, Three.js pour WebGL et un shader fragment personnalisé — sans étape de build.

Détails clés de la construction

  • Utilisation de Claude Code : Principalement Sonnet pour l'implémentation, passage à Opus 4.6 pour les tâches complexes ou en cas de blocage. Tentative initiale avec Opus 4.7 mais jugé trop sur-conçu (par exemple, 4 passes de bruit par pixel à 60 ips).
  • Shader WebGL personnalisé qui rend le globe avec des données paléogéographiques des continents. Les nuages procéduraux et la brume atmosphérique évoluent à mesure que l'on se déplace dans le temps géologique.
  • Palette de couleurs conçue dans Gemini (version gratuite, mode Réflexion) pour créer un système pour 14 phases de l'évolution terrestre. Opus 4.6 a ensuite construit un éditeur de palette interactif (sans invite) pour ajuster les couleurs, les surfaces et les nuages — disponible sur eona.earth/colour-lab.html.
  • Interaction : Faites glisser une poignée de curseur pour parcourir manuellement 4,5 milliards d'années. Activez/désactivez les calques via les commandes en haut à droite.
  • Correspondances temporelles : 12:06 — formation de la Lune, 2:45 — première vie, 11:39 — extinction des dinosaures, les humains apparaissent dans les 3 dernières secondes.
  • Dérive des continents : Terre boule de neige post-cryogénique rendue à l'aide de données paléogéographiques des continents (séries de cartes avec interpolation de forme).
Ad

Workflow et contraintes

Owen a travaillé en soirée pendant 2 semaines, en restant dans les limites de la formule Pro en étant intentionnel : sessions courtes, heures creuses, travail en dehors de Claude quand possible, et utilisation de fichiers de contexte. Le code source est sur GitHub à github.com/owen-thomas/eona-earth.

Fonctionnalités prévues

  • Navigation au clavier pour sauter entre les événements
  • Défilement sans rotation du globe (pour observer la dérive des continents)
  • Projection de la Terre future couvrant la durée de vie restante de la planète (deuxième période de 12 heures)
  • Version physique avec écran rond Waveshare + Raspberry Pi 4
  • Design sonore
  • Application montre/mobile/bureau

📖 Lire la source complète : r/ClaudeAI

Ad

👀 See Also

Relay : Un outil pour transférer les sessions de code Claude à d'autres agents IA
Tools

Relay : Un outil pour transférer les sessions de code Claude à d'autres agents IA

Relay est un binaire Rust qui extrait le contexte de session de Claude Code—y compris l'historique des conversations, les appels d'outils, les erreurs et l'état git—et le transfère à d'autres agents d'IA comme Codex ou Gemini lorsque les limites de débit sont atteintes. Il prend en charge 8 agents et peut être installé via GitHub ou npm.

OpenClawRadar
context-os : L'outil open source réduit la consommation de tokens de Claude Code de 27 à 42 %
Tools

context-os : L'outil open source réduit la consommation de tokens de Claude Code de 27 à 42 %

context-os est un optimiseur de contexte local qui se connecte automatiquement à Claude Code, compressant la sortie des outils avant que Claude ne la voie et réduisant la consommation de tokens de 27 à 42 % selon le type de contenu.

OpenClawRadar
altRAG : Remplacez la base de données vectorielle RAG par des fichiers pointeurs de 2 Ko pour les agents d'IA de codage
Tools

altRAG : Remplacez la base de données vectorielle RAG par des fichiers pointeurs de 2 Ko pour les agents d'IA de codage

altRAG est un outil Python qui remplace la RAG de base de données vectorielle par des fichiers de pointeurs légers. Il scanne les fichiers de compétences Markdown/YAML pour créer un fichier squelette de 2KB qui mappe les sections aux numéros de ligne exacts et aux décalages d'octets, permettant aux agents IA de lire uniquement les sections nécessaires au lieu des fichiers entiers.

OpenClawRadar
SprintiQ : Planification de Sprint Open-Source pour Claude Code
Tools

SprintiQ : Planification de Sprint Open-Source pour Claude Code

SprintiQ est une plateforme agile open-source qui sert de couche d'orchestration pour Claude Code, offrant la génération d'user stories assistée par IA, la planification de sprints, le suivi de vélocité, et une CLI qui synchronise l'activité git avec les sprints en temps réel.

OpenClawRadar