Uniweb

Interaktionsdesign ist die Gestaltung der Interaktion zwischen dem Benutzer und dem Produkt.

2025/10/27

Was ist Interaktionsdesign?

Interaktionsdesign (IxD) ist die Gestaltung der konkreten „Interaktion“ zwischen Nutzern und digitalen Produkten, Systemen oder Dienstleistungen. Mit „Interaktion“ sind hier die konkreten Handlungen gemeint, die Nutzer bei der Bedienung eines Produkts oder Systems ausführen (Klicken, Tippen, Eingeben usw.), sowie die Reaktionen, die das System darauf zurückgibt (Änderungen auf dem Bildschirm, Anzeige von Nachrichten, Wiedergabe von Tönen usw.).

Ziel des Interaktionsdesigns ist es, den Nutzern zu ermöglichen, Produkte und Systeme effektiv und effizient zu bedienen. Daher ist es notwendig, bei der Nutzung von Produkten, Systemen und Dienstleistungen die zur Erreichung des Ziels erforderlichen Handlungen verständlich zu machen und ein Design zu entwickeln, das Fehlbedienungen verhindert.

In jüngster Zeit wird Interaktionsdesign in Produkten und Dienstleistungen verschiedenster Bereiche immer stärker als wichtig angesehen. In diesem Artikel stellen wir daher konkrete Beispiele vor und erläutern ausführlich das Interaktionsdesign, einschließlich der Hintergründe, warum es so wichtig geworden ist, sowie des tatsächlichen Gestaltungsprozesses.

Typische Erfolgsbeispiele für Interaktionsdesign: „Apple-Produkte“ und „Nintendo Switch“

Zunächst möchte ich „Apple-Produkte“ und die „Nintendo Switch“ als konkrete Beispiele für Interaktionsdesign vorstellen.

Erfolgsbeispiel 1: Apple-Produkte

Als typisches Erfolgsbeispiel für Interaktionsdesign sind zunächst Apple-Produkte zu nennen.Apples einzigartiges, aus Nutzerperspektive entwickeltes, schlichtes und intuitives Design findet nicht nur in den eigenen Produkten, sondern auch in zahlreichen anderen Produkten Anwendung.

Betrachtet man das Interaktionsdesign von Apple-Produkten, so lassen sich die folgenden zwei Punkte als gemeinsame Merkmale der Produkte feststellen.

◆Wichtige Aspekte des Interaktionsdesigns bei Apple-Produkten

・Das Design wird schlicht gehalten und ist so gestaltet, dass Nutzer es sofort verstehen und bedienen können
・Bei der Bedienung wird großer Wert auf visuelles und haptisches Feedback gelegt, wodurch den Nutzern ein Gefühl von Sicherheit vermittelt wird

Nun möchte ich anhand der drei typischen Apple-Produkte – iPhone, Mac und Apple Watch – deren Besonderheiten im Bereich des Interaktionsdesigns erläutern.

Merkmal 1: Die iPhone-Oberfläche

Die Wertvorstellungen in Bezug auf Mobiltelefone in Japan haben sich durch die Einführung des iPhones erheblich verändert. Als Anfang der 2000er Jahre das erste iPhone auf den Markt kam, waren in Japan bis dahin vor allem Feature-Phones, sogenannte „Garakei“, verbreitet, und auch die wenigen bereits existierenden Smartphones waren in der Regel mit physischen Tasten oder einem Stylus (Touchpen) ausgestattet.

Das iPhone nutzt jedoch Multitouch-Technologie und führte eine Touchscreen-Oberfläche ein, die sich intuitiv mit den Fingern bedienen lässt.

Anstatt wie bisher Tastenfunktionen lernen zu müssen, wurde die Bedienung durch Gesten wie Wischen, Tippen und Pinchen intuitiv gestaltet, sodass Nutzer sie leicht erlernen konnten.Auch die Reaktionen auf diese Eingaben, etwa Animationen beim Drücken von Icons oder die flüssige Bewegung beim Scrollen des Bildschirms, waren ausgereift, wodurch den Nutzern eine hohe Bedienfreundlichkeit vermittelt wurde.

Dadurch wurde intuitive Bedienbarkeit zum Standardwert von Smartphones, und auch andere Unternehmen begannen, ähnliche Touch-Oberflächen einzuführen. Mit anderen Worten: Die iPhone-Oberfläche revolutionierte als äußerst herausragendes Interaktionsdesign die UX grundlegend und wurde zum Industriestandard.

Merkmal 2: Das Dock des Mac

Das „Dock“ ist eine der Standardfunktionen von Mac OS und dient als Werkzeug zum Starten, Wechseln und Aufrufen von Anwendungen, die auf dem Mac-Desktop angezeigt werden. Unten sehen Sie eine Abbildung, auf der das Dock tatsächlich auf dem Desktop eines MacBook angezeigt wird. Achten Sie bitte auf die linke Seite des Bildschirms.

◆Das MacBook-Dock

So werden App-Icons groß dargestellt, und wenn sich der Mauszeiger nähert, ändern sie sich animiert in der Größe, sodass auf einen Blick erkennbar ist, welche App ausgewählt werden kann.Auch das Hinzufügen und Entfernen von Apps lässt sich per Drag-and-drop mit der Maus intuitiv erledigen.

Durch dieses Design konnten auch Computeranfänger Anwendungen ganz einfach verwalten und so die Benutzerfreundlichkeit des Mac verbessern.

Merkmal 3: Die Digital Crown der Apple Watch

Die Apple Watch verfügt über einen als „Digital Crown“ bezeichneten Regler, der wie die Krone einer Armbanduhr geformt ist. Da die Bedienung der Apple Watch auf einem kleinen Bildschirm erfolgt, ist die Bedienung allein über den herkömmlichen Touchscreen teilweise schwierig. Aus diesem Grund wurde ein drehbarer Knopf namens „Digital Crown“ an der Seite der Uhr integriert. Sehen Sie sich das folgende Bild an.

◆Bedienung der Apple Watch über die Digital Crown

Auf diese Weise ist es möglich, durch Drehen der Digital Crown ganz einfach zu scrollen sowie hinein- und herauszuzoomen. Wenn man sie tatsächlich dreht, spürt man ein klickendes Feedback, das dem Nutzer eine klare Rückmeldung über das Drehen gibt.

Obwohl es sich um ein kleines Gerät wie eine Armbanduhr handelt, wird durch solche raffinierten Lösungen eine reibungslose und intuitive Bedienung ermöglicht, was das Benutzererlebnis erheblich verbessert.

Auf diese Weise verfolgt Apple stets die Perspektive der Nutzer und strebt bei allen Produkten ein Design an, das als „für jeden leicht zu bedienen“ und „angenehm“ empfunden wird. Daher ist das Interaktionsdesign von Apple für viele Menschen attraktiv und benutzerfreundlich und hat auch zahlreiche Produkte anderer Unternehmen beeinflusst.

Erfolgsbeispiel ② Nintendo Switch

Neben den Produkten von Apple ist ein weltweit hoch geschätztes Beispiel im Bereich des Interaktionsdesigns Nintendos „Nintendo Switch“. Die Nintendo Switch erschien als Hybrid-Spielekonsole aus stationärer und tragbarer Konsole und erweiterte durch ein innovatives Interface-Design den Erlebniswert von Spielen erheblich.

Besonders hervorzuheben sind „ein intuitives Bedienkonzept“ und „das Gefühl der Einheit mit dem physischen Gerät“.

◆Wichtige Aspekte des Interaktionsdesigns für die Nintendo Switch

・Der flexible Bedienstil durch die Joy-Con (abnehmen, trennen, zusammenfügen) verleiht dem Nutzererlebnis Vielfalt und Freiheit
・Interaktionen, die Haptik und visuelle Wahrnehmung ansprechen, wie HD-Rumble und die IR-Kamera, verstärken das Gefühl der Einheit mit dem Spiel
・Die UI ist einfach gestaltet, sodass sie von jedem bedient werden kann, und richtet sich an ein breites Spektrum von Nutzern, von Spieleinsteigern über Kinder bis hin zu älteren Menschen

Betrachtet man das Produkt aus der Perspektive des Interaktionsdesigns, spielt der spezielle Controller „Joy-Con (Joy-Con)“ eine große Rolle. Im Folgenden werden die Merkmale der Joy-Con erläutert.

Merkmal ① Wandelbare Schnittstelle durch die Joy-Con

Das größte Merkmal der Nintendo Switch liegt darin, dass die Joy-Con-Controller vom Hauptgerät abgenommen und je nach Nutzungssituation in ihrer Form verändert werden können. So verändert sich die Schnittstelle selbst je nach Spielstil, etwa im „TV-Modus“, in dem man auf einem großen Fernseher spielt, im „Handheld-Modus“, in dem man das gesamte Gerät mitnimmt, oder im „Tischmodus“, in dem das Gerät aufgestellt und die Joy-Con getrennt verwendet werden.

Außerdem ermöglicht das horizontale Halten der Joy-Con sogar einen Zwei-Spieler-Modus auf einer einzigen Switch; dass die Form der Hardware direkt mit der Flexibilität der UX verbunden ist, kann auch aus Sicht des Interaktionsdesigns als eine äußerst einzigartige Eigenschaft bezeichnet werden.

Merkmal ② Gestaltung von haptischem und visuellem Feedback

Die in den Joy-Con integrierte HD-Vibrationsfunktion unterscheidet sich von einfacher Vibration und bildet Bewegungen von Wassertropfen oder das Gewicht eines Balls realistisch nach. Außerdem erhöhen mehrere Feedback-Elemente wie visuelle, taktile und bewegungsbezogene Rückmeldungen, etwa die Erkennung von Handgesten mithilfe einer Motion-IR-Kamera, die Immersion des Gameplays.

Nintendo Switch ist auf diese Weise ein Produkt, das die Eigenschaften des physischen Geräts und das UI/UX-Design auf Softwareseite auf hohem Niveau miteinander verbindet und ist als Erfolgsbeispiel für Interaktionsdesign äußerst aufschlussreich.

Quelle: Nintendo Switch Support Joy-Con (Nintendo-Support)

Beispiel für ein gescheitertes Interaktionsdesign

An dieser Stelle möchte ich auch einige Beispiele für missglücktes Interaktionsdesign vorstellen. Sehen Sie sich zunächst bitte das Folgende an.

◆ Beispiele für eine „Stornierung der Stornierung“

Abbrechen des Abbrechens

Dies ist ein häufig genanntes Beispiel für ein gescheitertes UI, das als „Abbrechen des Abbrechens“ bezeichnet wird. Vielleicht haben auch Sie schon einmal auf dem Smartphone einen solchen Dialog gesehen und waren irritiert.

Wenn man sich die linke Schaltfläche „キャンセル“ ansieht, kann unklar sein, ob damit das „Abbrechen des Vorgangs“ abgebrochen wird oder der „ursprüngliche Vorgang“ selbst, was zu Verwirrung bei den Nutzern führen kann.

Auch ich selbst war durch diese Anzeige schon einmal nicht mehr in der Lage zu erkennen, ob ich „den Vorgang abgebrochen“ oder „das Abbrechen des Vorgangs rückgängig gemacht“ hatte. Dadurch wird unklar, in welchem Schritt was abgebrochen wurde, sodass es für den Nutzer schwierig wird, den aktuellen Zustand zu erfassen.

Als Verbesserungsmaßnahme für diesen Fall könnte man beispielsweise die Frage „Möchten Sie den Vorgang abbrechen?“ mit den Antwortmöglichkeiten „Nein“ und „Ja“ versehen, um Verwirrung beim Benutzer zu vermeiden.

Beim Interaktionsdesign ist Vorsicht geboten, da man, wie in diesem Beispiel, wenn man es versäumt, das Design aus Nutzersicht zu überdenken, die Bedienung unnötig kompliziert machen kann.

Hintergründe für die zunehmende Bedeutung des Interaktionsdesigns

Im vorangegangenen Abschnitt haben wir am Beispiel von Apple-Produkten konkrete Beispiele für Interaktionsdesign vorgestellt. Dass diesem Design heute so große Bedeutung beigemessen wird, hat unter anderem den Hintergrund, dass in jüngster Zeit in verschiedenen Bereichen „Barrierefreiheit“ und „angemessene Vorkehrungen“ gefordert werden.

Barrierefreiheit bedeutet, Produkte und Dienstleistungen so zu gestalten, dass sie von allen Menschen, einschließlich Menschen mit Behinderungen und älteren Personen, genutzt werden können; angemessene Vorkehrungen bedeuten, je nach den Bedürfnissen des einzelnen Nutzers geeignete Unterstützung bereitzustellen. Um dies zu erreichen, wird die Denkweise des Interaktionsdesigns äußerst wichtig.

Barrierefreiheit und angemessene Vorkehrungen durch Interaktionsdesign

Im Folgenden werden die durch Interaktionsdesign ermöglichten „Verbesserungen der Barrierefreiheit“ und die „Bereitstellung angemessener Vorkehrungen“ konkret erläutert.

◆Verbesserung der Barrierefreiheit

Interaktionsdesign bildet die Grundlage dafür, Produkte und Dienstleistungen für alle leicht nutzbar zu machen. Wenn beispielsweise sehbehinderte Menschen mit einem Screenreader eine Website aufrufen, können sie die Informationen korrekt verstehen, wenn die Benutzeroberfläche angemessen gestaltet ist. Dies ist Teil der Barrierefreiheit; wenn man dies bereits in der Designphase berücksichtigt, kann man eine Umgebung schaffen, die für alle Menschen unabhängig von einer Behinderung leicht zugänglich ist.

Darüber hinaus sind Maßnahmen wie die Verwendung passender Beschriftungen für Schaltflächen und Links – beispielsweise „Senden“ oder „Buchen“ – sowie die Wahl einer Farbpalette, die auch für Nutzer mit Farbsehschwäche gut erkennbar ist, wichtige Elemente im Interaktionsdesign, um die Barrierefreiheit zu verbessern.

◆Bereitstellung angemessener Vorkehrungen

Durch die Berücksichtigung angemessener Vorkehrungen im Interaktionsdesign können einzelne Nutzer Produkte und Dienstleistungen auf eine für sie passende Weise verwenden.Indem man beispielsweise auf einer Website die freie Anpassung der Textgröße ermöglicht, Untertitel für Videos bereitstellt oder eine Schnittstelle einführt, die Spracherkennungstechnologie nutzt, werden angemessene Vorkehrungen durch Interaktionsdesign, das auf vielfältige Nutzer eingeht verwirklicht.

Das Gesetz zur Beseitigung von Diskriminierung von Menschen mit Behinderungen wurde geändert, und seit April 2024 ist die Bereitstellung angemessener Vorkehrungen verpflichtend; dadurch wird in allen Bereichen wie Produkten, Dienstleistungen und Websites verlangt, allen Nutzern eine faire und leicht nutzbare Erfahrung zu bieten.

Vor diesem Hintergrund gewinnt Interaktionsdesign zunehmend an Bedeutung und wird nicht nur als rein visuelles Design, sondern als wichtiger Faktor zur Schaffung einer inklusiven Nutzererfahrung, die für alle zugänglich ist betrachtet.

Quelle: Faltblatt zu angemessenen Vorkehrungen (Kabinettamt)

Als Nächstes werde ich nun auf die gestalterischen Aspekte des Interaktionsdesigns eingehen.

Die fünf Grundsätze des Interaktionsdesigns

Im Interaktionsdesign gibt es als grundlegende Leitlinien für die Gestaltung fünf Prinzipien. Diese werden neben „Prinzipien“ auch als „Dimensionen“ bezeichnet.

Die fünf Prinzipien des Interaktionsdesigns (fünf Dimensionen)

Prinzip 1: Wörter (Words)
Prinzip 2: Visuelle Darstellungen (Visual Representations)
Prinzip 3: Physische Objekte oder Räume (Physical Objects or Space)
Prinzip 4: Zeit (Time)
Prinzip 5: Verhalten (Behavior)

Ich werde diese fünf Punkte nun nacheinander erläutern.

Prinzip 1: Wörter (Words)

Damit sind die „Wörter“ gemeint, die zwischen dem Nutzer und einem Produkt oder System verwendet werden, etwa Beschriftungen, Button-Texte, Navigationsmenüs oder Anweisungen. Die Wahl geeigneter Worte hat großen Einfluss darauf, wie Nutzer ein Produkt oder eine Dienstleistung verstehen und bedienen. Durch die Verwendung verständlicher und klarer Worte können Nutzer ihr Ziel ohne Verwirrung erreichen.

Daher müssen die Wörter im Interaktionsdesign „für alle verständlich und nicht mit schwierigen oder fachlichen Begriffen versehen“ sowie „geeignet, die richtige Bedeutung zu vermitteln“ sein.

Prinzip 2: Visuelle Darstellungen (Visual Representations)

Es handelt sich um visuelle Elemente wie Icons, Bilder, Typografie sowie Farben und Layouts. Visuelle Darstellungen ordnen Informationen und geben Nutzern Hinweise zur Bedienung und fördern das Verständnis des Kontexts. Wenn dieses Design visuell ansprechend und intuitiv ist, werden das Verständnis und die Bedienung für Nutzer reibungsloser.

Wenn sich beispielsweise die Farbgebung wichtiger Schaltflächen auf einer Website von der der anderen unterscheidet, lassen sich diese fehlerfrei bedienen; durch die dreidimensionale Darstellung lässt sich zudem intuitiv erkennen: „Das ist eine Schaltfläche.“

Prinzip 3: Physische Objekte oder Raum (Physical Objects or Space)

Damit sind physische Geräte gemeint, mit denen Nutzer hauptsächlich digitale Produkte bedienen, sowie Elemente der Benutzeroberfläche, die auf dem Bildschirm angezeigt werden und berührt werden können. Typische Beispiele hierfür sind Touch-Gesten auf dem Bildschirm von Smartphones und Tablets, die Bedienung eines Computers mit der Maus oder VR-Headsets.

Beispielsweise kann man bei einer Schaltfläche auf dem Bildschirm dem Nutzer vermitteln, dass sie „anklickbar“ ist, indem man am Computer den Cursor über die Schaltfläche bewegt und ihr so eine Bewegung verleiht. Auf Smartphones und Tablets ohne Maus oder auch bei VR-Headsets muss das Design jedoch so gestaltet sein, dass allein durch visuelle Informationen erkennbar ist, dass sie anklickbar ist.

Auf diese Weise ist es möglich, den Nutzern eine benutzerfreundliche und wirksame Erfahrung zu bieten, indem man die Geräte und physischen Einschränkungen versteht und ein darauf abgestimmtes Design entwickelt.

Prinzip 4: Zeit (Time)

Dabei handelt es sich um Elemente, die sich im Laufe der Zeit verändern, einschließlich Animationen und Übergängen (Szenenwechsel) als Reaktion auf Benutzeraktionen sowie Audio.

Konkret handelt es sich dabei um Animationen, bei denen sich das Symbol vergrößert und gleichzeitig zum App-Bildschirm wechselt, wenn man die App auf dem Smartphone öffnet, oder um fließende Slide- und Fade-Effekte beim Wechsel zwischen Seiten. Weitere Beispiele sind der Balken oder das sich drehende Symbol, die beim Laden einer Webseite den Ladefortschritt anzeigen, sowie Animationen, die beim Hochladen von Dateien den Fortschritt in Echtzeit darstellen.

Diese Elemente zeigen dem Nutzer, dass der Vorgang korrekt fortschreitet, verbessern die Benutzererfahrung und steigern die Benutzerfreundlichkeit sowie die Zufriedenheit.

Prinzip 5: Verhalten (Behavior)

Es beschreibt, wie das System auf eine Aktion des Nutzers reagiert und wie das System selbst den Nutzer zu einer Aktion anregt. Im Folgenden einige einfache Beispiele für „Verhalten“.

◆ Was passiert, wenn eine Schaltfläche gedrückt wird?
Wenn sich in einer Smartphone-App beim Drücken einer Schaltfläche deren Farbe für einen kurzen Moment ändert oder der gesamte Bildschirm zur nächsten Seite wechselt, dann sind die Aktion „der Nutzer drückt die Schaltfläche“ und die Reaktion „das System ändert die Farbe und wechselt den Bildschirm“ das „Verhalten“.

◆ Zeitpunkt der Anzeige von Benachrichtigungen und Nachrichten
Wenn in einer E-Mail-App bei Eingang einer neuen E-Mail eine Benachrichtigung auf dem Bildschirm als Popup erscheint, dann ist es das „Verhalten“ des Systems, wenn es beim Empfang einer neuen E-Mail mit „Sie haben eine E-Mail erhalten“ informiert.

◆ Reaktion auf Swipe- und Tippbewegungen
Wenn in einer Foto-App beim Wischen eines Fotos zum nächsten Bild das Foto sanft in die Richtung gleitet, in die der Nutzer seinen Finger bewegt, dann ist die Reaktion des Systems „das Foto bewegt sich reibungslos“ auf die Aktion „der Nutzer wischt“ das „Verhalten“.

Je reibungsloser und natürlicher ein solches „Verhalten“ ist, desto benutzerfreundlicher wirkt es auf den Nutzer und desto besser ist die Erfahrung.

Die Beziehung zwischen Interaktionsdesign und UX (User Experience)

Manche Menschen, die die fünf Grundprinzipien des Interaktionsdesigns kennen, verstehen vielleicht, dass „Interaktionsdesign im Grunde dasselbe wie UX ist“. Allerdings sind Interaktionsdesign und UX eng miteinander verbunden, haben jedoch jeweils unterschiedliche Aspekte.

Interaktionsdesign bedeutet, die „Wechselwirkung“ zwischen Nutzern und Produkten oder Dienstleistungen zu gestalten. Ziel ist es, zu überlegen, wie Nutzer ein Produkt bedienen und wie das System auf diese Bedienung reagiert, um reibungslose und intuitive Interaktionen zu schaffen.

UX hingegen bezeichnet die „Gesamterfahrung“, die Nutzer bei der Verwendung eines Produkts oder einer Dienstleistung empfinden. Dazu gehören die Zufriedenheit der Nutzer, die Benutzerfreundlichkeit, die Emotionen gegenüber dem Produkt und der Eindruck von der Marke. Es umfasst nicht nur das Aussehen und die Bedienbarkeit, sondern alle Erfahrungen des Nutzers von vor Beginn bis nach dem Ende der Nutzung eines Produkts.

◆Der Zusammenhang zwischen Interaktionsdesign und UX

Das Verhältnis zwischen Interaktionsdesign und UX「

So versteht man unter Interaktionsdesign die Interaktion zwischen dem Nutzer und einem Produkt oder einer Dienstleistung über eine Benutzeroberfläche, und die Eindrücke und Emotionen, die der Nutzer dabei empfindet, bilden die UX.

Das bedeutet, dass Interaktionsdesign die „momentane Erfahrung“ gestaltet, die Nutzer bei der Bedienung eines Produkts haben, während UX die „Gesamterfahrung“ gestaltet, die diese Bedienung einschließt. Daher kann Interaktionsdesign als Teil von UX und als eines der wichtigen Elemente betrachtet werden, die die gesamte UX ausmachen.

Im Folgenden werde ich nun den Prozess der Erstellung von Interaktionsdesign erläutern.

Die vier Prozesse des Interaktionsdesigns

Bei der Erstellung von Interaktionsdesign lässt sich der Prozess grob in vier Schritte unterteilen.

◆Der Prozess des Interaktionsdesigns

Prozess 1 Recherche: Informationssammlung, um die Bedürfnisse und Probleme der Nutzer zu verstehen.
Prozess 2 Ideenfindung: Die Phase, in der Ideen entwickelt werden, um den Bedürfnissen der Nutzer gerecht zu werden.
Prozess 3 Prototyping: Die Phase, in der aus Ideen ein Prototyp entsteht, der praktisch getestet werden kann.
Prozess 4 Testen und Verbessern: Die Phase, in der Nutzer das Design ausprobieren, Feedback gegeben wird und das Design verbessert wird.

Wir werden die einzelnen Prozesse im Detail erläutern.

Prozess 1: Recherche

Dies ist die Phase, in der Probleme im Zusammenhang mit der Interaktion (dem Austausch) ermittelt werden, etwa die Bedürfnisse und Schwierigkeiten der Nutzer. Sie schafft die Grundlage dafür, dass das endgültige Design den Erwartungen der Nutzer entspricht und benutzerfreundlich ist. Zu den konkreten Aktivitäten gehören Nutzerforschung, Wettbewerbsanalyse sowie die Erstellung typischer Nutzerprofile (Personas) auf Grundlage der gesammelten Daten.

Prozess 2: Ideenfindung

Auf der Grundlage der in der Recherche gewonnenen Informationen ist dies die Phase, in der Ideen entwickelt und konkrete Lösungen gefunden werden, um auf die Bedürfnisse und Herausforderungen der Nutzer einzugehen. Um die Ideen sichtbar zu machen, wird das Grundgerüst des Designs aufgebaut, indem etwa Bildschirmlayouts und die Struktur der Benutzeroberfläche tatsächlich skizziert werden.

Durch die Visualisierung der Abläufe, die Nutzer bei der Verwendung von Produkten oder Dienstleistungen ausführen, lässt sich ordnen, welche Interaktionen erforderlich sind, und durch diesen Prozess wird das Konzept des Produkts konkretisiert.

Prozess ③ Prototyping

Bei den im Ideenfindungsprozess erarbeiteten Interaktionen handelt es sich um die Phase, in der Mockups und Wireframes erstellt werden, um sie in eine Form zu bringen, die Nutzer tatsächlich bedienen können, und sie auszuprobieren. Es werden tatsächlich Prototypen erstellt, um die Funktionsweise und die Interaktionen des Produkts zu simulieren.

Beim Prototyping läuft es zunächst so ab, dass mit Papier oder einem Whiteboard einfache Skizzen der Bildschirme und der Benutzeroberfläche erstellt werden. Anschließend wird mit einem Entwicklungstool ein Prototyp mit Interaktionen erstellt, die dem tatsächlichen Produkt nahekommen.

Prozess ④ Testen und Verbessern

Dabei lassen Sie den Prototypen tatsächlich von Nutzern verwenden und prüfen, ob das Interaktionsdesign wirksam ist, und beheben Problempunkte. Durch die Wiederholung dieses Prozesses wird das Design optimiert.

Durch die wiederholte Durchführung dieser vier Prozesse kann ein für Nutzer leicht zu bedienendes und ansprechendes Interaktionsdesign geschaffen werden.

Fünf Vorteile des Interaktionsdesigns auf Websites

Interaktionsdesign findet zwar in verschiedenen digitalen Bereichen sowie bei physischen Produkten und Dienstleistungen im Allgemeinen Anwendung, doch hier beschränken wir uns auf Websites und stellen fünf Vorteile vor, die sich durch die Umsetzung von Interaktionsdesign ergeben.

Vorteil ① Verbesserung der UX

Durch den Einsatz von Interaktionsdesign wird es für Nutzer einfacher, die Nutzung der Website intuitiv zu verstehen. Ein benutzerfreundliches Interaktionsdesign reduziert den Stress der Nutzer und erhöht die Zufriedenheit bei der Nutzung der Website. Dadurch steigt die Wahrscheinlichkeit, dass mehr Wiederkehrer und Fans gewonnen werden.

Vorteil ② Das Nutzerengagement erhöhen

Hover-Effekte auf Schaltflächen und Animationen, die sich beim Scrollen über den Bildschirm verändern, bieten den Nutzern visuellen Reiz und steigern ihr Interesse an den Inhalten. Dadurch verbringen Nutzer mehr Zeit auf der Website und beschäftigen sich aktiver mit den Inhalten.

Außerdem hat intuitives Interaktionsdesign den Vorteil, dass es Nutzer effektiver zur nächsten Aktion wie dem Kauf eines Produkts, einer Anfrage oder einer Registrierung führen kann.

Vorteil ③ Steigerung der Conversion-Rate

Durch Interaktionsdesign können Nutzer Informationen reibungslos finden, sodass die Wahrscheinlichkeit steigt, die abschließende Aktion wie den Kauf eines Produkts oder eine Kontaktaufnahme auszuführen. Wenn beispielsweise beim Ausfüllen eines Formulars Echtzeit-Fehlermeldungen angezeigt werden, werden Eingabefehler reduziert und der Vorgang kann reibungslos abgeschlossen werden.

Hochwertiges Interaktionsdesign führt Nutzer auf natürliche Weise zur gewünschten Seite oder zum gewünschten Produkt und reduziert dadurch die Absprungrate und erhöht die Conversion-Rate.

Vorteil ④ Verbesserung des Markenimages und Differenzierung von der Konkurrenz

Ein reibungsloses und raffiniertes Interaktionsdesign vermittelt den Nutzern den Eindruck „Diese Website ist hochwertig und vertrauenswürdig“. Dadurch verbessert sich das Markenimage, und eine Differenzierung von der Konkurrenz wird möglich. Außerdem führt ein Interaktionsdesign, das den Nutzern Spaß bei der Bedienung bereitet, dazu, dass sie leichter ein Gefühl der Nähe zur Marke entwickeln.

Vorteil ⑤ Verbesserung der Web-Barrierefreiheit

Web-Accessibility bezeichnet Gestaltung und Maßnahmen, die es allen Menschen, unabhängig davon, ob sie eine Behinderung haben oder nicht, erleichtern, Websites zu nutzen. Durch die Implementierung von Interaktionsdesign auf einer Website wird es für Nutzer mit unterschiedlichen Einschränkungen wie Seh-, Hör-, Bewegungs- oder kognitiven Beeinträchtigungen einfacher, die Website zu nutzen, wodurch sich die Web-Accessibility verbessert.

Indem man die Denkweise des Interaktionsdesigns auf Websites anwendet, lässt sich ein inklusives Web-Erlebnis bieten und eine Website aufbauen, die von mehr Nutzern erreicht und genutzt werden kann.

Apple, das zu Beginn vorgestellt wurde, setzt Interaktionsdesign nicht nur in seinen Produkten, sondern auch auf der offiziellen Website ein. Das wohl prägnanteste Merkmal ist das Parallax-Design, bei dem sich der Bildschirm beim Scrollen verändert. Dadurch macht bereits die Bedienung der Website selbst Freude, und es wird eine zielgerichtete Übermittlung der Informationen an die Nutzer erreicht.

◆Offizielle Website von Apple (Apple Watch)

Offizielle Apple-Website

Referenz: Apple Watch Series 10 (Apple)

Zusammenfassung

Derzeit wird in verschiedenen Bereichen großer Wert auf die Qualität der Benutzererfahrung durch Produkte und Dienstleistungen gelegt, und es besteht ein Bedarf an angemessenen Vorkehrungen für Nutzer mit Behinderungen sowie an einer Verbesserung der Barrierefreiheit. In diesem Zusammenhang gewinnt das Interaktionsdesign zunehmend an Bedeutung.

Interaktionsdesign ist ein wichtiger Faktor, der die Benutzerfreundlichkeit von Produkten und Dienstleistungen bestimmt und den Wert von Produkten und Dienstleistungen maximiert; deshalb ist es in modernen digitalen Produkten und Dienstleistungen unverzichtbar geworden.

Und wie in diesem Artikel beschrieben, ist Interaktionsdesign auch auf Websites äußerst wichtig und eine notwendige Denkweise, damit alle Nutzer die Website gleichermaßen komfortabel nutzen können. Unser „Uniweb“ ist ein Tool, mit dem sich Barrierefreiheitsfunktionen ganz einfach auf jeder Website implementieren lassen, und es ermöglicht den Aufbau von Websites, die von einer vielfältigen Nutzergruppe komfortabel genutzt werden können.

Wenn Sie Interaktionsdesign in Ihre eigene Website integrieren möchten, wenden Sie sich bitte jederzeit an uns, um mehr über Uniweb zu erfahren.

Beginnen Sie mit einer einfachen Bitte um Informationen

Wir stellen die Funktionen von Uniweb und den Ablauf der Einführung vor.

Weitere Informationen anfordern