Verknüpfung von User Stories und GUI-Prototyping: Wie Künstliche Intelligenz den Designprozess vereinfacht

Die Erstellung grafischer Benutzeroberflächen (GUIs) ist ein entscheidender Schritt in der Softwareentwicklung. Besonders in agilen Entwicklungsumgebungen werden User Stories als zentraler Bestandteil des Anforderungsmanagements genutzt. Doch die Verbindung zwischen textbasierten User Stories und visuellen GUI-Prototypen ist oft mühsam und fehleranfällig. Hier setzt ein neuer Ansatz an: Durch den Einsatz von Large Language Models (LLMs) wird die Lücke zwischen Anforderungen und Prototypen geschlossen. Dies ermöglicht die automatische Validierung von User Stories und die Bereitstellung konkreter Vorschläge zur Umsetzung.

Die vorgestellte Methode verfolgt zwei Hauptziele: Erstens, die automatisierte Prüfung, ob funktionale User Stories in einem GUI-Prototyp bereits umgesetzt sind, und zweitens, die Empfehlung von GUI-Komponenten zur Umsetzung noch nicht implementierter Anforderungen.

1. Automatische Validierung von User Stories:
   Durch eine semantische Analyse von GUI-Prototypen und User Stories werden fehlende Implementierungen erkannt. Der Prozess basiert auf Zero-Shot- und Few-Shot-Lernansätzen, bei denen das LLM trainiert wird, natürliche Sprache (User Stories) mit einer abstrahierten Darstellung der GUI zu verknüpfen. Die Ergebnisse der Studie zeigen eine hohe Präzision und Recall-Werte, die bestätigen, dass LLMs in der Lage sind, relevante User Stories zuverlässig zu identifizieren.
2. Empfehlung von GUI-Komponenten:
   Fehlende Anforderungen werden nicht nur identifiziert, sondern es werden auch konkrete Vorschläge zur Implementierung geliefert – in der Form von HTML/CSS-Code oder Domain-Specific Languages (DSL), die direkt in Prototyping-Tools wie Figma integriert werden können.
3. Interaktive Integration:
   Der Ansatz sieht eine direkte Integration in Prototyping-Tools vor. Nutzer können innerhalb des Tools eine Übersicht aller User Stories erhalten, den Erfüllungsstatus überprüfen und empfohlene Änderungen direkt anwenden. Dies fördert eine interaktive und iterative Arbeitsweise zwischen Designern und Stakeholdern.

Die Evaluation des Ansatzes zeigt beeindruckende Ergebnisse: Die automatisierte Erkennung von User Stories erreicht eine hohe Genauigkeit, und die empfohlenen GUI-Komponenten wurden von Prototyping-Experten als hilfreich und relevant bewertet. Besonders hervorzuheben ist die Fähigkeit der LLMs, semantische Zusammenhänge zwischen Anforderungen und GUI-Elementen zu erkennen, selbst wenn diese implizit sind.

Mit der LLM-basierten Methode wird der Prototyping-Prozess erheblich beschleunigt und vereinfacht. Entwickler und UX-Designer können sich stärker auf kreative und strategische Aufgaben konzentrieren, während wiederholende und fehleranfällige Aufgaben von der KI übernommen werden.

Die Integration solcher Systeme in bestehende Prototyping-Tools könnte den gesamten Designprozess revolutionieren. Perspektivisch lassen sich auch weitere Anwendungsmöglichkeiten vorstellen, wie z. B. die automatische Generierung vollständiger Prototypen aus einer Sammlung von User Stories oder die Kombination mit generativen KI-Modellen für visuelle Designs.

Weitere Information zu dem Thema finden Sie in der folgenden wissenschaftlichen Publikation:

Kolthoff, K.; Kretzer, F.; Bartelt, C.; Maedche, A.; Ponzetto, S. P. (2024). Interlinking User Stories and GUI Prototyping: A Semi-Automatic LLM-Based Approach. 2024 IEEE 32nd International Requirements Engineering Conference (RE). Ed.: IEEE, 380–388, Institute of Electrical and Electronics Engineers (IEEE). doi:10.1109/RE59067.2024.00045