Design der Software-Benutzeroberfläche

Die Benutzeroberfläche ist die Front-End-Anwendungsansicht, mit der der Benutzer interagiert, um die Software zu verwenden. Der Benutzer kann die Software sowie die Hardware über eine Benutzeroberfläche manipulieren und steuern. Heutzutage ist die Benutzeroberfläche an fast jedem Ort zu finden, an dem digitale Technologie vorhanden ist, direkt von Computern, Mobiltelefonen, Autos, Musik-Playern, Flugzeugen, Schiffen usw.

Die Benutzeroberfläche ist Teil der Software und so konzipiert, dass der Benutzer einen Einblick in die Software erhält. Die Benutzeroberfläche bietet eine grundlegende Plattform für die Interaktion zwischen Mensch und Computer.

Die Benutzeroberfläche kann je nach zugrunde liegender Hardware- und Softwarekombination grafisch, textbasiert und Audio-Video-basiert sein. Die Benutzeroberfläche kann Hardware oder Software oder eine Kombination aus beiden sein.

Die Software wird populärer, wenn ihre Benutzeroberfläche:

  • Attractive
  • Einfach zu benutzen
  • Reaktionsschnell in kurzer Zeit
  • Klar zu verstehen
  • Konsistent auf allen Schnittstellenbildschirmen

Die Benutzeroberfläche ist grob in zwei Kategorien unterteilt:

  • Befehlszeilenschnittstelle
  • Grafische Benutzeroberfläche

Befehlszeilenschnittstelle (CLI)

CLI war ein großartiges Werkzeug für die Interaktion mit Computern, bis die Videoanzeigemonitore entstanden. CLI ist die erste Wahl vieler technischer Benutzer und Programmierer. CLI ist die Mindestschnittstelle, die eine Software ihren Benutzern bereitstellen kann.

Die CLI bietet eine Eingabeaufforderung, den Ort, an dem der Benutzer den Befehl eingibt und an das System weiterleitet. Der Benutzer muss sich die Syntax des Befehls und seine Verwendung merken. Frühere CLI wurden nicht so programmiert, dass sie die Benutzerfehler effektiv behandeln.

Ein Befehl ist eine textbasierte Referenz auf einen Befehlssatz, von dem erwartet wird, dass er vom System ausgeführt wird. Es gibt Methoden wie Makros und Skripte, die dem Benutzer die Bedienung erleichtern.

Die CLI verbraucht im Vergleich zur GUI weniger Computerressourcen.

CLI-Elemente

Eine textbasierte Befehlszeilenschnittstelle kann die folgenden Elemente enthalten:

  • Command Prompt- Es ist ein textbasierter Notifier, der hauptsächlich den Kontext anzeigt, in dem der Benutzer arbeitet. Es wird vom Softwaresystem generiert.

  • Cursor- Es ist eine kleine horizontale Linie oder ein vertikaler Balken mit der Höhe der Linie, um die Position des Zeichens während der Eingabe darzustellen. Der Cursor befindet sich meist im blinkenden Zustand. Es bewegt sich, während der Benutzer etwas schreibt oder löscht.

  • Command- Ein Befehl ist eine ausführbare Anweisung. Es kann einen oder mehrere Parameter haben. Die Ausgabe bei der Befehlsausführung wird inline auf dem Bildschirm angezeigt. Wenn die Ausgabe erstellt wird, wird in der nächsten Zeile die Eingabeaufforderung angezeigt.

Grafische Benutzeroberfläche

Die grafische Benutzeroberfläche bietet dem Benutzer grafische Mittel zur Interaktion mit dem System. Die grafische Benutzeroberfläche kann eine Kombination aus Hardware und Software sein. Über die GUI interpretiert der Benutzer die Software.

In der Regel verbraucht die GUI mehr Ressourcen als die CLI. Mit fortschreitender Technologie erstellen die Programmierer und Designer komplexe GUI-Designs, die effizienter, genauer und schneller arbeiten.

GUI-Elemente

Die GUI bietet eine Reihe von Komponenten für die Interaktion mit Software oder Hardware.

Jede grafische Komponente bietet eine Möglichkeit, mit dem System zu arbeiten. Ein GUI-System enthält folgende Elemente:

  • Window- Ein Bereich, in dem der Inhalt der Anwendung angezeigt wird. Inhalte in einem Fenster können in Form von Symbolen oder Listen angezeigt werden, wenn das Fenster die Dateistruktur darstellt. Für einen Benutzer ist es einfacher, in einem Erkundungsfenster im Dateisystem zu navigieren. Windows kann auf die Bildschirmgröße minimiert, in der Größe geändert oder maximiert werden. Sie können an eine beliebige Stelle auf dem Bildschirm verschoben werden. Ein Fenster kann ein anderes Fenster derselben Anwendung enthalten, das als untergeordnetes Fenster bezeichnet wird.

  • Tabs - Wenn eine Anwendung die Ausführung mehrerer Instanzen von sich selbst zulässt, werden diese als separate Fenster auf dem Bildschirm angezeigt. Tabbed Document Interfacehat mehrere Dokumente im selben Fenster geöffnet. Diese Oberfläche hilft auch beim Anzeigen des Einstellungsfensters in der Anwendung. Alle modernen Webbrowser verwenden diese Funktion.

  • Menu- Das Menü besteht aus einer Reihe von Standardbefehlen, die zusammengefasst und an einer sichtbaren Stelle (normalerweise oben) im Anwendungsfenster platziert werden. Das Menü kann so programmiert werden, dass es bei Mausklicks angezeigt oder ausgeblendet wird.

  • Icon- Ein Symbol ist ein kleines Bild, das eine zugehörige Anwendung darstellt. Wenn Sie auf diese Symbole klicken oder darauf doppelklicken, wird das Anwendungsfenster geöffnet. Das Symbol zeigt Anwendungen und Programme, die auf einem System installiert sind, in Form kleiner Bilder an.

  • Cursor- Interagierende Geräte wie Maus, Touchpad und digitaler Stift werden in der GUI als Cursor dargestellt. Der Bildschirmcursor folgt den Anweisungen der Hardware in nahezu Echtzeit. Cursor werden in GUI-Systemen auch als Zeiger bezeichnet. Sie werden zur Auswahl von Menüs, Fenstern und anderen Anwendungsfunktionen verwendet.

Anwendungsspezifische GUI-Komponenten

Eine GUI einer Anwendung enthält eines oder mehrere der aufgelisteten GUI-Elemente:

  • Application Window - Die meisten Anwendungsfenster verwenden die von Betriebssystemen bereitgestellten Konstrukte, aber viele verwenden ihre eigenen vom Kunden erstellten Fenster, um den Inhalt der Anwendung zu enthalten.

  • Dialogue Box - Es ist ein untergeordnetes Fenster, das eine Nachricht für den Benutzer enthält und eine Aktion anfordert. Beispiel: Die Anwendung generiert einen Dialog, um vom Benutzer eine Bestätigung zum Löschen einer Datei zu erhalten.

  • Text-Box - Bietet dem Benutzer einen Bereich zum Eingeben und Eingeben von textbasierten Daten.

  • Buttons - Sie imitieren reale Schaltflächen und werden verwendet, um Eingaben an die Software zu senden.

  • Radio-button- Zeigt die verfügbaren Optionen zur Auswahl an. Unter allen angebotenen kann nur eine ausgewählt werden.

  • Check-box- Funktionen ähnlich dem Listenfeld. Wenn eine Option ausgewählt ist, wird das Kontrollkästchen als aktiviert markiert. Es können mehrere Optionen ausgewählt werden, die durch Kontrollkästchen dargestellt werden.

  • List-box - Bietet eine Liste der verfügbaren Elemente zur Auswahl. Es kann mehr als ein Element ausgewählt werden.

Weitere beeindruckende GUI-Komponenten sind:

  • Sliders
  • Combo-box
  • Data-grid
  • Dropdown-Liste

Designaktivitäten für Benutzeroberflächen

Es gibt eine Reihe von Aktivitäten zum Entwerfen der Benutzeroberfläche. Der Prozess des GUI-Designs und der Implementierung ist SDLC ähnlich. Jedes Modell kann für die GUI-Implementierung zwischen Wasserfall-, iterativem oder spiralförmigem Modell verwendet werden.

Ein Modell, das für das Design und die Entwicklung von GUI verwendet wird, sollte diese GUI-spezifischen Schritte erfüllen.

  • GUI Requirement Gathering- Die Designer möchten möglicherweise eine Liste aller funktionalen und nicht funktionalen Anforderungen der GUI haben. Dies kann dem Benutzer und seiner vorhandenen Softwarelösung entnommen werden.

  • User Analysis- Der Designer untersucht, wer die Software-GUI verwenden wird. Die Zielgruppe ist wichtig, da sich die Designdetails je nach Wissens- und Kompetenzniveau des Benutzers ändern. Wenn der Benutzer technisch versiert ist, kann eine erweiterte und komplexe Benutzeroberfläche integriert werden. Für Anfänger sind weitere Informationen zur Vorgehensweise bei Software enthalten.

  • Task Analysis- Designer müssen analysieren, welche Aufgabe die Softwarelösung erfüllen soll. Hier in der GUI spielt es keine Rolle, wie es gemacht wird. Aufgaben können hierarchisch dargestellt werden, indem eine Hauptaufgabe in kleinere Unteraufgaben unterteilt wird. Aufgaben bieten Ziele für die GUI-Präsentation. Der Informationsfluss zwischen Unteraufgaben bestimmt den Fluss der GUI-Inhalte in der Software.

  • GUI Design & implementation- Designer entwerfen nach Informationen über Anforderungen, Aufgaben und Benutzerumgebung die GUI und implementieren sie in Code und binden die GUI mit funktionierender oder Dummy-Software im Hintergrund ein. Es wird dann von den Entwicklern selbst getestet.

  • Testing- GUI-Tests können auf verschiedene Arten durchgeführt werden. Die Organisation kann eine interne Inspektion durchführen, die direkte Einbeziehung der Benutzer und die Veröffentlichung der Beta-Version sind nur einige davon. Das Testen kann Benutzerfreundlichkeit, Kompatibilität, Benutzerakzeptanz usw. umfassen.

GUI-Implementierungstools

Es stehen verschiedene Tools zur Verfügung, mit denen die Designer per Mausklick die gesamte GUI erstellen können. Einige Tools können in die Softwareumgebung (IDE) eingebettet werden.

GUI-Implementierungstools bieten leistungsstarke GUI-Steuerelemente. Für die Softwareanpassung können Designer den Code entsprechend ändern.

Es gibt verschiedene Segmente von GUI-Tools, je nach Verwendung und Plattform.

Beispiel

Mobile GUI, Computer GUI, Touchscreen-GUI usw. Hier ist eine Liste einiger Tools, die zum Erstellen einer GUI nützlich sind:

  • FLUID
  • AppInventor (Android)
  • LucidChart
  • Wavemaker
  • Visual Studio

Benutzeroberfläche Goldene Regeln

Die folgenden Regeln sind die goldenen Regeln für das GUI-Design, die von Shneiderman und Plaisant in ihrem Buch (Designing the User Interface) beschrieben wurden.

  • Strive for consistency- In ähnlichen Situationen sollten konsistente Aktionssequenzen erforderlich sein. In Eingabeaufforderungen, Menüs und Hilfebildschirmen sollte eine identische Terminologie verwendet werden. Konsistente Befehle sollten durchgehend verwendet werden.

  • Enable frequent users to use short-cuts- Der Wunsch des Benutzers, die Anzahl der Interaktionen zu reduzieren, steigt mit der Häufigkeit der Nutzung. Abkürzungen, Funktionstasten, versteckte Befehle und Makrofunktionen sind für einen erfahrenen Benutzer sehr hilfreich.

  • Offer informative feedback- Für jede Bedieneraktion sollte ein Systemfeedback vorhanden sein. Bei häufigen und geringfügigen Aktionen muss die Reaktion bescheiden sein, während bei seltenen und größeren Aktionen die Reaktion umfangreicher sein muss.

  • Design dialog to yield closure- Abfolgen von Aktionen sollten in Gruppen mit Anfang, Mitte und Ende organisiert werden. Das informative Feedback nach Abschluss einer Gruppe von Maßnahmen gibt den Bedienern die Zufriedenheit mit der Leistung, ein Gefühl der Erleichterung, das Signal, Notfallpläne und -optionen aus ihren Gedanken zu streichen, und dies zeigt, dass der Weg frei ist, um sich auf die nächste vorzubereiten Gruppe von Aktionen.

  • Offer simple error handling- Entwerfen Sie das System so weit wie möglich, damit der Benutzer keinen schwerwiegenden Fehler macht. Wenn ein Fehler gemacht wird, sollte das System in der Lage sein, ihn zu erkennen und einfache, verständliche Mechanismen zur Behandlung des Fehlers anzubieten.

  • Permit easy reversal of actions- Diese Funktion lindert Ängste, da der Benutzer weiß, dass Fehler rückgängig gemacht werden können. Die einfache Umkehrung von Aktionen fördert die Erforschung unbekannter Optionen. Die Umkehrbarkeitseinheiten können eine einzelne Aktion, eine Dateneingabe oder eine vollständige Gruppe von Aktionen sein.

  • Support internal locus of control- Erfahrene Bediener wünschen sich nachdrücklich das Gefühl, dass sie für das System verantwortlich sind und dass das System auf ihre Handlungen reagiert. Entwerfen Sie das System so, dass Benutzer eher zu Initiatoren von Aktionen als zu Respondern werden.

  • Reduce short-term memory load - Die Einschränkung der Verarbeitung menschlicher Informationen im Kurzzeitgedächtnis erfordert, dass die Anzeigen einfach gehalten, mehrseitige Anzeigen konsolidiert, die Häufigkeit von Fensterbewegungen reduziert und ausreichend Trainingszeit für Codes, Mnemoniken und Aktionssequenzen zugewiesen wird.