tmg - webinale 2026

Das User Interface im Wandel

Redaktion webinale — Mon, 08 Feb 2021 15:14:15 +0000

Die Benutzeroberfläche einer Software ist i. d. R. die einzige Stelle, mit der der Anwender in Berührung kommt. In das „Innere“ einer Applikation kann man im laufenden Betrieb nicht schauen, lediglich die Schnittstelle zur Interaktion ist offengelegt und für den Anwender zugänglich. Eine Vielzahl von Aspekten ist bei der Gestaltung zu berücksichtigen. Beispielsweise ist zu klären, auf welche Art und Weise die Interaktion erfolgt. Als Entwickler mag man dabei sofort an die grafischen Interfaces denken, die heute der Standard für Businessanwendungen sind. Jedoch gibt es eine Reihe weiterer Möglichkeiten zur Gestaltung der Kommunikationsschnittstelle. Beginnend bei der Eingabe von Befehlen bis hin zu KI-gestützter Spracheingabe oder der Interaktion mittels Gesten reicht das Spektrum. Als Entwickler von Applikationen mit der Programmiersprache Java liegt unser Fokus im Moment sehr häufig auf Unternehmensanwendungen. Hier erfolgt die Bedienung meist traditionell mit Tastatur und Maus, aber auch neuere Ansätze bahnen sich nach und nach den Weg in die Geschäftswelt.

Eines steht definitiv fest: Die Entwicklung der Benutzerschnittstelle nimmt einen immer größer werdenden Stellenwert im gesamten Softwareentwicklungszyklus ein. Statt „nebenbei“ im laufenden Entwicklungsprozess und durch den Softwareentwickler erledigt, wird diesem Teilschritt immer mehr Bedeutung zugemessen. Historisch hätte man die mit der Gestaltung der Benutzerschnittstelle einhergehenden Aufgaben irgendwo zwischen Anforderungsanalyse und Entwurf eingeordnet. Dazu ist das Thema jedoch viel zu wichtig. Folgerichtig sollte dem Konzept, dem Entwurf, der Erprobung durch den Nutzer und letztlich der technischen Umsetzung ein eigener umfassender Bearbeitungsschritt zugedacht werden (Abb. 1).

Abb. 1: Einordnung des Designs in den Softwareentwicklungszyklus

Alle News zu Web Design, UX und Digital Marketing

Fachleute für Design müssen über ein vielfältiges Portfolio an Kenntnissen verfügen, u. a. aus den Bereichen Ästhetik und Psychologie. Statt bloßem Bauchgefühl und Trial-and-Error-Verfahren kommen heute Ansätze aus der User-Experience-(UX-)Design-Research zum Einsatz. Diese beziehen wiederum ihr Potenzial und die notwendigen Erkenntnisse u. a. aus den Methoden der modernen Marktforschung. Die Technik will selbstverständlich auch beherrscht werden, ist jedoch zunächst nur zweitrangig.

In den folgenden Textabschnitten wollen wir die Entwicklung der Benutzerschnittstelle im historischen Zeitablauf nachzeichnen. Was zunächst wie eine Geschichtsstunde aussieht, führt schnell zur Erkenntnis, dass auch der heutige Stand – also primär die aktuell eingesetzte grafische Form des User Interface – nur ein Meilenstein auf dieser stetig fortschreitenden Entwicklung ist. Künftig werden wir wahrscheinlich vollständig anders mit der Technik in Interaktion treten, als wir es heute bereits täglich tun. Grundsätzlich kann die Entwicklung des User Interface anhand von folgenden Meilensteinen nachgezeichnet werden:

Command Line Interface (CLI)
Graphical User Interface (GUI)
Natural User Interface (NUI)
Voice User Interface (VUI)
Organic User Interface (OUI)

Abb. 2: Meilensteine der User-Interface-Entwicklung

Auf die genannten Meilensteine (Abb. 2) werden wir gleich umfassender eingehen. Wir erkennen unmittelbar, dass die Entwicklung kontinuierlich vorangeht. Unverändert bleiben jedoch die Grundsätze, die das Fundament einer guten Benutzerschnittstelle ausmachen. Im Fokus steht nach wie vor das Ziel einer maximalen Benutzerfreundlichkeit. Unter Benutzerfreundlichkeit versteht man eine einfache Handhabbarkeit der Programme. Die Bedienung muss nicht oder kann sehr einfach erlernt werden. Sie richtet sich nach den Denk- und Arbeitsweisen der Anwender. Die Usability ist ein wichtiger Punkt für die Akzeptanz und damit den Erfolg einer Software. Das User Interface soll möglichst klar strukturiert und beschrieben sein. Das betrifft sowohl die Inhalte als auch die Elemente zur Navigation und Bedienung. Die „goldenen Regeln“ wurden von Ben Shneiderman bereits im Jahr 1986 niedergeschrieben. Sie sind universell und haben ihre Gültigkeit bis heute nicht verloren. Es lohnt sich, einen Blick auf diese Regeln zu werfen (Kasten: „Die Goldenen Regeln des User-Interface-Designs“).

Die Goldenen Regeln des User-Interface-Designs

Eine gute Benutzerschnittstelle geht auf den Anwender zu und holt diesen ab. Einige Regeln sollte man stets beachten [1]:

Universelle Bedienbarkeit: Die Anwendung sollte durch jeden Benutzer schnell und einfach bedient werden können. Die Anforderungen verschiedener Benutzertypen sollten rechtzeitig erkannt und umgesetzt werden. Ein Experte bedient eine Software anders als ein Anfänger. Beispielsweise kann mit unterschiedlichen Betriebsmodi gearbeitet werden. Ein gutes Beispiel ist die Bedienung einer Steuersoftware. Der Gelegenheitsanwender möchte ggf. gern mit Hilfe eines Assistenten durch den gesamten Prozess geführt werden, während der versierte Steuerexperte lediglich einige Daten eintragen möchte und durch diesen Overhead nur genervt wäre.
Konsistenz: Es ist sinnvoll, die Abläufe in ähnlichen Situationen konsistent zu lassen, das kann zum Beispiel die Anordnung bestimmter Elemente der Oberfläche wie Buttons usw. betreffen. Es gilt, die Elemente so anzuordnen, dass diese an der erwarteten Position sind. Der Anwender sollte auf keinen Fall danach suchen müssen.
Informative Rückmeldung: Es ist wichtig, Feedback über die laufenden Funktionen oder den Systemstatus zu sammeln und diese Informationen an den Anwender weiterzugeben. Ein Buchungssystem, das gerade die aktuell verfügbaren Flüge ermittelt, muss diesen Arbeitsstand mitteilen. Dauert der Vorgang einige Augenblicke, dann weiß der Anwender auch, dass sich seine Geduld lohnt.
Abgeschlossene Dialoge: Es soll dem Benutzer klar sein, wann eine Aktion, Funktion oder Befehlskette gestartet wird und wann sie abgeschlossen ist. Zum Beispiel ist es bei einem Onlineshop sinnvoll, den Vorgang mit einer Bestätigungsseite zu beenden, wonach die Transaktion vollständig abgeschlossen ist. Sind es mehrere Schritte, dann ist der Fortschritt möglichst zu visualisieren.
Einfache Fehlerbehebung: Bei einer Fehlermeldung sollten nach Möglichkeit verständliche Informationen über potenzielle Ursachen angegeben und ein Ausweg angeboten werden, um in den normalen Betrieb zurückzukehren. Viele Programme geben noch heute eine rein technische Fehlermeldung aus. Entwickler und IT-Experten mögen damit etwas anzufangen wissen, der Anwender der Software ist dadurch nur verwirrt. Er wollte eine Aufgabe lösen und steht nun vor einem neuen Problem, dessen Lösung ihm vollständig unklar erscheint.
Einfache Umkehrung von Aktionen: Es geht um die Möglichkeit, die getätigten Aktionen wieder rückgängig zu machen. Man hat sich für eine Option entschieden und stellt dann fest, dass diese wohl doch nicht die passende Wahl war. Wie kann man diesen Schritt rückgängig machen? Muss man ganz von vorn beginnen? Die Bedienung sollte keine Einbahnstraße sein.
Gefühl der Kontrolle: Es ist wichtig, dass der Nutzer das Gefühl hat, die Kontrolle über das System zu haben. Er muss die Software als Arbeitsmittel beherrschen und nicht umgekehrt. Jederzeit muss klar sein, wo man steht, wie es weitergeht und noch viel wichtiger: „Wie komme ich hier wieder raus?“. Ein Beispiel: Mittels eines Schalters wird der Tempomat im PKW eingeschaltet. Dieser schaltet sich wieder aus, wenn wir das Bremspedal betätigen. Und wie kommen wir zur gewählten Geschwindigkeit zurück? „Reset“ oder „Set“ – ein immer wieder verwirrendes Spiel. Ein simpler Hinweis auf dem Display wäre so hilfreich …
Entlastung des Kurzgedächtnisses: Es geht um die Vermeidung der Tatsache, dass der Benutzer sich zu viele Informationen merken muss, damit er zum Beispiel nachfolgende Aktionen ausführen kann. Helfen Sie dem Nutzer in jeder Situation.

Viele dieser Regeln gelten unabhängig von der Art der Software, dem Interaktionskonzept (grafisch, Touch Interface, Sprachsteuerung) oder der Domäne der Software.

Die Benutzerschnittstelle dient der Kommunikation zwischen dem menschlichen Anwender und der Technik. Diese Kommunikation ist oft bidirektional, d. h., dass nicht nur Informationen angezeigt, sondern auch Reaktionen der Nutzer zur Steuerung erwartet werden.

NOCH MEHR ZU WEB DESIGN?

Der Web Design & Development Track

Mehr erfahren

Ebenen eines User Interface

In diesem Abschnitt sehen wir uns ein wenig die Theorie zur Gestaltung des User Interface an. In der Praxis sind die theoretischen Modelle oft nur schwer vollständig umsetzbar, jedoch liefern sie wichtige Hinweise, welche Aspekte zu berücksichtigen sind. Man unterscheidet verschiedene Ebenen eines User Interface (Tabelle 1). Diese bestehen aus konzeptuellen, kommunikativen und physischen Komponenten [2].

UI-Komponenten	UI-Ebenen	Gestaltungsentscheidungen
Konzeptuelle Komponente	Aufgabenebene	Teilung von Mensch-Computer-Funktionen; Festlegung von Aufgaben, die mit dem System bearbeitet werden; Bildung von Teilaufgaben und Aufgabenhierarchien; Automatisierungsgrad
Konzeptuelle Komponente	Semantische Ebene	Systemobjekte und -operationen und Operationen der Benutzer
Kommunikative Komponente	Syntaktische Ebene	Regeln zur Anwendung von Operationen auf Systemobjekte; Systemzustände und Constraints
Kommunikative Komponente	Interaktionsebene	Merkmale der Interaktion (beispielsweise Initiative, Direktheit, Granularität, Rückmeldung); Auswahl und Kombination von Interaktionstechniken, wie Kommando-, Menü-, Formular- und direkt-manipulative Techniken
Physische Komponente	Medienebene	Modalitäten des Informationsaustauschs und ihre Kombination (visuell, akustisch, haptisch), bspw. Zeigegesten, Spracheingabe
	Räumliche Ebene	Formate der Informationsausgabe und -eingabe, bspw. Festlegungen zu Fenstergrößen und -anordnungen; Positionen von Interaktionselementen auf dem Bildschirm
	Kodierungsebene	Zeichen, Symbole und Icons, Merkmale akustischer Signale, bspw. Form, Größe, Farbe und Bewegung von Objekten; Festlegung lexikalischer Elemente
	Hardwareebene	Ein- und Ausgabegeräte, z. B. Größe und Auflösung des Bildschirms, Tastatur-, Maus- und Toucheigenschaften; Geräte für Virtual und Augmented Reality

Tabelle 1: Komponenten und Ebnen des UI [2]

Command Line Interface

Beim Command Line Interface basiert die Interaktion zwischen Mensch und Computer ausschließlich auf der Eingabe von Befehlen (Kommandos) per Tastatur. Ursprünglich hatten die Zeichenfolgen teilweise kryptischen Charakter und ihre Bedeutung war selten selbsterklärend. Um keine langen Zeichenketten erfassen zu müssen, wurde umfassend mit Abkürzungen gearbeitet. Zusatzinformationen wurden per Parameter an die Kommandos angehängt. Anwendungsprogramme im betrieblichen und privaten Umfeld wurden ebenso auf diese Weise bedient. Der sogenannte Command Line Interpreter spielte dabei eine zentrale Rolle. Eine einzelne Befehlszeile wurde eingelesen und interpretiert. Anschließend erfolgte die Ausführung des Kommandos und danach wurde das Ergebnis dem Benutzer direkt angezeigt. Die Funktionalität hat Vorrang vor der optischen Gestaltung. Heutzutage spielt das CLI auch noch eine Rolle. Für die Systemadministration existiert in nahezu allen Betriebssystemen (Windows: Power Shell, Linux: Shell) eine Kommandoebene. So können die notwendigen Administrations- und Wartungsarbeiten effektiv ausgeführt werden. Im unmittelbaren Anwenderbereich ist das CLI nahezu vollständig verschwunden. Eine derartige Bedienung kann den Anwendern kaum noch zugemutet werden.

Im Bereich der Softwareentwicklung finden wir heute in vielen Bereichen eine „Wiederbelebung“ des CLI. Unzählige Frameworks bieten ein CLI, um die anstehenden Aufgaben, zum Beispiel ein Projekt-Set-up, den Build einer Software usw. anzustoßen. Grafisch „verwöhnte“ Nutzer tun sich häufig schwer damit, der Experte schätzt die Effizienz einer solchen Nutzerführung.

In vielen Fällen wird auch der Weg gegangen, dass man ein CLI einbaut und damit eine gewisse Flexibilität für die endgültige Ausgestaltung des User Interface schafft. Als Unterbau kann es somit für nutzerfreundliche Benutzeroberflächen – sei es grafisch oder als Sprachsteuerung – stehen.

Graphical User Interface

Mit der grafischen Benutzeroberfläche (GUI) bekam das Erscheinungsbild einer Applikation eine genauso wichtige Rolle wie die Funktionalität. Die Ignoranz gegenüber dem Aussehen und die Bedienung einer Anwendung über CLIs war mit der Etablierung von grafischen Benutzeroberflächen vorbei. Das GUI-Konzept stammt aus den 1970er Jahren und wurde im Jahr 1973 am Xerox PARC etabliert. Einen größeren Anwenderkreis fand es jedoch erst im Jahr 1983 mit dem populären Computer Apple Lisa, der jedoch sehr preisintensiv war. Die Zukunft gehörte dem Apple Macintosh aus dem Jahr 1984, der unter der Leitung von Steve Jobs entwickelt wurde. Dieser galt als erster bezahlbarer Rechner mit einer grafischen Benutzeroberfläche. Es folgten Atari ST (1985) und Commodore Amiga (1986). Als Reaktion auf Apple Lisa kam im Jahr 1985 Microsoft mit Windows (1.03) hinzu.

Buttons, Symbol-, Auswahl- und Werkzeugleisten sowie gestaltete Dialogfelder gehören zu den Elementen eines GUI. Der Zugang zu den Programmen erfolgt durch Icons auf der Desktopoberfläche. Die Programmfenster können in variabler Größe und Position geöffnet werden. Für die damalige Hardware war die Umsetzung eines GUI-Konzeptes eine große Herausforderung, denn die Verarbeitungsgeschwindigkeit war oft noch gering. Die weitere Entwicklung ist durch eine erhöhte grafische Detaillierung, eine zunehmend intuitive Bedienung und auch durch die Integration von Multimediaelementen gekennzeichnet. Mit der gesteigerten Leistungsfähigkeit der Hardware verbesserte sich die Auflösung der Bildschirme und die Verarbeitungsgeschwindigkeit nahm enorm zu. Die Einführung von Windows 95 war ein wichtiger Meilenstein, denn mit einer Startleiste und einem veränderten Fensterkonzept wurde weiter von der Technik abstrahiert und bei der Bedienung auf den Endkunden zugegangen. Aus heutiger Sicht wirken die damals gängigen GUI oft überladen. Nicht immer waren die Bedienelemente sinnvoll angeordnet. Für die weitere „Reifephase“ des GUI, am Übergang zu den NUI, sind eine Reduktion auf wesentliche Kernfunktionen, ein schlichtes Farbkonzept, eine Fokussierung auf die Inhalte und adaptive Elemente kennzeichnend, die sich automatisch an die jeweilige Arbeitssituation anpassen.

Als Entwickler von Businessapplikationen spielen der Entwurf und die technische Umsetzung eines ansprechenden grafischen User Interface heute eine zentrale Rolle. Im dritten Teil der Serie werden wir uns mit den heute aktuellen technischen Ansätzen zur Gestaltung des UI beschäftigen. Die konkrete Gestaltung, d. h. die Ausgestaltung des Designs ist stets auch eine Frage des aktuellen Zeitgeists. Wie in der Mode sind auch grafische Oberflächen einem stetigen Wandel des Geschmacks unterworfen. Im Fokus der heutigen Gestaltung stehen moderne Designsprachen wie Material Design oder Fluent Design. Statt bunter und verspielter Oberflächen haben wir es heute mit geraden Linien, einer Reduktion auf funktionale Aspekte und einem weitgehenden Minimalismus zu tun. Jährlich erscheinen neue Designtrends für die Gestaltung von Softwareinterfaces. Schlagwörter aus dem Jahr 2020 sind beispielsweise animierte Illustrationen, Mikrointeraktionen, 3D-Grafiken in Web- und Mobile-Anwendungen, Virtual Reality (VR), Augmented Reality (AR) usw. [3]. Nicht alle Trends werden sich in allen Bereichen durchsetzen. VR und AR haben (heute) keinen Platz bei einer Datenbankanwendung; dagegen können Mikrointeraktionen oder 3D-Effekte bei Buttons usw. durchaus auch im Businessumfeld eingesetzt werden.

Wie wichtig es ist, aktuelle Designtrends auch in klassischen Applikationen aufzugreifen und umzusetzen, wird einem sofort klar, wenn man eine Applikation aus dem Jahr 2000 startet. Funktional mag diese noch arbeiten und ggf. immer wieder auf den neusten Stand gebracht worden sein. In den Fragen der Bedienung und des Designs wird man jedoch deutlich die Spuren der Zeit sehen. Wir befinden uns heute in der Reifephase des GUI und machen seit einiger Zeit bereits große Schritte zur nächsten Ebene der Benutzerschnittstellen.

Natural User Interface

Das Natural User Interface (NUI) wird künftig das GUI ersetzen, in einigen Aspekten (Touch) ist auch ein Nebeneinander bzw. eine Ergänzung möglich. Eine neue Ära kam mit der Verbreitung von Multi-Touchscreens in Smartphones und Tablets auf. Neben dem „Look“ kommt jetzt auch das „Feel“ zum Einsatz (Abb. 3).

Abb. 3: Wird ein GUI um das „Feel“ ergänzt, gelangt man zum NUI

Mit „Look“ ist das Interface-, Brand- und Corporate Design, also das Aussehen der Oberfläche gemeint. „Feel“ steht für Interaktion, Verhalten, Multimedia usw. Man setzt darauf, dass jegliche Produkte ohne Anleitung zu bedienen sind, d. h. intuitiv. Das Prinzip der Gestaltung orientiert sich am sogennannten OSIT-Konzept. Dieses Akronym steht für Orientieren, Selektieren, Informieren und Transagieren. Als Erstes will man wissen, an welcher Stelle man sich befindet. Dazu ist eine Orientierung – im Sinne eines Überblicks – notwendig. Im nächsten Schritt trifft man eine Auswahl, d. h. Selektion von Dingen aus dem Umfeld. Es folgt das Informieren über Details. Abschließend findet eine Transaktion statt, d. h., dass wir das Objekt nutzen oder es in einen anderen Zustand überführen. Die Oberfläche wird somit bei einem NUI nicht mehr hierarchisch organisiert, sondern die gewünschten Inhalte kommen gewissermaßen auf den Nutzer zu. Je nach Gewichtung und Relevanz können die Bildschirmobjekte vergrößert, verkleinert oder entsprechend platziert werden. Der Nutzer kann die Inhalte nach seinen Bedürfnissen zusammenstellen, umgruppieren und anpassen. Suchen, sortieren, filtern oder zoomen wird bei einem NUI oft verwendet. Statische Fenster werden immer öfter durch dynamische ersetzt. Für die Umsetzung eines NUI müssen sich die Designer mit den Handlungsmustern und dem Verhalten der Nutzer auseinandersetzen und sich bestmöglich in sie hineinversetzen.

Einfache Formen erlauben statt der Bedienung mit der Maus nun das Berühren der entsprechenden Elemente auf dem Bildschirm mit dem Finger. Hier sind kaum technische Änderungen an der Software notwendig. Ein Touch-Ereignis reagiert in dieser Art und Weise nahezu identisch wie ein Klick mit der Maus. Ggf. müssen die Bedienelemente (Buttons, Listenauswahl usw.) in der Größe angepasst werden, da die Genauigkeit der „Fingerbedienung“ geringer ist als die erreichbare Präzision mit einem Mauszeiger. Hier gilt es, als Entwickler und Designer Erkenntnisse über die verfügbare bzw. geplante Hardware beim Kunden einzuholen. Ist ein Touch-Bildschirm geplant oder bleibt es bei der reinen Bildanzeige? Einige moderne Notebooks sind mit Touch-Bildschirmen ausgestattet. Sie erlauben also ein Nebeneinander von Touch- und Maus-/Tastaturbedienung.

Alle News zu Web Design, UX und Digital Marketing

Im Bereich der Software von industriellen Anwendungen oder in Umgebungen, wo externe Bedienelemente nur stören würden, zum Beispiel die Steuerung eines Smart-Home-Systems, haben die Touch-Oberflächen die Interaktion mit Maus und Tastatur komplett ersetzt. Hier muss man beispielsweise bedenken, dass zwar eine Eingabe von Text über eine Bildschirmtastatur möglich ist, jedoch möchte niemand einen wirklich langen Text darüber eingeben. Mit anderen Worten: Ein Passwort oder einen kurzen Text können wir dem Nutzer durchaus zumuten, alles andere kann zur Qual werden. Um dennoch längere Texte zu erfassen, braucht es andere Formen der Eingabe, beispielsweise die Spracheingabe (siehe nächster Abschnitt) oder eine umfassende Unterstützung durch eine KI, die dabei hilft, das gewünschte nächste Wort zu „erraten“.

Vollständig andere Möglichkeiten der Bedienung ergeben sich beim Vorhandensein eines Multi-Touch-Displays. Hier ist nicht nur der einfache Tap (als ersetzendes Element für den Einfachklick) möglich, sondern wir haben eine Vielzahl von weiteren Touch-Gesten, zum Beispiel Tippen, Verschieben, Zoom, Drehen, Wischen usw. Eine sehr umfassende Zusammenstellung der Gesten und die Unterstützung unterschiedlicher Geräte findet sich unter [4].

Moderne Frameworks zur Umsetzung grafischer Oberflächen bieten die Unterstützung dieser Gestensteuerung an, d. h., es stehen entsprechende Events zur Verfügung. Um eine Applikation mit einem klassischen GUI in das Zeitalter NUI zu holen, ist jedoch i. d. R. eine umfassende Überarbeitung des Interface notwendig: Mit welchen Gesten kann ich die beschriebene Aktion erreichen? Wie ersetze ich das Anwendungsmenü durch interaktiv und situativ einblendende Inhalte? Denn Befehle wie Datei | Bearbeiten | Kopieren usw. sind nicht intuitiv über eine Touch-Bedienung machbar. Welche Größe haben die Elemente? Sie sehen selbst, das sind primär keine Fragen der Technik.

Voice User Interface

Wie der Name bereits verrät, bezieht sich VUI auf die Stimme, d.h., dass die Ein- und Ausgabe über gesprochene Sprache erfolgt. Für die Interaktion werden weder die Hände benötigt, noch ist die Betrachtung eines Displays notwendig. Assistenzsysteme wie Siri, Alexa, Cortana usw. sind die besten Beispiele dafür. Die Nutzer können nicht nur die Geräte mit Hilfe der Sprache steuern, sondern auch die Maschinen sind in der Lage, dem Nutzer verbale Antworten zu geben. VUI ist immer dann sinnvoll, wenn Nutzer „alle Hände voll zu tun haben“ bzw. wenn Sinne wie Sehen und Tasten bereits belegt sind und der Nutzer trotzdem einen Wunsch hat oder eine Aufgabe erledigen möchte.

Technisch sind wir heute dank der Nutzung von KI-Services aus der Cloud in der Lage, beliebige Applikationen mit einer Sprachsteuerung auszustatten. Es ist also nicht mehr notwendig, die dafür notwendigen Algorithmen selbst zu programmieren, eine Verbindung zum Service über das Internet genügt. Auch hier beginnt die Arbeit auf konzeptioneller Ebene. Beginnend mit der Definition der Sprachbefehle ist die KI zu konfigurieren und über eine Schnittstelle in die eigene Applikation einzubauen. Ein erster Ansatzpunkt zur Integration einer Spracherkennung in die eigene Applikation besteht in der Auswahl eines geeigneten Cloud Service, zum Beispiel Azure Cognitive Service von Microsoft [5]. Dieser ist i. d. R. online über ein Dashboard zu konfigurieren, ggf. auch zu trainieren (lernende KI). Für die Interaktion aus der eigenen App stehen dann definierte Schnittstellen oder besser spezifische SDKs, zum Beispiel für Java, zur Verfügung.

Hier kann man auf jeden Fall festhalten: Die Fähigkeit der Erkennung von Sprache hat sich in der letzten Zeit deutlich verbessert. Die Komplexität, diese Services in die eigene App einzubauen, zum Glück nicht. Es genügt i. d. R. die Funktionsweise grundsätzlich verstanden zu haben und den Service für seine Zwecke zu konfigurieren. Danach ist die Spracherkennung – hier verwendet als Sprachsteuerung – wie eine Blackbox nutzbar.

Organic User Interface

Die Entwicklung wird weitergehen. Nach NUI kommt OUI. Die Abkürzung steht für Organic User Interface. Der Begriff „organisch“ in OUI wurde von der zugrunde liegenden organischen Architektur abgeleitet und bezieht sich auf die Übernahme der natürlichen Form mit dem Ziel, eine bessere Anpassung an die menschliche Ökologie zu erreichen. Unter OUI versteht man eine Benutzeroberfläche mit einer nicht flachen bzw. mit einer biegbaren Anzeige. Eine organische Benutzeroberfläche setzt darauf, dass wir die tatsächliche physische Form oder Position eines Geräts ändern, um dieses zu steuern. Damit eröffnen sich viele unglaubliche Möglichkeiten, mit Geräten zu interagieren und zu navigieren. In einer OUI ist die Anzeigeoberfläche immer der Ort der Interaktion und kann bei Eingaben aktiv oder passiv ihre Form ändern. Diese Eingaben werden durch direkte physische Gesten und nicht durch eine indirekte Point-and-Click-Steuerung bereitgestellt. Es wird zwischen mehreren Arten von organischen Benutzeroberflächen unterschieden [6], beispielsweise Schnittstellen mit einer flexiblen bzw. verformbaren Oberfläche, Displays, die an die Form exakt angepasst werden, z. B. eine Kugel oder ein Zylinder, oder Schnittstellen, die dynamisch zur Laufzeit erstellt und gesteuert werden, beispielsweise die berührungsempfindliche und situativ eingeblendete Tastatur.

Wir können schon heute sagen: OUI bringt viele interessante Möglichkeiten mit sich, die Technologie steckt jedoch noch in den Kinderschuhen und die Entwicklung lässt sich hier noch kaum abschätzen. Erste Geräte mit biegsamen Displays kommen gerade auf den Markt.

Produktion vs. Betrieb

Die Bedienung der Software in der Produktion, also während der Entwicklung, unterscheidet sich zunehmend maßgeblich vom Umfeld des späteren Einsatzes. Ganz konservativ betrachtet hatten sowohl Entwickler als auch Anwender einen PC mit Bildschirm und Maus. Dieses Prinzip ist im Bereich der Entwicklung für mobile Systeme schon lange durchbrochen. Man behilft sich mit Testgeräten, Simulatoren, Emulatoren bzw. Cloud-Services, die die Option für eine Vielzahl von physischen Devices zum Probieren über das Internet bereitstellen.

Mit der Weiterentwicklung der Benutzerschnittstellen wird diese Lücke zwischen Entwicklung und Anwendung auch für andere Applikationsarten größer. Um hier zu guten Ergebnissen zu kommen, müssen wir auf mehreren Ebenen aufrüsten. Beispielsweise müssen wir uns mit den künftig gewünschten Bedienkonzepten unserer Nutzer noch mehr auseinandersetzen und die Erkenntnisse in die Gestaltung der Benutzeroberflächen einfließen lassen.

Zusammenfassung

Die Bedienoberfläche der Software von morgen wird sich radikal ändern. Das Prinzip „Weg von der Technik, hin zum Kontext“ wird eine immer größere Rolle spielen. Anwender wollen keine Software bedienen, sie möchten eine Aufgabe erledigen. Im Moment stecken wir irgendwo zwischen GUI und NUI und erahnen nur vage die künftige Entwicklung. Zugegebenermaßen fällt es immer schwerer, diese gestiegenen Anforderungen an die Nutzeroberflächen fachgerecht zu realisieren. Das wird zur Arbeit von Spezialisten, d. h. von UI-Designern.

Weitere Informationen zu diesen und anderen Themen der IT finden Sie unter http://larinet.com.

Links & Literatur

[1] https://www.embedded-software-engineering.de/grundlegende-richtlinien-fuer-gute-user-interfaces-a-554405/

[2] Moran, Thomas P.: „The Command Language Grammar: a representation for the user interface of interactive computer systems“; in: International Journal of Man-Machine Studies 15 (1981)

[3] https://uxdesign.cc/8-ui-ux-design-trends-for-2020-68e37b0278f6

[4] https://static.lukew.com/TouchGestureCards.pdf

[5] https://docs.microsoft.com/de-de/azure/cognitive-services/speech-service/custom-commands

[6] https://de.qwe.wiki/wiki/Organic_user_interface

The post Das User Interface im Wandel appeared first on webinale 2026.

E-Commerce-Security

Redaktion webinale — Tue, 19 Jan 2021 08:08:12 +0000

Ein E-Commerce-Projekt ins Leben rufen – nie war das einfacher als heute. Eine Fülle freier wie kommerzieller Software und vielfältige Hosted-SaaS-Lösungen, Onlinemarktplätze und Zahlungsdienstleister machen es möglich. Hinzu kommt das breite Angebot an freien Entwicklern, E-Commerce-Dienstleistern und Dokumentationsressourcen für die Umsetzung in Eigenregie. Segen auf der einen und Fluch auf der anderen Seite, denn: Mit diesem Boom sind die Webportale vermehrt auch in den Fokus von Cyberkriminellen geraten. Fast täglich gibt es Meldungen über gehackte Onlineshops, und sowohl das Bundeskriminalamt (BKA) als auch private Studien stellen fest: Cybercrime nimmt drastisch zu. Was viele nicht bedenken, ist, dass nicht nur klassische Onlineshops von diesen Risiken betroffen sind. Bei solchen Angriffen geht es vor allem um den Diebstahl von persönlichen Daten. Daher sind auch immer komplexer werdende Webapplikationen mit umfangreichen geschlossenen Bereichen für Kunden, Mitglieder oder Partner beliebtes Ziel von Angriffen. Denn auch solche Lösungen müssen, um ihre Zwecke zu erfüllen, einen entsprechenden Umfang an persönlichen Daten speichern.

Laut einer Forsa-Umfrage im Auftrag des Gesamtverbands der Deutschen Versicherungswirtschaft e. V. (GDV) im April 2020 bei kleinen und mittleren Unternehmen sind zwar knapp 70 Prozent der befragten Unternehmen der Meinung, dass das Risiko, Opfer einer solchen Attacke zu werden, in Deutschland hoch ist. Erstaunlicherweise sind jedoch ebenso über 70 Prozent der Befragten der Meinung, dass es sie nicht treffen wird, weil sie zu klein oder zu uninteressant sind. Gerade diese Sorglosigkeit ist leichtsinnig. Betreiber von Webplattformen aller Art sollten sich der Auswirkungen bewusst sein, die sowohl erfolgreiche als auch nicht erfolgreich abgeschlossene Angriffe auf das eigene Geschäft haben können. Mit diesem Wissen können sie die richtigen Maßnahmen ergreifen, um sich und ihre Kunden zu schützen, ohne dabei tiefergehendes Technologie-Know-how zu benötigen.

Noch mehr Expertentipps mit unserem kostenlosen Newsletter

Mögliche Folgen eines Cyberangriffs

Hohe Kosten: Die aktuelle Rechtslage verpflichtet Unternehmen in vielen Fällen, Cybersecurityvorfälle zu melden. Eine IT-forensische Untersuchung des Vorfalls durch entsprechende Sachverständige ist häufig nicht abzuwenden und mit Kosten für das Unternehmen verbunden. Kam es beispielsweise zu Datenverlust personenbezogener Daten, müssen alle Betroffenen informiert werden. Je nach Größe des Unternehmens und Auswirkungen des Sicherheitsvorfalls können so weitere Kosten für Marketingmaßnahmen oder Krisenkommunikation entstehen.

Umsatzverlust: Ein Hack wirkt sich oft direkt auf den Umsatz aus. Das beginnt schon damit, dass ein Onlineshop durch einen Angriff gegebenenfalls nicht mehr erreichbar oder voll funktional ist. Auch kann es sein, dass er wegen forensischer Untersuchungen abgeschaltet werden muss. Doch das ist noch nicht alles: Durch Zugriffsmöglichkeiten auf die Interna könnten Angreifer beispielsweise Bestellungen, Preise oder den Zahlungsstatus manipulieren. Das verursacht Verzögerungen im Betriebsablauf durch notwendige Kontroll- und Korrekturarbeiten nach Inkonsistenzen der Daten, zum Beispiel zwischen Onlineplattform und Lager oder Enterprise-Resource-Planning-(ERP-)System . Im Ergebnis kommt es zu Lieferschwierigkeiten bei „echten Kunden“ – und das führt am Ende zu Unzufriedenheit und Vertrauensverlust beim Kunden sowie weiterem Umsatzverlust.

Imageschaden: Vielleicht noch bedeutender als direkt messbare Umsatzverluste ist die langfristige Schädigung der Kundenbeziehung. Selbst wenn der Angriff keine direkten finanziellen oder persönlichen Auswirkungen auf die Kunden hatte, erschüttert er das Vertrauen in den Betreiber und seine Plattform – und beeinflusst somit die Kundenbindung. Besonders gravierend ist die Lage, wenn sensible Daten gestohlen wurden – seien sie persönlicher Natur oder Kreditkartendaten. Bei der großen Auswahl an Shops und Dienstleistern im Internet und dem damit verbundenen Tiefpreisgefüge ist die Wahl am Ende häufig eine Sympathieentscheidung – eine negative Sicherheitshistorie ist also massiv geschäftsschädigend. Einige Hackerangriffe zielen sogar genau darauf ab. Beim sogenannten Defacing werden Websiteinhalte mit Fehlinformationen manipuliert, um Anbieter zu diffamieren oder sie in juristische Schwierigkeiten zu bringen.

Zivilrechtliche Konsequenzen

Schadenersatzansprüche: Ein Schadenersatzanspruch (vgl. § 823 BGB [2]) in Deutschland ergibt sich aus der Vorsätzlichkeit oder der Fahrlässigkeit einer Handlung, die mittelbar zum Schaden eines Dritten führt. Gemäß IT-Sicherheitsgesetz aus Juli 2015 [3] sind Betreiber von Onlinepräsenzen dazu verpflichtet, alle technisch möglichen und wirtschaftlich zumutbaren Anstrengungen technischer wie organisatorischer Art zu unternehmen, um ihre Plattformen gegenüber Angriffen zu sichern (vgl. § 13 TMG Abs. 7 [4]). Gemäß Rechtsprechung handelt grob fahrlässig, wer seinen Sorgfaltspflichten in besonderem Maße nicht nachkommt. Die IT-Security-Studie 2019 von eco – Verband der Internetwirtschaft e. V. [5] hat aufgezeigt, dass 72 Prozent der Webdienste kleiner und mittlerer Unternehmen nicht sicher konfiguriert sind. Eine ordentliche und sichere Konfiguration ist aber im Rahmen der technischen Möglichkeiten und auch wirtschaftlich zumutbar.

Dies impliziert in den meisten Fällen eine Schadenshaftungspflicht für den Plattformbetreiber, was auch im Versicherungskontext relevant ist, denn viele Versicherungen schließen grobe Fahrlässigkeit von ihrer Leistungspflicht aus. Üblicherweise sind Schadenersatzforderungen von Kreditkartenunternehmen bzw. Zahlungsanbietern zu erwarten, wenn Daten abhandengekommen sind, die Zahlungsmittelmissbrauch erlauben, sowie von vertraglichen Partnerunternehmen wie Lieferanten, Versanddienstleistern, Hostingpartnern oder Markeninhabern, wenn diesen durch den Angriff Schäden entstanden sind.

Unterlassungsansprüche und Abmahnungen: Wenn ein Betreiber mit seiner Webpräsenz gegen rechtliche Bestimmungen verstößt oder Schutzrechte Dritter verletzt, haben Betroffene das Recht, ihn darauf aufmerksam zu machen und Unterlassung zu fordern – allgemein als Abmahnung bekannt. Das Gesetz gegen unlauteren Wettbewerb [6] definiert Verstöße gegen Rechtsvorschriften als unlauter, was Marktteilnehmern regelmäßig das Recht zur Abmahnung einräumt.

Ein Unterlassungsanspruch dürfte sich also unter den gleichen Maßgaben ergeben wie im Bereich Schadenersatz. Hinzu kommen die möglichen Verletzungen weiterer Ansprüche, beispielsweise durch das Gesetz gegen unlauteren Wettbewerb (UWG), Telemediengesetz (TMG) [7], die Datenschutz-Grundverordnung (DSGVO) [8], Preisangabenverordnung (PAngV) [9], das Urheberrechtsgesetz (UrhG) [10] und weitere, wenn die Angreifer die Inhalte der Webseite dahingehend bewusst verändert haben.

Vertragsstrafen: Lieferanten, Versanddienstleister, IT-Dienstleister, Hostingprovider, Markeninhaber oder Zahlungsdienstanbieter – Partner und Dienstleister sind in den meisten Fällen essenziell für das Geschäftsmodell hinter der Onlineplattform. Sind diese durch einen Angriff auf ein Portal ebenso beeinflusst worden, kann dies neben den Schadenersatzansprüchen auch zu Vertragsstrafen führen – oder zur Auflösung der Zusammenarbeit.

Bußgelder und Ordnungsgelder: Die beiden wohl bekanntesten Gesetze/Verordnungen im Bereich Web sind die DSVGO und das TMG.

DSGVO – Datenschutz-Grundverordnung: Seit 2018 gilt europaweit die Datenschutz-Grundverordnung der Europäischen Union, die die besondere Schutzbedürftigkeit im Umgang von personenbezogenen Daten regelt. Als Shopbetreiber ist es unausweichlich, während des Bestellprozesses personenbezogene Daten zu erfassen. Werden diese aber missbräuchlich verwendet, etwa weil ein unzureichender Schutz besteht, ist ein Bußgeld in Höhe von bis zu 4 Prozent des Jahresumsatzes zu erwarten.
TMG – Telemediengesetz: Im Telemediengesetz sind beispielsweise die Impressumspflicht oder Bestimmungen gegen Spam geregelt, aber eben auch die Pflicht, zumutbare Anstrengungen zu unternehmen, sein Angebot sicher zu betreiben. Eine Zuwiderhandlung ist als Ordnungswidrigkeit eingestuft, die mit einem Ordnungsgeld in Höhe von bis zu 50 000 Euro geahndet werden kann (vgl. § 16 TMG).

Nachgelagerte Angriffe: Die Dunkelziffer der nicht erkannten Hacks wird auf schwindelerregende Höhen geschätzt. In vielen Fällen ist ein Webportal gar nicht das primäre Ziel des Angriffs und der Angriff nur die erste Stufe eines mehrphasigen Plans. Mit den gewonnenen Daten wie zum Beispiel Benutzernamen/Passwörtern (Mitarbeiter verwenden häufig dieselben Log-in-Daten bei verschiedenen Systemen), internen Dokumenten, Anbindungen an interne Systeme wie ERP, Warenwirtschaft o. ä. werden Angriffe auf weitere Bereiche interner Netzwerke überhaupt erst ermöglicht oder bieten die Grundlage für Spear-Phishing-Attacken mittels Social Engineering.

Wie lässt sich ein E-Commerce-Projekt sicher umsetzen?

Wenngleich die möglichen Risiken abschreckend klingen mögen, so ist es mit entsprechender Sorgfalt kein Problem, sich in diesem Bereich geschäftlich, juristisch wie technisch sicher zu betätigen. Millionen von erfolgreichen und sicheren Webdiensten zeigen dies ganz klar: Mit Vorbereitung, Weitblick und verantwortungsvollem Umgang mit der Thematik lässt sich das Risiko drastisch minimieren und die juristischen Folgen lassen sich reduzieren.

Schritt 1: Überblick über Risiken, Gefahren und Status quo schaffen: Über welche Daten verfügt ein Shop oder Webportal, wo sind Schwachstellen, wen könnte ein Angriff betreffen und welche Pflichten hat der Betreiber? Eine Übersicht bezogen auf das konkrete Projekt hilft, Schwachstellen, Risiken und Handlungsbedarf zu erkennen und Maßnahmen einzuleiten. Eine Dokumentation der Systemlandschaft unter Sicherheitsaspekten und eine Schulung des Teams kann oft einen großen Teil der Risiken kontrollierbar machen. Viele Angriffsvektoren werden dabei auch ohne identifizierbaren Handlungsbedarf erfasst, dafür wird allen Beteiligten vor Augen geführt, was für den zukünftigen Betrieb, aber auch die Weiterentwicklung hilfreich ist.

Folgende Fragestellungen helfen E-Commerce-Betreibern dabei, einzuordnen, wie sie hinsichtlich Security aktuell aufgestellt sind und wo Handlungsbedarf besteht:

Werden bei unserem Dienst regelmäßige Updates durchgeführt? Wer führt diese in welchen Intervallen durch? Bestehen Wartungsverträge und Service Level Agreements (SLAs)?
Wie ist die Lösung gehostet? Welche SLAs liegen dort vor und welche Vereinbarungen existieren dort für Sicherheitsupdates, Back-ups und Ähnliches?
Teilt sich unsere Plattform einen Server mit anderen Projekten (intern im Haus oder auch extern im Sinne von Shared Hosting)?
Ist unser Portal mit automatischen Schnittstellen an andere Dienste angebunden, egal ob eingehend oder ausgehend, und wurde diese Verbindung unter IT-Sicherheitsaspekten geplant und umgesetzt? Sind die Datenquellen vertrauenswürdig oder können sie manipuliert werden?
Habe ich das Gefühl, dass meine Mitarbeiter/Kollegen wie auch beauftragte Dienstleister sich der Sicherheitsrisiken, Abwehrmaßnahmen und Folgen bewusst sind (Security Awareness) und sich regelmäßig weiterbilden?
Ist aus einem Provisorium eine Dauerlösung geworden oder eine längst abgekündigte Lösung nicht ersetzt worden?
Wurden Änderungen oder Erweiterungen kurzfristig bis überstürzt umgesetzt, um zum Beispiel einen Produktlaunch zu unterstützen oder dem unerwarteten Ansturm aufgrund einer Marketingmaßnahme gerecht zu werden?

Darüber hinaus können sowohl E-Commerce- als auch Cybersecurityexperten ein Projekt technologisch analysieren und schnell einschätzen, wo es steht – und dann entsprechende Handlungsempfehlungen aussprechen oder selbst handeln. Hier seien exemplarisch die beiden großen Verfahren des Penetrationstests (als Black-Box-Test), aber auch das Begutachten der eingesetzten Komponenten, von Architekturkonzepten und Implementierungen (White-Box-Test) genannt.

Schritt 2: Juristische Beratung: Es empfiehlt sich generell eine juristische Beratung, die branchen- und dienstleistungsspezifisch aufzeigt, welche Gesetze, Verordnungen und berufsrechtliche Regularien im konkreten Tätigkeitsbereich anzuwenden sind und welche konkreten Anforderungen sich daraus für ein Onlineangebot ergeben. Diese Anforderungen kann ein Technologiedienstleister dann in der Entwicklung berücksichtigen. Es ist wichtig zu verstehen, dass der Betreiber selbst dafür verantwortlich ist, dass sein Onlineangebot rechtskonform umgesetzt wird – und selbstverständlich auch über die ganze Lebensspanne des Angebots konform bleibt. Dies muss auch sich verändernde Inhalte oder Rechtslagen berücksichtigen. Der Technologiedienstleister ist (meist) allein für die Umsetzung zuständig und kann weder eine juristische Beratung durchführen noch für die Rechtssicherheit eines Onlineangebots haften.

Schritt 3: Wahl der passenden Dienstleister: Im Optimalfall kennen Technologiepartner und Dienstleister die Risiken und Aspekte der IT-Sicherheit und beziehen diese bereits von der Planung an in Projekte ein. Nicht immer liegt dieses Themenfeld jedoch in der Expertise der Dienstleister. E-Commerce- und Cybersecurityspezialisten können in diesem Fall potenzielle Schwachstellen oder Handlungsbedarf an bestehenden Projekten identifizieren oder in Form von Beratung den Dienstleister wie Anbieter unterstützen.

Zu Beginn eines E-Commerce-Projekts oder eines Relaunchs bietet es sich an, Security by Design einzuführen und in der Ausschreibung zu berücksichtigen – sowohl als Leistungsgegenstand als auch als Auswahlkriterium für den Dienstleister.

Schritt 4: Plan für den Ernstfall: Absolute Sicherheit gibt es nicht. Ein Unternehmen kann sich auf einen Hackerangriff vorbereiten, um im Ernstfall zum einen schnell reagieren zu können und zum anderen möglichst gut abgesichert zu sein. Ein solcher Plan wird am besten von Juristen, IT-Security-Spezialisten, dem technologischen Shopdienstleister und den Betriebsverantwortlichen in der Organisation gemeinsam entwickelt. Zusätzlich bietet beispielsweise die deutsche Versicherungswirtschaft sogenannte Cybersecurityversicherungen an, mit denen ein Anbieter das verbleibende Risiko und somit die geschäftliche Existenz absichern kann.

Cybersecurity: Jetzt angehen und in Zukunft profitieren

Die Augen vor den Gefahren verschließen und hoffen, dass alles gutgeht, scheint gemäß der Forsa-Umfrage en vogue zu sein. Wer allerdings online langfristig erfolgreich sein will, sollte Verantwortung übernehmen und seine Risiken abschätzen. Damit schützt ein Betreiber ebenso sich wie auch die eigenen Kunden und Partner. Die drastische Zunahme von Cybercrime und die inzwischen einfache Verfügbarkeit von Angriffshilfsmitteln verstärkt die Dringlichkeit des Handlungsbedarfs auf Seiten der Betreiber. Die eco-Studie zeigt auf, dass dieses Bewusstsein im Mittelstand ankommt – aber erst langsam. Den Herausforderungen müssen sich Betreiber von Webplattformen nicht alleine stellen: Mit Partnern, die die Problemstellungen und Risiken kennen und wissen, welche Cybersecurityfragen relevant sind, lässt sich jedes E-Commerce-Projekt sicher planen, umsetzen oder optimieren – am besten, bevor ein Schaden eingetreten ist.