HelloDesign®
Mosbacher Straße 9, 65187 Wiesbaden
info@hellodesign.de+49 151 420 18517

Die Potenziale und Grenzen von KI im UI-Design-Prozess

Wie relevant ist AI für UI-Designer:innen heute? Welche AI-Modelle lösen heute schon praktische Probleme? Was sind die wichtigsten AI-Skills für Designer:innen?

Die Potenziale und Grenzen von KI im UI-Design-Prozess
Elia Faber
21.4.2024

Die Potenziale und Grenzen von KI im UI-Design-Prozess

Inhalt

Dieser Beitrag ist als Teil 2 des Beitrags KI in Designprozessen. Dieser Beitrag kann ohne das Vorwissen aus Teil 1 gelesen werden, für mehr Kontext empfehle ich aber, nach diesem Beitrag den ersten zu lesen.

  1. Wie relevant ist AI für UX-Designer:innen heute?
  2. Meine Top-Picks der AI-Modelle und welche Probleme sie lösen.
  3. Case Study: Warum können AIs keine Vektoren generieren?
  4. Die wichtigsten AI-Skills für Designer:innen
  5. Fazit

Wie relevant ist AI für UX-Designer:innen heute?

Die kurze Zusammenfassung dieses Absatzes ist: Man kann zum Zeitpunkt der Veröffentlichung dieses Beitrags immer noch ein hervorragender UX-Designer sein, auch wenn man in keiner Phase seines Designprozesses mit künstlicher Intelligenz arbeitet. 

Damit meine ich: Aktuell gibt es kein Problem, das eine künstliche Intelligenz löst, das nicht auch von einem Menschen gelöst werden kann. Das bedeutet allerdings nicht, dass ein Mensch eine Aufgabe auch am effizientesten und ressourcenschonendsten erfüllt. Wer schon einmal ein User Testing durchgeführt hat, wird wissen, mit welcher Menge an Daten man sich nach Beendigung des Testings konfrontiert sieht. Diese müssen erneut gelesen und evaluiert werden, es müssen Handlungen abgeleitet werden, diese werden priorisiert und dann vielleicht in ein System wie Jira überführt werden. Je nach Umfang des User Testings und der Ergebnisse kann allein dieser Teil des Prozesses zwischen einem Tag und einer Woche andauern. 

Das Auswerten großer Daten ist für Menschen schlichtweg anstrengend. Aber passt eben genau in die Natur einer künstlichen Intelligenz. Seit knapp eineinhalb Jahren teste ich fast jeden Step meines Designprozesses auf Kompatibilität mit verschiedenen AI-Modellen. Dabei merke ich natürlich, dass sich einige Steps hervorragend eignen an AI abgegeben zu werden, manche passen gar nicht, und manche möchte ich einfach nicht abgeben. 

Ich weiß dass ich mit vielen Tools Wireframes basierend auf einer User Journey erstellen lassen kann, allerdings habe ich festgestellt, dass es mir beim Skizzieren von Wireframes vor allem darum geht, Gedanken so schnell wie möglich aus meinem Kopf auf Papier zu bringen. Papier eignet sich für mich hier tatsächlich auch am besten, einfach aufgrund der Geschwindigkeit. Gedanken aber zuerst in einen Prompt zu übersetzen und danach das Ergebnis auf Kongruenz zu meinen Vorstellungen zu testen, hat sich für mich als deutlich anstrengender und zeitaufwendiger herausgestellt. Wie relevant also AI für UX-Designer:innen heute ist, hängt vor allem davon ab, welchem Zeitrahmen man unterworfen ist, und der eigenen Einschätzung und Vorliebe, wer die Herausforderung besser lösen kann.

Meine Top-Picks der AI-Modelle und welche Probleme sie lösen.

Um es vorweg zu nehmen: ChatGPT und Midjourney wird nicht in dieser Liste auftauchen. Nicht weil ich sie nicht regelmäßig nutze, ich habe aber das Gefühl, dass jeder, der bereits mit AI arbeitet, auch mit diesen beiden Modellen arbeitet und deren Kompetenzen erforscht hat. Hier also die AI-Modelle die mich in meinem Designprozess am besten unterschtützen.

Attention Insight

Attention Insight benutze ich als Plugin für Figma, um mir schnelles Feedback über Nutzer-Zentriertheit und Product Performance einzuholen. Meine Designs werden von Attention Insight analysiert und bekommen ein Heatmap-Overlay, das mir direkt einen Eindruck davon gibt, welche Elemente meines Designs erfasst werden und welche eher untergehen. Diese Analyse eignet sich übrigens auch hervorragend, um Design-Entscheidungen gegenüber Stakeholdern zu kommunizieren.

VanceAI - Image Upscaler

Der Image Upscaler von Vance AI kommt nicht gerade hübsch daher, wer aber darüber hinwegsehen kann, bekommt den besten AI-basierten Image Upscaler, den ich bisher getestet habe. Man kann (AI-generierte) Bilder ganz einfach von mäßiger Web-Auflösung auf brillante Print-Qualität hochskalieren, ganz ohne seltsame Artefakte und mit genau der richtigen Menge an Einstellungsmöglichkeiten.

Generative Fill in Photoshop

Die generative AI von Photoshop ist das Tool dass ich jahrelang gebraucht habe, ohne zu wissen dass ich es gebraucht habe. Ich benutze es nicht mal dafür elaborierte Composings zu kreieren, sondern um genau diese Kleinigkeiten zu erledigen, die früher immer aufwändig und langwierig waren und das Ergebnis dafür aber nicht überwältigend war. Einfache Dinge, wie zum Beispiel das Erweitern eines Bild für eine Card-Komponente oder um eine minimale Retusche an einem Bild vorzunehmen, damit es für mein Projekt genau richtig ist.

FigJam AI

Die eingebaute AI im Whiteboard-Tool von Figma hat es mir ermöglicht, in wenigen Minuten Design-Sprint Workshops vorzubereiten, Roadmaps auszuarbeiten und Ergebnisse von User Testings zusammenzufassen. Alles Aufgaben, die sonst Tage füllen würden. Allein für diese Zeitersparnisse ist die integrierte AI in FigJam für mich und meinen Designprozess Gold wert.

Case Study: Warum können Ais keine Vektoren generieren?

Ein Problem, für das ich noch nicht das passende AI Modell gefunden habe, ist das Generieren von Vektordaten, beispielsweise für Logos, Illustrationen oder Icons. 

In den vergangenen Wochen habe ich mit meinen Kolleg:innen ein umfassendes Design System für einen Kunden aufgesetzt. Der Kunde hat erst kürzlich ein Rebranding seiner Marke durchgeführt und dafür auch einen einzigartigen Icon-Stil entworfen. Im Design Systeme haben wir allerdings für einige Komponenten noch weitere Icons benötigt, die im Icon Set noch nicht existierten. Uns kam daraufhin der Gedanke dass mit all den kürzlich veröffentlichten Image-generating AIs doch mit Sicherheit eine dazu fähig sein sollte, an einem existierenden Icon Stil trainiert zu werden, um dann im entsprechenden Stil neue Icons, in komplett editierbaren Vektordaten, zu generieren. Diese Annahme wurde zunächst auch davon gestützt, dass große Player wie Adobe schon Anfang letzten Jahres AI-Modelle angekündigt haben, die genau das ermöglichen sollten. Wir haben uns also in die Recherche begeben und wurden leider relativ schnell ernüchtert. 

Es gibt zwar einige kleine unabhängige Unternehmen, die sich gerade mit genau dieser Thematik auseinandersetzen, aber scheinbar hatte jeder der Anbieter eine Einschränkung entweder in seinem Modell oder in dem Willen, eine Kollaboration mit uns und unserem Kunden zu beginnen. Große, bereits getestete und veröffentlichte Modelle zur Generierung von Vektordaten nach unseren Anforderungen konnten wir überhaupt nicht identifizieren. 

Die konkreten Anforderungen, die wir hatten, waren, wie bereits angesprochen, relativ überschaubar: Das Modell muss Vektordaten ausgeben (Dateiformat vorerst irrelevant) und es muss auf einen individuellen, spezifischen Stil trainierbar sein.

Viele davon haben durchaus das Potential unsere aktuelle Herausforderung in der Zukunft zu lösen, sind aber schlichtweg aktuell noch nicht an diesem Punkt angelangt. Aber warum ist das eigentlich so? Warum haben sich seit dem Boom der generativen AI-Modelle der letzten beiden Jahre, noch keine hervorgetan, die in der Qualität Vektordaten erzeugen kann, wie beispielsweise Midjourney V6.0 pixelbasierte Bilder generiert?

Die drei Hauptursachen, die ich identifizieren, sind:

1. Die Komplexität von Vektordaten

Vektorgrafiken werden durch mathematische Gleichungen definiert, die Formen, Pfade und Kurven beschreiben. Im Gegensatz zu Rastergrafiken, wie JPGs und PNGs, die aus einzelnen Pixeln bestehen, bestehen Vektorgrafiken aus skalierbaren geometrischen Grundelementen wie Punkten, Linien und Kurven. Generative KI-Modelle glänzen typischerweise bei der Generierung von Pixel-basierten Bildern, haben jedoch Schwierigkeiten mit den präzisen mathematischen Berechnungen, die für Vektorgrafiken erforderlich sind. Die Modellierung der komplexen Beziehungen zwischen verschiedenen Elementen in Vektorgrafiken stellt deshalb bis heute eine große Herausforderung dar, da diese Art Generierung schlicht nicht der Funktionsweise von generativen AIs, Stand heute, entspricht.

2. Der Mangel an Trainingsdaten

Generative KI-Modelle sind stark auf große Datensätze angewiesen, um Muster in den Eingabedaten zu lernen und zu replizieren. Es gibt jedoch einen Mangel an leicht verfügbaren Trainingsdaten für vektorbasierte Bilder im Vergleich zu Rasterbildern. Während es Datenbanken von Rasterbildern mit unterschiedlichen Stilen, Auflösungen und Inhalten gibt, sind ähnlich umfassende Datensätze für Vektorgrafiken weniger verbreitet. Die begrenzte Verfügbarkeit von hochwertigen Trainingsdaten beeinträchtigt die Fähigkeit der generativen KI, präzise vektorbasierte Bilder zu generieren. Während der Entwicklung von Modellen wie Midjourney konnte die AI bereits auf frei verfügbare Datensätze von Millionen von pixelbasierter Bilder zugreifen und darauf trainiert werden. Dieser Faktor wird sich voraussichtlich jedoch mit fortschreitender Zeit von selbst erledigen.

3. Der Verlust von Editierbarkeit und Flexibilität

Ein Vorteil von Vektorgrafiken ist ihre inhärente Skalierbarkeit und Bearbeitbarkeit. Im Gegensatz zu Rasterbildern, die an Qualität verlieren, wenn sie vergrößert werden, können Vektorgrafiken ohne Detailverlust skaliert werden. Darüber hinaus ermöglichen Vektorgrafiken eine einfache Manipulation einzelner Elemente (z.B. Skalierung, Rotation, Verzerrung), ohne die Gesamtqualität des Bildes zu beeinträchtigen. Generative KI-Modelle haben jedoch oft Schwierigkeiten, die Editierbarkeit von Vektorgrafiken während des Bildgenerierungsprozesses zu bewahren. Die Umwandlung generierter Bilder in bearbeitbare Vektorformate unter Beibehaltung ihrer ursprünglichen Qualität stellt eine bedeutende technische Herausforderung für KI-Algorithmen dar.

Die wichtigsten AI-Skills für Designer:innen

Es gibt einige Skills, die AIs gerade im Designbereich noch nicht zuverlässig bieten können, neben dem Generieren von Vektorgrafiken. AIs können nicht die Subjektivität menschlicher Entscheidungsfindung replizieren und tun sich deshalb auch schwer damit, Designs zu entwickeln, die einerseits einzigartig sind, aber auch individuelle und spezifische User Probleme lösen. Das liegt daran, dass AIs auf riesigen Datensätzen trainiert sind, aber deshalb eben keine Edge-Cases vorhersagen, oder auf ein sehr spezielles Problem keine sinnvolle Antwort liefern können.

1. Stetige Design-Optimierung

AIs sind perfekt dafür geeignet, große Mengen an User Daten und design-orientierte KPIs zu beobachten, Insights zu sammeln, Verhaltensmuster zu erkennen und aus all diesen Daten Verbesserungsvorschläge abzuleiten, die zum Beispiel zu verbesserter Usability und Barrierefreiheit beitragen können. Menschen fällt es im Gegensatz oft schwer, diese Daten über einen langen Zeitraum zuverlässig zu sammeln und zu organisieren, aber aus diesen Erkenntnissen dann Handlungen und Verbesserungen am Design abzuleiten, ist genau das, was Designer:innen am besten können und was wir am meisten lieben.

2. Erstellen von User Personas

Durch die große Mengen an gesammelten Daten auf die viele AI-Modelle zurückgreifen, können sie bei der Erstellung detaillierter Benutzer-Personas und der Segmentierung von User-Populationen auf der Grundlage verschiedener demografischer, psychografischer und verhaltensbezogener Merkmale unfassbar nützlich sein. Durch die Analyse von Nutzerdaten aus verschiedenen Quellen, einschließlich Umfragen, Interviews und Web-Interaktionen, können KI-Algorithmen unterschiedliche Nutzersegmente identifizieren und Nutzerprofile erstellen. Dies ermöglicht es UX Researchern, ein tieferes Verständnis ihrer Zielgruppe zu erlangen und die UX auf spezifische Bedürfnisse und Vorlieben der verschiedenen Nutzer:innen präzise zuzuschneiden.

3. Content-Generierung für Prototypen

Ich bin nicht der größte Fan von AI-generierten Texten. Ich habe es in der Vergangenheit einige Male ausprobiert mit unterschiedlich komplexen Prompts, bin aber mit dem Ergebnis nie wirklich glücklich gewesen. Wenn es jedoch um das Entwickeln von Prototypen, vor allem für data-driven Applications, wie Dashboards, E-Commerce Plattformen oder CMS geht, habe ich mich doch sehr davon hinreißen lassen, wie einfach es ist, mit AI Prototypen mit Content lebendig werden zu lassen. Diese Möglichkeit hat für mich in meinem Design-Prozess die Verwendung von Placeholder-Lorem-Ipsum Texten komplett abgelöst.

Abschließend lässt sich festhalten, dass KI im UX-Design eine bedeutende Rolle spielt, aber nicht als Ersatz für menschliche Kreativität und vor allem Urteilsvermögen gesehen werden sollte oder auch nur bereit dafür wäre. Ich halte es für extrem relevant, die Stärken und Grenzen von AIs zu verstehen und sie gezielt im Designprozess einzusetzen, um das bestmögliche Ergebnis zu erzielen und die besten Produkte für User zu kreieren.

Die Potenziale und Grenzen von KI im UI-Design-Prozess
Elia Faber
April 21, 2024
Digital Product Designer & UX Experte