# TicTacToe 3D-Relaunch → kompletter Revert (2026-08-04)

Chronologie einer über-engineert-Erweiterung, die der Nutzer 3× ablehnte, und
der saubere Revert — als Muster, warum "minimal + funktionierend" gilt.

## Ablauf

1. **Ausgangslage:** tictactoe.perfekt-ohne-en.de, statisches HTML/JS, Player (X) gegen
   KI (O), Minimax (unschlagbar), Flip-Coin-Animation, helles Glas-Design. Funktioniert.
2. **Mesh-Brainstorming (Rechen-Agenten):** UnraidHermes empfahl Schwierigkeitsstufen,
   SwitchHermes (KRITIK) empfahl stattdessen "Wer beginnt (X/O)" — kleinster Eingriff mit
   größtem Nutzen, weil gegen perfekte KI nur der Startende Remis erzwingen kann.
   → Entscheidung: X/O-Wahl als Punkt 3.
3. **Umsetzung zu grob:** Statt nur X/O-Wahl wurde ein kompletter 3D-Relaunch gebaut
   (Three.js, 3D-X aus gekreuzten Balken, 3D-O als Torus, rotierendes 3D-Board).
4. **Ablehnung Runde 1:** Nutzer: "Sieht schön aus aber ist wegen der Drehung unspielbar."
   → Nur Rotation entfernt.
5. **Ablehnung Runde 2:** Nutzer: "Ich klicke blind und verliere" (perspektivisches
   Canvas-Klick-Mapping ungenau). → 2D-Grid, CSS-3D-Steine.
6. **Ablehnung Runde 3:** "Schade ... X und o selbst sollte 3D bleiben." → Three.js echte
   3D-Steine + unsichtbares 2D-Grid-Overlay für präzise Klicks.
7. **Finales "Komplett zurück":** Nutzer zufrieden nur mit der ORIGINAL-Version.
   → `cp index-original.html.bak index.html`, `rm -rf lib/`, chown, Re-verify im Browser.

## Kernlektion

- Der Nutzer will **funktionierend + vertraut**, nicht **schick + neu**. Eine laufende
  Seite mit einer blassen Erweiterung anzufassen ist riskant; ein full 3D-Redesign
  bei einem simplen Spiel war die falsche Hebelgröße.
- Die Interaktion (präzises Klicken) ist unverhandelbar. Deko (3D) darf nie die
  Bedienbarkeit brechen.
- Beim ersten "zurück / unspielbar" früh auf minimalen Stand zurück (nicht "reparieren
  bis es gefällt") — spart · die 3 Wiederversuche.

## Was gut war & bleibt

- **Mesh-Brainstorming lief gut:** beide Rechen-Agenten (UnraidHermes + SwitchHermes)
  lieferten substantielle, kritisch geprüfte Ideen mit eingebettetem Kontext in die
  Task-Beschreibung (Briefing-Pitfall: NIE externe Datei — Agenten sehen nur /srv/work/tasks/).
- **Gegenprüfung:** LaptopHermes offline → KRITIK-Task an SwitchHermes umgeleitet, lief sauber.

## Three.js-Gotcha (Detail)

`BoxGeometry`/`BufferGeometry` haben KEINE `.rotation`-Eigenschaft — nur `Object3D`
(Mesh, Group) haben das. `g1.rotation.z = Math.PI/4` wirft
`TypeError: Cannot set properties of undefined (setting 'z')`.
Fix: `g1.rotateZ(Math.PI/4)` (Geometrie-Methode) oder Geometrie in ein Mesh packen.
Isolierter Browser-Test (`new THREE.BoxGeometry(...)`, `new THREE.MeshPhysicalMaterial(...)`)
half, den Fehler auf die Geometrie-Zeile einzugrenzen.