Dachassistent

Ein Vibe-Coding Prototyp
Der Dachassistent ist eine fortschrittliche Erweiterung für eine bestehende Dachplanungssoftware. Ziel dieses Projekts war es, eine völlig standortunabhängige Lösung zu schaffen, die den Arbeitsalltag der Nutzer spürbar erleichtert. Egal ob auf dem Smartphone, dem Tablet oder am Desktop-PC – Nutzer können essenzielle Planungsdaten flexibel von überall aus vorausfüllen. Das spart nicht nur wertvolle Zeit, sondern reduziert auch den administrativen Aufwand erheblich. Sobald die Vorarbeit abgeschlossen ist, werden die Projekte nahtlos und direkt in die Haupt-Dachplanungssoftware übertragen.

Ein Prototyp, der sich wie fertige Software anfühlt

Um die Vision des Dachassistenten greifbar zu machen, wurde sich bewusst gegen einen klassischen, statischen Klick-Dummy entschieden. Stattdessen kam beim Prototyping ein „Vibe Coding“-Ansatz in Kombination mit Figma Make zum Einsatz. Dieser interaktive Prototyp bringt die Vorzüge einer echten, gecodeten Software mit sich. Er reagiert dynamisch, fühlt sich für den Anwender real an und erlaubt es, komplexe Interaktionen authentisch abzubilden, bevor auch nur eine einzige Zeile finaler Produktionscode geschrieben wurde.

KI-gestütztes Design und effiziente Entwickler-Übergabe

Ein spannender Aspekt dieses Projekts war die Integration von künstlicher Intelligenz in den Designprozess, da UI-Elemente in das finale Screendesign übernommen werden konnten. Um die visuelle Konsistenz zur Hauptsoftware zu wahren, wurde der gesamte Prototyp auf der Grundlage von MUI aufgebaut. Diese strategische Entscheidung sorgte nicht nur für ein einheitliches Look & Feel, sondern lieferte den Entwicklern auch eine perfekte Basis. Vorgefertigten Bausteine und das klare System machten die spätere technische Implementierung deutlich teilweise angenehmer.

Validierung durch Nutzerfeedbacks

Durch die hohe Realitätsnähe der gecodeten Umgebung konnten wir den Dachassistenten frühzeitig in Usability-Tests mit echten Nutzern auf die Probe stellen. Dieses direkte Feedback war entscheidend, um die User Experience zu validieren, Reibungspunkte zu identifizieren und die Bedienbarkeit gezielt zu optimieren, bevor das Produkt in die finale Entwicklungsphase ging.

Interaktiver Prototyp

Probier es selbst aus!

Erlebe den interaktiven Figma-Make-Prototyp direkt im Browser und teste den Konfigurator selbst.

Interaktiven Prototyp starten