In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre
In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre
Dokumentation des Kurses Visual Interfacedesign Grundlagen bei Prof. Constanze Langer. Bearbeitet von Fabian Dinklage.
Kursbeschreibung: Nach wie vor spielt der visuelle Sinn eine zentrale Rolle im Interfacedesign. Denn trotz vielfacher Innovation im Bereich multi-modaler Interaktion ist die zentrale Schnittstelle zwischen Mensch und Computer nach wie vor der Screen – in allen Größen und Ausprägungen. Das Fach Visual Interfacedesign stellt grafische und semiotische sowie zeit- und interaktionsbasierte Fragen im Bereich interaktiver visueller Systeme formal-ästhetisch in den Mittelpunkt.
Ziel des Kurses ist es, dass die Teilnehmer_innen die Möglichkeiten der visuellen Darstellung und grundlegende Methoden für Interfaceentwürfe kennenlernen und ihre Anwendung anhand von kleineren Aufgaben üben, präsentieren und ihre gestalterischen Prozesse und Entscheidungen nachvollziehbar aufzeigen und begründen können.
Inhalt der ersten Aufgabe war es die natürliche Umgebung nach dem Auftauchen der Grundformen Punkt, Linie und Rechteck zu untersuchen. Wie lassen sich diese isolieren und ästhetisch ansprechend inszenieren. Eine weitere optionale Vorgabe war das Weglassen von Farbe, was dazu führt dass die entstandenen Fotos auf die Bildkomposition reduziert werden konnten. Die Intention der Aufgabe war eine Schärfung der visuellen Wahrnehmung in Bezug auf die grafischen Grundformen. Die Bearbeitung der Aufgabe führte dazu, dass man einen Perspektivwechsel vornehmen musste und seine Umgebung unter anderen Gesichtspunkten betrachtete.
Aufgabe war es, sich etwas näher mit einem GUI Grundelement auseinander zu setzen. Hierbei sollten unterschiedliche Gestaltungsansätze für das Element ausgearbeitet werden. Vorgabe der Aufgabe war es gänzlich auf die Verwendung von Farbe zu verzichten und stattdessen mit Parametern wie Strichstärke, Textur, Helligkeit und Form experimentiert werden.
Ich habe mich für den bestimmten Fortschrittsbalken entschieden, der den Benutzer darüber informiert, wie weit ein Prozess dieser bereits vorangeschritten ist. Die vier Gestaltungsansätze zeigen was es benötigt um als Fortschrittsbalken erkannt zu werden.
Aufgabe war es die Grundformen Linie, Kreis, Quadrat bewusst in der eigenen Umgebung wahrzunehmen und in einem visuell ansprechenden Kontext fotografisch festzuhalten.
Der Anspruch während der Fotosafari war es also die Grundformen soweit von ihrer Umgebung zu isolieren, dass sie im Idealfall für sich stehen und einen eigenen Raum schaffen. Durch die Änderung des Bildausschnitts und die Konvertierung in Schwarzweiß ließen sich die aufgenommenen Szenen ausreichend verfremden.
Die Hauptaufgabe des Kurses war es sich eingehend mit einem Gerät zu beschäftigen, welches ein über ein Display zur Bedienung verfügt. Dieses sollte dann in mehreren Phasen in Bezug auf unterschiedliche Kriterien analysiert werden. Ich habe mich für den Laserdrucker in unserer Wohnung entschieden, dessen auf den Funktionsumfang relativ übersichtlich schien.
Im ersten Teil galt es die Informationsstruktur des Bediensystems ganzheitlich zu erfassen. Konkret bedeutet dies jeden potenziell erreichbaren Menüpunkt des Geräts zu dokumentieren und alle möglichen Funktionen darzustellen, die dem Benutzer zur Verfügung stehen. Abschließend sollten die gesammelten Daten in eine begründete ansprechende visuelle Darstellungsform gebracht werden. Nach Möglichkeit sollte die Grafik einfarbig gehalten sein.
Nachdem uns unterschiedliche Darstellungsformen nähergebracht wurden, entschied ich mich dafür die Informationsarchitektur des Druckers radial anzulegen. Das konzeptuelle Gerüst der Menüführung ließ sich auf die Art und Weise gut verdeutlichen. Die Anzahl der Klicktiefen wird über die Anzahl der Kreise dargestellt. Die vier unterschiedlichen Hauptmenüpunkte erhalten jeweils ein eigenes Symbol.
Im zweiten Teil sollte ein konkretes Use-Case Szenario visualisiert werden. Im Falle meines Laserdruckers möchte der Benutzer das Gerät in Benutzung nehmen und eine kabellose Verbindung mit dem Computer per Setup Assistent herstellen. Neben der Darstellung der Vorbedingungen für den Use Case habe ich das User Panel abgebildet und die Abfolge der einzelnen Screens, die dem Nutzer dargestellt werden, um sich zum Setup Assistenten zu navigieren.
Abschließend folgte die Aufgabe den analysierten Use-Case zu optimieren und ein Redesign vorzunehmen. Dieses konnte sowohl im Bereich der Menüführung, Feedbackmeldungen an den Nutzer oder im physikalischen Userinterface liegen. Im Fall der Einrichtung der Netzwerkverbindung besteht besonders im Teil der Eingabe des Netzwerkschlüssels Optimierungsbedarf. Die Navigation läuft über drei Tasten, die im schlimmsten Fall einige hundert Mal betätigt werden müssen. Abhilfe soll der Einsatz eines neuen physischen Buttons schaffen, der über kontinuierliches Drehen eine wesentlich schnellere Eingabe ermöglicht und die Funktion von 3 Buttons vereint.
Fazit: Insgesamt ein überaus interessanter Kurs, der einen breitgefächerten Überblick zur Visualisierung und Strukturierung von Informationen gibt. Der theoretische Input gibt ebenso jede Menge Anregungen, sodass für jeden etwas dabei ist, um sich weitergehend mit der Materie zu befassen.