Anatomy: Interaktive isometrische Maschinen als Erklärungsmodelle für Claude Code

LinkRyanTool

Anatomy ist ein Skill für Claude Code, der abstrakte technische Konzepte anhand konkreter, interaktiver isometrischer Maschinen visualisiert. Statt auf klassische Kasten-und-Pfeil-Diagramme setzt das Werkzeug auf das Prinzip, dass das physische Objekt selbst die Funktionsweise verkörpert.

Das Wichtigste

  1. Grundprinzip 'The object is the explanation': Konzepte werden als funktionierende mechanische Vorrichtungen mit mindestens 40 Einzelteilen ohne freischwebende Beschriftungen oder Boxen dargestellt.
  2. Vollständig modellierte Interaktion: Zahlen und Bewegungsabläufe basieren auf echten mathematischen bzw. logischen Modellen, die Eingaben per Maus und Tastatur verarbeiten.
  3. Drei Ausbaustufen: Figuren reichen von Standard-Figuren (40 bis 80 Teile, 30 bis 90 Minuten Laufzeit) über Hero-Modelle (bis 150 Teile) bis hin zu Epics für vollständige Konstruktionen.
  4. Ausgabeformate: Der Skill erzeugt frameworkfreies TypeScript mit SVG und HTML oder React-Komponenten für Next.js, optional ergänzt durch WebGL-Shader oder dreidimensionale Projektionen.

Warum das relevant ist

Abstrakte Software- und Systemkonzepte wie Caching, Mutex-Sperren oder TCP-Handshakes sind oft schwer intuitiv zu vermitteln. Indem Claude Code diese Mechanismen in detailreiche mechanische Analogien und interaktiven Code übersetzt, entsteht eine neuartige Form der technischen Dokumentation und Wissensvermittlung.

Einordnung

Entwickler Ryan zeigt mit Anatomy, wie autonome Programmieragenten über längere Zeitspannen hinweg konsistente, komplexe visuelle Systeme generieren können. Bemerkenswert ist der standardisierte, strikte Entwurfsprozess: Vor der Geometrieberechnung definiert Claude zunächst das mathematische Verhaltensmodell, plant die Tiefe und setzt auf strenge visuelle Richtlinien wie isometrische 30-Grad-Winkel, vier Schattierungsstufen und Barrierefreiheit. Dies belegt das wachsende Potenzial von KI-Tools, nicht nur Codebausteine zu liefern, sondern eigenständige didaktische Erklärungsartefakte zu konstruieren.

Gefunden in

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 16. Oktober 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Inhaltlich ähnlich, ermittelt über die KI-Suche.

  • Repository:wheresryan22/anatomy

    Anatomy: Agent-Skill für isometrische SVG- und WebGL-Visualisierungen

    Anatomy ist ein Open-Source-Skill für Claude Code, OpenCode und Codex, der abstrakte technische Konzepte als detaillierte physische Maschinen visualisiert. Das Tool generiert interaktive isometrische Grafiken auf Basis von SVG, optionalen WebGL-Shadern und 3D-Effekten.

    6585SterneJavaScript

    KI & AI· Tool

  • X-Post:Meng To

    Anatomy: Agent-Skill für animierte, isometrische SVG-Erklärungen

    Meng To demonstriert das Open-Source-Agent-Skill 'Anatomy' von Entwickler Ryan (@wheresryan22). Damit können KI-Coding-Assistenten wie Claude Code interaktive, isometrische SVG- und WebGL-Visualisierungen erzeugen.

    3419Lesezeichen101.470Aufrufe

    KI & AI· Tool

  • X-Post:Guillermo Rauch

    Anatomy: Interaktive 3D-Modelle per Prompt für Claude

    Guillermo Rauch teilt das Open-Source-Projekt Anatomy von Entwickler R (@wheresryan22). Das Tool lässt sich als Agent-Skill für Claude installieren und generiert aus einzeiligen Beschreibungen interaktive, dreidimensionale Drahtgittermodelle von Maschinen.

    2245Lesezeichen218.525Aufrufe

    KI & AI· Demo

  • Repository:tt-a1i/archify

    Archify: Interaktive Architektur- und Systemdiagramme für KI-Coding-Agenten

    Archify ist ein quelloffenes Node.js-Rendering- und Validierungssystem, das als Skill für Coding-Agenten wie Cursor, Claude Code, Codex CLI und OpenCode dient. Agenten erzeugen eine typisierte JSON-Zwischendarstellung (IR), die Archify deterministisch in interaktive, eigenständige HTML- und SVG-Dateien sowie Bild- und Videoformate kompiliert.

    45.490SterneJavaScript

    KI & AI· Tool

Lassen Sie uns über Ihr Projekt sprechen

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Dieser Inhalt wurde teilweise mithilfe von KI erstellt.