Basics Interface Design | SS06 | Alexander Schubert
Kursdokumentation: Basic Interfacedesign, Prof. Boris Müller, Sommersemester 2006
A1 | Zeitung
Aufgabe:
"Der Informationsraum einer Tageszeitung soll untersucht werden. Dazu soll die Vorderseite einer Tageszeitung in ihre kleinsten sinnvollen Informationseinheiten zerlegt werden. Weiterhin sollen alle »Hyperlinks« auf der Vorderseite verfolgt werden – also Verweise auf Inhalte, die erst im hinteren Teil der Zeitung auftauchen. Es sollen sowohl die Hinweise als auch die Artikel selbst gezeigt werden.
Die Informationseinheiten sollen in einem räumlichen Kontext wieder zu größeren Sinneinheiten zusammengefügt werden. Hier können und sollen
durch Zuordnung zu bestehenden Raumstrukturen neue Bedeutungen geschaffen werden. Bestehende Raumstrukturen sind z.B. Wohnungen, Städte, Pläne, Maschinen, etc."
Lösung:
Ferdi und Ich haben versucht, nach natürlichen Verlinkungen in unseren Lebensbereichen zu suchen. Wir sind schnell auf eine Art Nahrungskettenstruktur gekommen und gepaart mit unserer Angelleidenschaft, sind wir auf die Raumstruktur gestoßen.
Der Angler (Leser) geht wie gewohnt an seinen Stammteich und hält seine Angel ins Wasser. Auf seiner Artenliste stehen die Aufmacher der Zeitung drauf. Je nachdem was für einen Fisch (Headline | Teaser) Ihn interessiert, benutzt er den passenden Köder für diese Tierart. Der Leser fängt nun an zu fischen und zieht jetzt den Betrug bei Jauchfisch aus dem Wasser. Da der Artikel (Fisch) aber noch weitere Informationsstrukturen, sprich Hyperlinks zu anderen Seiten und Artikeln innerhalb der Zeitung aufweist, steckt in dem Fisch, wenn man Ihn ausnimmt, ein noch kleinerer Fisch, der zur natürlichen Beute des größeren Fisches gehört, indem dann die weiteren Infos verborgen sind.
Ab und zu passiert es aber auch beim angeln, dass man auf lästige Beute (Werbung) trifft, die dann fachgerecht wieder im See entsorgt wird.
A2 | Videorekorder
Aufgabe:
"Es soll neu über die Bedienung von DVD-Rekordern nachgedacht werden. Dazu soll zuerst eine kleine Analyse (Storyboard / Flowchart / Liste) davon gemacht werden, wie normalerweise ein Rekorder programmiert wird. Danach soll dieser Vorgang mit Hilfe von Alltagsgegenständen nachvollzogen werden. Folgende Funktionen sollen abgebildet werden: Start, Stop, Vorspulen, Zurückspulen, Aufnahme, Zeitpunkt Aufnahmestart, Zeitpunkt Aufnahmeende, Programmwahl für Aufnahme.
Folgende Funktionen sollen abgebildet werden: Start, Stop, Vorspulen,
Zurückspulen, Aufnahme, Zeitpunkt Aufnahmestart, Zeitpunkt
Aufnahmeende, Programmwahl für Aufnahme."
Lösung:
Ausgehend von einer Panflöte bin ich auf die Idee gekommen, einen DVD-Player mit Hilfe von Luft zu steuern. Ich habe mir dann auch Acrylglasrohre besorgt und ein Modell gebaut, mit dem man die Funktionen darstellen kann. Da man Luft aber schlecht als Eingabemedium nutzen kann, habe Ich in dem Rohr eine kleine Kugel installiert, die dann so ähnlich arbeitet, wie ein Potentiometer. Man bläst oder saugt die Kugel in dem Rohr hin und her. Daher hat man verschiedene Möglichkeiten diese „Potentiometer“ zu programmieren. Die ursprüngliche Programmierung ist mir leider abhanden gekommen, und sie war auch nicht ausgereift genug.
Vor und zurückspulen funktioniert über das ansaugen und wegblasen der Kugel. Je nachdem in welcher Lage sich die Panflöte und damit auch die Kugel befindet, wird die DVD abgespielt, pausiert, aufgenommen oder gestoppt.
Für die Programmierung war mit wichtig sie Schritt für Schritt darzustellen. Also angefangen mit Sender, Datum, Start und Ende. Da man maximal 10 Ziffern (0-9) braucht um Datum, Sender und Zeit darzustellen, kann man alles mit einer Panflöte, die genügend Rohre hat einstellen. Man programmiert das Aufnahmegerät mit den 10 Saug und Blasstufen. Unterstuzend fungiert dann noch die verschiedene Farbigkeit der Kugel.
A3 | Klangbild
Aufgabe:
"Es soll eine akustische Begebenheit in einem Zeitraster visualisiert werden. Der zeitliche Ablauf der Begebenheit soll also für den Betrachter nachvollziehbar sein. Das Format der Visualisierung kann frei gewählt werden. Einzige Einschränkung: es soll keine Bildschirm-orientierte Lösung entwickelt werden. Falls möglich soll die akustische Begebenheit aufgezeichnet und auch präsentiert werden."
Lösung:
Für diese Aufgabe habe Ich Ennio Morricones – The Man With A Harmonica (Spiel mir das Lied vom Tod) ausgewählt und es in seine musikalischen Bestandteile zerlegt. Wichtig war mir, das Lied nicht nur zu decodieren um es dann neu zu codieren, sondern es so zu gestalten, dass man es problemlos, ohne großen Aufwand nachspielen kann.
Ich habe daher mehrere Codierungsmöglichkeiten entwickelt, die sich zum teil auf das klassische Notensystem beziehen.
Die Mundharmonika ist für mich das stärkste Element in diesem Stück. Pausen und Disharmonien, die nur durch drei Noten (e, c und es in F-Dur) erzeugt werden waren für mich der Kern der grafischen Aufbereitung.
A4 | Virtuell>>Real
Aufgabe:
"Es soll eine komplexe, analoge Aktivität gefunden werden. (Z.B. Essen
kochen, Autos reparieren, eine Maschine steuern, Autofahren, eine Blinddarmoperation,
etc.) Für diese Aktivität soll dann eine digitale Benutzeroberfläche
entwickelt werden. Es ist unerheblich, wie die eigentliche
Maschine aussieht, die solche Aktivitäten dann ausführt. Wichtig ist aber,
dass die digitale Benutzeroberfläche softwarebasiert ist und dem Benutzer
ein hohes Maß an Steuerungs- und Gestaltungsmöglichkeiten bieten
sollte."
Lösung:
Nach meiner Ideenskizze (Real_Virtuell.pdf), wollte ich unbedingt eine Benutzeroberfläche für den Bedarfsfall einer Reparatur oder Wartung meines Motorrades kreieren. Dazu habe Ich ein Flow Chart angefertigt, welches alle Abläufe für einen Motorölwechsel beinhaltet (siehe motortricks.pdf).
Da ein Ölwechsel eine ziemlich lineare Angelegenheit ist, aber bei unsachgemäßer Machart zu fatalen Motorschäden führen kann, muss die Benutzeroberfläche sehr eindringlich und fordernd gestaltet werden. Daher fragt mein Programm nach jedem Schritt nach und läuft erst weiter, wenn alle Eventualitäten geklärt und die Folgen erläutert wurden. Das Programm bietet immer nur die Werkzeuge an, die auch wirklich zu erfüllen des jeweiligen u Schrittes nötig sind an. Man wählt dann einfach ein Tool und zieht es auf die zu reparierende Fläche. Ein Pop Up kündigt dann das Ende des Vorganges an und das Programm gibt zahlreiche Tipps.
Der komplette Ölwechsel ist unter (_lwechsel.pdf) zu finden. Viel Spaß beim anschaun!
