2023-08-15 · SOFTWAREENTWICKLUNG
GERRIDAJ: Visuelle Programmierung trifft Fertigung
Ein Browser-basiertes Werkzeug für parametrisches Design und CNC-CAM — das nicht nur Modelle baut, sondern die Werkzeuge, mit denen Modelle gebaut werden.
Auf einen Blick
Der Unterschied zum klassischen CAD ist fundamental: Sie zeichnen kein fertiges Modell, Sie definieren den Prozess, der das Modell erzeugt. Was in traditioneller Software Stunden manueller Nacharbeit bedeutet — eine geänderte Bohrung, eine andere Wandstärke — passiert hier in Sekunden durch Ändern eines einzigen Wertes. Ein einmal erstellter Graph kann tausende Varianten generieren.
GERRIDAJ bringt dieses Prinzip in den Browser: vollständig client-seitig, null Installation, inklusive CNC-Werkzeugpfad-Generierung direkt aus dem Graphen. Kein Cloud-Upload. Keine Latenz. Ein Werkzeug, das Werkzeuge baut.
Was ist visuelle Programmierung?
Stellen Sie sich vor, Sie bauen ein komplexes 3D-Modell — nicht durch Zeichnen von Linien und Flächen, sondern durch das Verbinden von Bausteinen auf einer Leinwand. Jeder Baustein ist eine Operation: „Erzeuge einen Würfel", „Verschiebe um 10 mm", „Bohre ein Loch an dieser Position". Die Verbindungen zwischen den Bausteinen definieren, wie Daten fließen — von der Eingabe zur Ausgabe, vom Rohentwurf zum fertigen Bauteil.
Das ist visuelle Programmierung: Statt Code zu schreiben, erstellen Sie einen Datenfluss-Graphen aus Knoten und Verbindungen. Ändern Sie einen Parameter — etwa die Größe des Würfels — und die Änderung propagiert automatisch durch den gesamten Graphen. Jede abhängige Operation wird neu berechnet. Das Ergebnis aktualisiert sich in Echtzeit.
Der Unterschied zum klassischen CAD ist fundamental. In traditioneller Software zeichnen Sie ein fertiges Modell. Wenn sich später eine Anforderung ändert — der Durchmesser einer Bohrung, die Dicke einer Wand — müssen Sie das Modell manuell anpassen oder sogar neu aufbauen. In einem visuellen Programmierwerkzeug ändern Sie einen Parameter und der gesamte Prozess läuft erneut ab. Das Modell ist nicht das Ergebnis — der Prozess ist das Ergebnis.
Warum parametrisches Design?
In der realen Fertigung sind Änderungen die Regel, nicht die Ausnahme. Ein Kunde möchte eine Variante mit anderen Abmessungen. Ein Materialwechsel erfordert andere Toleranzen. Eine neue Maschine hat einen anderen Bauraum. Jede dieser Änderungen bedeutet in traditionellem CAD: Modell öffnen, manuell editieren, prüfen, exportieren — oft Stunden Arbeit für eine scheinbar kleine Anpassung.
Parametrische Systeme drehen dieses Verhältnis um. Statt ein Modell zu bauen, definieren Sie Regeln, nach denen Modelle entstehen. Der Graph ist kein statisches Dokument — er ist eine formale Beschreibung des gesamten Konstruktionsprozesses. Einmal erstellt, kann er tausende Varianten erzeugen, automatisch optimieren und an neue Randbedingungen anpassen.
Das ist der entscheidende Paradigmenwechsel: Sie bauen nicht ein Ding — Sie bauen eine Maschine, die Dinge baut. Und genau dafür wurde GERRIDAJ entwickelt.
Was ist visuelle Programmierung — und warum ist sie so mächtig?
Visuelle Programmierung ersetzt Text durch Knoten und Verbindungen. Jeder Knoten ist eine Operation — eine geometrische Transformation, eine mathematische Berechnung, eine Datenabfrage. Verbindungen zwischen Knoten definieren den Datenfluss. Das Ergebnis ist ein gerichteter Graph, der nicht nur ein Modell beschreibt, sondern den gesamten Entstehungsprozess.
Der entscheidende Unterschied zum klassischen CAD: Ändert sich ein Parameter, propagiert die Änderung automatisch durch den gesamten Graphen. Das gesamte Modell wird neu berechnet — nicht nur eine einzelne Fläche oder Kante. Was in traditioneller Software Stunden manueller Nacharbeit bedeutet, passiert hier in Echtzeit.
Der Werkzeugmacher-Ansatz
Die meisten CAD-Programme sind Werkzeuge, mit denen man Objekte baut. GERRIDAJ geht einen Schritt weiter: Es ist ein Werkzeug, mit dem man Werkzeuge baut. Ein einmal erstellter Graph ist kein statisches Modell, sondern ein wiederverwendbarer Prozess. Ändern Sie die Eingabeparameter, und derselbe Graph erzeugt eine völlig neue Variante — sei es eine andere Geometrie, ein anderes Material oder eine andere Fertigungsstrategie.
Dieser Paradigmenwechsel von der Modellierung zur Prozessdefinition ist der Kern von parametrischem Design. Er ermöglicht es, ganze Produktfamilien aus einem einzigen Graphen abzuleiten, Fertigungsvarianten automatisch zu generieren und Designregeln formal zu kodifizieren.
Herausforderungen: UI, Zustandsmanagement, Echtzeit
Die Entwicklung eines visuellen Programmierwerkzeugs im Browser bringt drei fundamentale Herausforderungen mit sich.
Graphen-UI und Interaktion. Ein Knotengraph muss intuitiv navigierbar, zoombar und editierbar sein — bei Hunderten von Knoten und Verbindungen. Die Darstellung muss gleichzeitig Übersicht und Detail bieten: den großen Datenfluss erkennen lassen, aber einzelne Parameter sofort zugänglich machen. Das erfordert ein ausgeklügeltes Rendering mit Canvas oder WebGL, gepaart mit einer DOM-basierten Overlay-Schicht für Formulare und Eingaben.
Zustandsmanagement. Jede Änderung im Graphen löst eine Kaskade von Neuberechnungen aus. Verbindungen werden getrennt, Werte propagiert, Abhängigkeiten neu aufgelöst. Das zugrunde liegende Datenmodell muss Zyklen erkennen, Teilgraphen isolieren und inkrementelle Updates ermöglichen — alles innerhalb eines einzelnen Browser-Threads, ohne die UI blockieren zu dürfen.
Echtzeit-3D und Performance. Geometrische Berechnungen — boolesche Operationen, Mesh-Triangulation, Kollisionserkennung — sind rechenintensiv. Im Browser bedeutet das: Web Worker für parallele Berechnungen, effiziente Datenstrukturen für den Transfer zwischen Worker und Haupt-Thread, und ein 3D-Viewport (Three.js/WebGL), der auch bei komplexen Szenen flüssig bleibt.
Warum im Browser?
Ein visuelles Programmierwerkzeug als Webanwendung zu bauen, ist anspruchsvoller als eine native Desktop-Anwendung. Aber die Vorteile überwiegen.
Null Installation. Kein Download, keine Abhängigkeiten, keine Betriebssystem-Kompatibilität. Ein Link genügt, und der gesamte Workspace steht bereit.
Kollaboration in Echtzeit. Browser-basierte Architekturen erlauben es, Graphen zu teilen, gemeinsam zu bearbeiten und Ergebnisse live zu diskutieren — ohne Dateiversionen per E-Mail zu verschicken.
Plattformunabhängigkeit. Windows, Mac, Linux, Tablet — überall dieselbe Engine, dasselbe Verhalten. Keine plattformspezifischen Bugs, keine unterschiedlichen Builds.
Immer aktuell. Updates passieren serverseitig. Nutzer arbeiten immer mit der neuesten Version, ohne sich um Patches oder Upgrades kümmern zu müssen.
Integration in bestehende Workflows. Über eine API oder eingebettete iFrames lässt sich der visuelle Editor direkt in bestehende Web-Plattformen, Shops oder interne Tools integrieren.
UX: Verbinden und Trennen ohne Frust
Wer schon einmal mit einem Knoten-Editor gearbeitet hat, kennt das Problem: Sie ziehen eine Verbindung von einem Ausgangsport, navigieren durch einen Graphen mit hunderten von Knoten, zoomen und scrollen zum Ziel — nur um festzustellen, dass der Port nicht kompatibel ist. Oder Sie wollen eine bestehende Verbindung lösen und müssen erst das Kontextmenü öffnen, den richtigen Eintrag finden, bestätigen. Bei komplexen Graphen wird das zur Geduldsprobe.
GERRIDAJ geht hier einen radikal anderen Weg. Unser Smart-Connection-System erkennt beim Ziehen einer Verbindung automatisch den nächsten kompatiblen Port in der Nähe des Cursors — unabhängig davon, wie weit die Knoten im Graphen voneinander entfernt sind. Kein manuelles Zielen auf einen winzigen Port. Kein Scrollen durch den gesamten Graphen. Die Verbindung findet ihr Ziel von selbst.
Für das Trennen von Verbindungen haben wir eine ebenso intuitive Lösung entwickelt: eine Schnittgeste. Eine schnelle, horizontale Wischbewegung über eine bestehende Verbindung trennt diese sofort — ohne Menü, ohne Dialog, ohne Bestätigung. So einfach, wie man eine Linie auf Papier durchstreicht.
Diese beiden Mechaniken — intelligentes Auto-Connect und gestenbasierte Trennung — sind nicht nur Komfort-Features. Sie sind der Unterschied zwischen einem Werkzeug, das man benutzt, und einem, das man liebt.
Parametrik für die Fertigung: Vom Graphen zur Maschine
GERRIDAJ endet nicht beim 3D-Modell. Der Graph kann auch Werkzeugpfade definieren — für CNC-Fräsen, Roboter oder andere G-Code-gesteuerte Maschinen. Jeder einzelne Wegpunkt entlang eines Pfades lässt sich parametrisch kontrollieren: Vorschub, Drehzahl, Temperatur, Verweildauer — alles als Knoten im Graphen, alles änderbar, alles propagierend. Ein einziger Graph beschreibt das Bauteil und den Weg, es herzustellen.
Durch die parametrische Natur des Systems lassen sich Fertigungsstrategien an Materialänderungen, Werkzeugwechsel oder Toleranzanforderungen anpassen — ohne den gesamten CAM-Prozess neu aufsetzen zu müssen. Jeder Parameter auf jedem Wegpunkt ist eine Variable im Graphen. Der Graph denkt mit.
Technische Architektur im Überblick
Warum wir das erzählen
GERRIDAJ ist kein Produkt, das wir verkaufen. Es ist der Nachweis, dass wir komplexe interaktive Webanwendungen mit anspruchsvollen technischen Anforderungen entwickeln können — von der Graph-Engine über das Zustandsmanagement bis zum Echtzeit-3D-Rendering. Wenn Ihr Unternehmen eine Plattform, ein Tool oder eine Anwendung benötigt, die jenseits von Standard-CMS und Baukastensystemen liegt, dann haben wir die Architekturprinzipien bereits in der Praxis bewiesen.
Für Ihr Projekt: Wenn Ihre Anforderungen kein Standardprodukt von der Stange erfüllt, bauen wir das, was es braucht — sauber, performant, zukunftssicher.
UX: Dokumentation direkt am Knoten
Ein häufiges Problem in visuellen Programmierwerkzeugen: Sie fügen einen Knoten ein, sehen einen Namen und ein paar Ports — aber was der Knoten tatsächlich tut, welche Eingaben er erwartet, welche Ausgaben er produziert, bleibt unklar. Die Dokumentation existiert vielleicht irgendwo — in einem Handbuch, auf einer Webseite, in einem Tooltip, den man erst suchen muss. Der Workflow wird unterbrochen.
In GERRIDAJ ist die Dokumentation eines jeden Knotens direkt am Knoten selbst aufrufbar — kein Menü, kein Kontextklick, kein separates Fenster. Ein einziger Klick auf das Info-Icon des Knotens öffnet eine eingebettete Ansicht mit Beschreibung, Parameter-Details, Beispielen und erwarteten Ein- und Ausgabetypen. Alles, was Sie wissen müssen, um den Knoten korrekt zu verwenden, ist genau dort, wo Sie es brauchen — an dem Ort, an dem Sie gerade arbeiten.
Das spart nicht nur Zeit, es verhindert Fehler. Falsch verbundene Ports, missverstandene Parameter, inkompatible Datentypen — all das passiert seltener, wenn die Information unmittelbar verfügbar ist. Es ist ein scheinbar kleines Detail mit großer Wirkung auf die Benutzererfahrung.
Vom Graphen zum Konfigurator: Parametrik für den Kunden
Ein vollständiger Knotengraph ist mächtig — aber für einen Endkunden, der nur seine individuelle Variante eines Produkts konfigurieren möchte, ist er überfordernd. Hunderte Knoten, Dutzende Parameter, technische Details — zu viel, zu komplex.
GERRIDAJ löst das durch Abstraktion: Jeder Graph kann als vereinfachter Konfigurator exportiert werden. Sie definieren, welche Parameter für den Endnutzer sichtbar sind — etwa Länge, Breite, Material — und legen für jeden Parameter sinnvolle Grenzen fest. Der komplexe Graph im Hintergrund wird auf eine handvoll Schieberegler und Auswahlfelder reduziert. Der Kunde sieht nur, was für seine Entscheidung relevant ist.
Dieser abstrahierte Konfigurator wird als einbettbarer iframe bereitgestellt — vollständig anpassbar, mit eigenem Branding, einbettbar auf jeder Website oder in jedem Shop. Der Kunde konfiguriert seine Variante selbst, sieht das Ergebnis live in 3D, und die gewählten Parameter werden direkt erfasst. Kein E-Mail-Pingpong mit „Könnten Sie das noch 3 cm länger machen?". Keine manuellen Anpassungen in der CAD-Software. Der Kunde liefert die Spezifikation, das System liefert das Modell.
Das beschleunigt den Kaufprozess erheblich: Von der ersten Produktidee zur fertigen Spezifikation in Minuten statt Tagen. Und weil alle Parameter mit definierten Grenzen versehen sind, kann der Kunde nichts konfigurieren, was technisch nicht umsetzbar ist.