Buzzwoo’ Arbeit mit KI: Künstliche Intelligenz und digitales Design

Der Einsatz von KI-Technologie im Tagesgeschäft des UX/UI-Teams bietet mehrere Vorteile, von der Rationalisierung der Arbeitsabläufe bis hin zur Verbesserung unseres kreativen Outputs. 

Da wir ein sehr kleines Designteam sind und das Unternehmen in erster Linie Kunden mit eher technischen Projekten betreut, können wir nicht das gesamte Spektrum an UX- und UI-Dienstleistungen anbieten. Mit dem Aufkommen der KI-Tools bot sich uns die einmalige Gelegenheit, unseren Horizont zu erweitern und neue Dienstleistungen anzubieten, die bis vor kurzem nicht möglich waren.

Wir begannen unser Vorhaben, indem wir uns zunächst unseren aktuellen und zugegebenermaßen einfachen UX/UI-Workflow angesehen haben. Dann fügten wir alle fehlenden Schritte hinzu und kamen zu dem folgenden Gesamtablauf für unseren allgemeinen UX/UI-Prozess:

• Recherche betreiben
• Den Benutzer definieren
• Informationsarchitektur
• Wireframing
• Erstellung von Inhalten
• Visuelles Design
• Usability-Tests

Bei der Integration von KI ins Tagesgeschäft ist es wichtig, die richtigen Tools und Technologien zu wählen, die zu den Zielen des Unternehmens und den spezifischen Anforderungen der jeweiligen Projekte passen. Wir haben jedoch einen eher ganzheitlichen Ansatz gewählt, indem wir den passenden UX/UI-Flow für den Kunden entwickelt haben. So ist es für uns leichter, den Flow an die Bedürfnisse unserer Kunden anzupassen. 

Nachdem wir den optimalen UX/UI-Flow erstellt hatten, mussten wir nun für jeden Schritt mindestens ein KI-Tool finden. Bei einigen Schritten erwies sich das als ziemlich schwierig. Abgesehen von einigen fehlenden Teilen sind wir nun theoretisch in der Lage, 90% unseres Workflows mit KI-Tools abzudecken. Das sagt aber noch nichts über die Qualität des Outputs dieser KI-Tools aus.

Forschung

Schritte

• Erstellen/Bestätigen einer Geschäftsidee
• Brainstorming
• Marktforschung
• Zielpublikum
• Schmerzpunkte
• USPs
• Namensfindung
• Benutzer-Interviews
• Benutzerumfrage
• Datenanalyse
• Präsentation/Pitch Deck

Die Recherche war schon immer ein sehr zeitaufwändiger und mühsamer Prozess für uns, aber jetzt können wir ihn praktisch im Handumdrehen mit nur einem KI-Tool bewältigen. Unser bevorzugtes Tool für den „Research“ ist ChatGPT, da es jeden Schritt des Prozesses im Alleingang abdeckt. 

ChatGPT analysiert riesige Mengen an Marktdaten, um aufkommende Trends, Kundenstimmungen und Wettbewerbseinblicke usw. zu ermitteln, die sich auf unsere Designentscheidungen und -strategien auswirken können.

Es ist jedoch von entscheidender Bedeutung, KI-generierte Erkenntnisse zusammen mit menschlichem Fachwissen zu interpretieren, um ein umfassendes Verständnis des Marktes zu gewährleisten. Nicht alles, was ChatGPT angibt, ist zwangsläufig sinnvoll oder richtig, und es liegen auch die jeweiligen Daten, auf denen die Ergebnisse basieren, liegen in der Regel nicht vor. Dennoch kann KI die Marktforschungsbemühungen durch die Automatisierung zeitaufwändiger Aufgaben und die Bereitstellung datengestützter Erkenntnisse ergänzen, sodass fundiertere Design- und Geschäftsentscheidungen getroffen werden können.

<Add screenshot of ChatGPT answer>

Definieren Sie den Benutzer

Schritte

• Benutzer-Personas
• User Journeys
• Benutzergeschichten

Die Definition des Nutzers eines Produkts ist ein wichtiger Schritt im Design- und Entwicklungsprozess.

Dank ChatGPT wird dies aber zu einem einfachen und schnellen Prozess, denn User Personas, User Journeys und User Stories lassen sich innerhalb kürzester Zeit und mit nur wenig Aufwand erstellen. Durch die Nutzung dieser Strategien und Erkenntnisse können wir ein benutzerzentriertes Produkt erstellen, das mit den Bedürfnissen und Erwartungen der Zielgruppe übereinstimmt, was letztendlich zu einer besseren und erfolgreicheren Benutzererfahrung führt.

<Add screenshot of ChatGPT answer>

Informationsarchitektur

Schritte

• Sitemap
• Benutzerflüsse
• Papier-Prototyp
• Benutzer-Tests

Die Strukturierung und Organisation der Informationen innerhalb des Produkts ist für eine einfache Navigation und Auffindbarkeit unerlässlich. Durch die Erstellung von Sitemaps, User Flows und mehr stellen wir sicher, dass das Produkt den Bedürfnissen und Zielen der Nutzer entspricht.

Es ist wichtig zu verstehen, dass die Erstellung einer effektiven Informationsarchitektur ein fortlaufender Prozess ist, der sich mit den Bedürfnissen der Benutzer und deren Feedback weiterentwickelt. Wir können die Informationsarchitektur nun einfach und regelmäßig bewerten und verfeinern, um einen nutzerzentrierten Ansatz beizubehalten und das Nutzererlebnis fortlaufend zu verbessern.

   
<Screenshot of Relume and ChatGPT answer>

Wireframing

Schritte

• Wireframes
• Usability-Tests
• Heat Maps

Die Erstellung von Wireframes mit KI-Tools bietet Vorteile wie Schnelligkeit und Konsistenz. Allerdings sind den Möglichkeiten von KI in diesem Zusammenhang gewisse Grenzen gesetzt. 

KI-Tools sind in der Regel regelbasiert und stützen sich auf bestehende Designmuster. Sie haben Schwierigkeiten, innovative oder kreative Wireframe-Layouts zu erstellen, die mit konventionellen Design-Paradigmen brechen. KI-Tools verstehen auch den spezifischen Kontext, die Bedürfnisse der Benutzer oder die Besonderheiten der Branche eines Projekts nicht vollständig. Dies kann zu Wireframes führen, denen es an Relevanz mangelt oder die den einzigartigen Anforderungen eines Designs nicht gerecht werden. Je einfacher die Wireframes sind, z. B. für eine Produkt-Landingpage, desto besser werden die Ergebnisse sein.

   
<Screenshot of Relume>

Erstellung von Inhalten

Schritte

• Bildmaterial
• Illustrationen
• Produktfotos
• Menschen generieren
• Die KI trainieren
• Bilder bearbeiten
• Visuelle Effekte
• 3D
• Bild-Upscaler
• Icons
• Kopieren
• Videos
• Audio
• Animationen
• Übersetzungen

Der Einsatz von KI-Tools zur Erstellung von Inhalten bietet mehrere Vorteile, die das Endprodukt verbessern und den Designprozess optimieren können. 

KI-Tools sind natürlich äußerst effizient und können visuelle Inhalte schnell und in großem Umfang erstellen. Das spart uns viel Zeit und Mühe, insbesondere bei der Erstellung einer großen Anzahl von Bildern. 
Hinzu kommt, dass KI eine Vielzahl verschiedener Arten von Bildern, Videos, Audiodateien, Animationen, Icons, Infografiken, 3D-Inhalte, Texte und Diagramme erstellen kann, was es uns ermöglicht, unsere Inhalte zu diversifizieren und unser Publikum effektiver anzusprechen.

Schließlich tragen KI-Tools dazu bei, die Kosten für Routineaufgaben im Bereich visueller Inhalte zu senken und uns so mehr Zeit für anspruchsvollere Aufgaben zu verschaffen.

<Screenshot>

Visuelle Gestaltung

Schritte

• Websites in bearbeitbare Designs umwandeln
• Moodboards
• Farben
• Tippfehler
• Logo
• Interface-Design
• Styleguide
• Interaktiver Prototyp
• Mockups
• Video-Dokumentation

Wir alle haben schon einmal auf den Bildschirm gestarrt, ohne dass uns auch nur eine Idee gekommen ist. An dieser Stelle kann KI perfekt einspringen und die Leere im Kopf mit frischen visuellen Ideen füllen. Im Moment liefert uns die KI noch keine perfekten Schnittstellendesigns, sie bietet jedoch eine Menge Inspiration, um unseren kreativen Prozess in Gang zu halten.

Darüber hinaus kann KI eine Vielzahl zeitaufwändiger und sich wiederholender Designaufgaben automatisieren, z. B. die Erstellung von Layoutvorlagen, die Auswahl von Farbschemata und die Optimierung von Designelementen für unterschiedliche Bildschirmgrößen und -auflösungen. Wenn man beispielsweise eine App sowohl für Android- als auch für iOS-Plattformen entwerfen muss, die jeweils unterschiedliche Bildschirmgrößen und Auflösungen haben, können KI-gestützte Tools das jeweilige Design automatisch an diese unterschiedlichen Dimensionen anpassen und auf diesem Weg jede Menge Zeit ersparen. Dies beschleunigt nicht nur den Designprozess, sondern sorgt auch für ein konsistentes Design auf verschiedenen Geräten, was zu einem nahtlosen und einheitlichen Benutzererlebnis führt.

Erstellen Sie ein Logo mit dem Text „Honey“ in einem fetten, einfarbigen Hintergrund

Erstellung eines Website-Designs für einen unabhängigen Hersteller von Honig. Illustrativer Stil. Einfarbiger Hintergrund.

Prüfung der Benutzerfreundlichkeit

Schritte

• Visuelle Design-Tests
• Usability-Tests
• Heat Maps
• Aufzeichnungen
• A/B-Tests
• SEO-Analysator

Usability-Tests werden oft nicht beachtet, für uns spielen sie jedoch eine große Rolle. Zu testen, bevor die Entwickler überhaupt einen ersten Blick auf das Oberflächendesign werfen können, bietet einen enormen Mehrwert und spart eine Menge Zeit. 

Durch den Einsatz von KI bei Usability-Tests können wir Tests effizienter durchführen, wertvolle Daten sammeln und Erkenntnisse darüber gewinnen, wie Nutzer mit unserem digitalen Produkt interagieren. Dieser datengestützte Ansatz hilft uns, fundierte Designentscheidungen zu treffen und die Benutzerfreundlichkeit der jeweiligen Website kontinuierlich zu verbessern, um den Bedürfnissen und Vorlieben der Nutzer gerecht zu werden.

Zusammenfassung

Design ist ein zutiefst menschlicher Prozess, der durch den übermäßigen Einsatz von KI-Tools gefährdet ist: Designer könnten ihre kreative Note verlieren, wenn kreative Aufgaben vollständig automatisiert werden. Andererseits brauchen KI-generierte Arbeiten menschliche Designer mit ihrem Fachwissen, ihren Emotionen, ihrem Einfühlungsvermögen in die Nutzer und ihrem Verständnis der Projektziele, um die Ergebnisse zu validieren. KI-Werkzeuge können uns Designer unterstützen, aber sie können das kritische Denken und die Problemlösungsfähigkeiten menschlicher Designer nicht ersetzen. 

Dank der KI können wir …

… neue Dienstleistungen für unsere Kunden anbieten
… schneller beginnen
… schneller iterieren
… unseren Output steigern
… Inhalte erstellen und bearbeiten
… endlose Inspirationen und Ideen finden
… lästige und zeitaufwändige Aufgaben abgeben

Bei der Integration von KI in Ihr Tagesgeschäft ist es wichtig, die richtigen Tools und Technologien auszuwählen, die zu den Zielen der Agentur und den spezifischen Anforderungen der jeweiligen Projekte passen. Darüber hinaus sollten dem Designteam Schulungen und Ressourcen zur Verfügung gestellt werden, damit es effektiv mit KI-Tools arbeiten kann, da dies für eine erfolgreiche Implementierung entscheidend ist. 

Möchten Sie mehr darüber erfahren, wie wir generative KI im UX/UI-Design einsetzen? In unserem Artikel “Generative KI im UXI: Einblicke zum Thema Design & KI aus erster Hand” teilt unsere UX/UI-Designerin ihre persönlichen Erfahrungen in einem spannenden Interview und zeigt Ihnen detailliert, wie wir den kreativen Prozess mit KI-Tools optimieren. Entdecken Sie aus erster Hand, wie auch Sie Ihre Design-Workflows durch KI auf die nächste Stufe heben können.