Basic Interface Design SS 08
Ein Semester, vier Aufgaben.
Thema 1: Zeitung lesen...
...und analysieren. Der Fokus liegt auf dem Aufbau des Informationsraums. Dahingehend soll die Vorderseite einer frei gewählten Tageszeitung untersucht werden.
Nachdem die Informationseinheiten gesammelt und geordnet sind, sollen sie auf einer Fläche von 1024 x 768 Pixeln neu strukturiert werden.
Ich wählte den Tagesspiegel als Vorlage. Die Titelseite vom 1. April 2008 sowie die grobe Annalyse befinden sich in der Materialsammlung. Im Grundgerüst sind die Themengebiete Überschrift, Schlagzeilen, Artikel und Index in der genannten Reihenfolge von oben nach unten angeordnet. Ungefähr 3/4 der Seite wird von den Artikeln ausgefüllt, der Rest besteht aus dem Zeitungsnamen, Navigationselementen (z.B. Index und Schlagzeilenleiste) und der Werbung. Im Hinblick auf die Artikelstruktur sollte die Dominanz des Bildes erwähnt werden, das im oberen Bereich der Seite zentral gesetzt wurde.
Die grundlegende Veränderung in meiner Umsetzung zeigt sich in der Sortierung der Artikel. Hierbei spielt die regionale Zugehörigkeit die tragende Rolle. Die Artikel gruppieren sich nun in Regional, Deutschland und Welt. Als Sonderkategorie reiht sich die Meinung in das Schema ein.
Die verschiedenen Navigationselemente sind am linken Rand der Seite gesammelt. Unter dem Zeitungsnamen folgen die Schlagzeilen und danach die 4 genannten Kategorien. In Leserichtung knüpfen dort die Artikel an.
Als Trennungselement ziehen sich angefangen von der hervorgehobenen Kategorie rote Linien um die jeweiligen Bereiche. Die Zusatzkategorie Meinung unterwirft sich formal dem Aufbau der anderen Gruppierungen, unterscheidet sich aber in der Farbgebung.
Das Farbspektrum reduzierte ich auf die Farben Weiß, Schwarz, Dunkelrot, Hellgrau und Dunkelgrau. Die Artikel sind Hellgrau hinterlegt. Die Navigationselemente heben sich durch die dunkelgrauen Flächen hervor.
Diese Art der Umsetzung zog aber einige Probleme nach sich. Die roten Linien sind schwer in ein gesetztes Raster zu integrieren und die verschiedenen Textanteile der Kategorien erzwingen in dem gewählten Schema eine relativ ungünstige Anordnung der Texte. Dies führt dazu, dass die Zugehörigkeit der Artikel zu einer Kategorie uneindeutig ist.
Bei dem zweiten Teil der Aufgabe sollen die Informationseinheiten auf einer 240 x 320 Pixel große Fläche dargestellt werden. Dazu soll ein geeignetes Interaktionskonzept entwickelt werden.
In Anlehnung an das Gestaltungskonzept bei dem großen Screen, werden auf der Startseite alle Artikel nach den Kategorien Region, Deutschland und Welt geordnet angezeigt. Der Kopf besteht aus dem Zeitungsnamen, den Angaben zum Wetter und der Börsenentwicklung und dem Index.
Visuell werden die Kategorien wieder durch Linien getrennt. Die Trennung der verschiedenen Artikel innerhalb einer Kategorie erfolgt durch den Wechsel von dunkel- und hellgrauen Flächen. Die Überschriften sind in Rot jeweils auf dunkle Flächen gesetzt. Die Kurzbeschreibung des Artikels folgt darunter auf einem hellen Grau. Die Artikel weisen jeweils Marker auf der linken Seite auf. Diese fungieren als Navigationshilfe und geben eine Mengenangabe an.
Bei Klick auf den ersten Artikel in der Kategorie Region erscheint auf dem Folgescreen der vollständige Artikel. Über den Scrollbalken kann der ganze Text erfasst werden. Auf der linken Seite erscheinen leicht transparent die Marker, die die Navigation zu den restlichen Artikeln erleichtern.
Bei Klick auf das rote Kästchen mit dem D (für Deutschland) navigiert man zu dem ersten Artikel dieser Reihe. Um zum Hauptmenü zurück zu gelangen, reicht ein Klick auf den Zeitungsnamen.
Thema 2: Kochen mit Dingen...
... soll zu einer alternativen Umsetzung des modernen Kochstellen Interfaces leiten. Hierbei gilt der Verzicht auf die herkömmlichen Bedienelemente, wie Drehregler oder Digitalanzeige. Der Zugriff soll über etwas „Dinghaftes“ erfolgen.
Es sollen folgende Funktionen dabei bedacht werden: Stufeneinstellung von 4 Herdplatten, Temperatureinstellung vom Ofen, Einstellung der Hitzezufuhr im Ofen ( Ober -und Unterhitze, Umluft, Grill, nur Ober-oder nur Unterhitze, Startzeit Garvorgang, Gardauer.
Meine Überlegungen führten mich zu einem recht großen Bedienfeld voller Buttons. Die Idee dahinter nutzt den On- oder Off-Zustand des Buttons als physisches als auch visuelles Interface. Die Umsetzung dieses Konzepts wird in den folgenden Übersichten erklärt. Den Projektnamen „Cookpit“ empfand ich als passend, weil das Aussehen an die Cockpit-Darstellungen aus alten Filmen erinnert.
Herd - Herdplattensteuerung
Herd - Ofensteuerung
Thema 3: KlangBilder ...
... visualisieren eine akustische Begebenheit in einer gegebenen Zeitspanne. Der Klang als auch das Zeitraster sind frei wählbar und daher gehört diese Aufgabe zu den experimentellsten Herausforderungen des Kurses. Die einzige Bedingung ist, dass die Umsetzung nicht Bildschirm-orientiert erfolgt.
Als Vorlage für mein Klangbild wählte ich das Lied „Hello Morning“, bzw. „Hello Tomorrow“ von den YEAH YEAH YEAHS.
Meine Visualisierung bezieht sich stark auf die Interpretation des Textes, der von Karen O. gesungen wird. Auf der ersten Übersicht wird dies näher erläutert. Die folgenden Seiten zeigen verschiedene Ansichten meines Klangbildes.
Thema 4: 1000 Worte ...
... in einem Bild. Dazu soll ein komplexer Sachverhalt ausgesucht werden. Das Thema sowie die Art der Umsetzung steht frei. Das Schaubild darf letztendlich nur keinen Text enthalten.
Für die letzte Aufgabe verbrachte ich viel Zeit mit der Wahl meines Themas. Fest stand, dass ein Bezug zur Biologie im weiteren Sinne bestehen sollte, wie z.B. der Ablauf eines biochemischen Prozesses im Körper. Schließlich blieb ich bei der Thematik Ohnmacht hängen. Die Ohnmacht (Fachbegriff Synkope) ist für jeden ein Begriff, jedoch wissen die meisten nichts über die Ursachen oder den Prozess, der dabei im Körper abläuft. Daher versuchte ich alle wichtigen Fakten zusammenzutragen und in einer Grafik zu visualisieren. Zu den Punkten gehören die Häufigkeit, die Ursachen, der Verlauf, die Vorbeugung und die Maßnahmen, die man nach Ablauf der Ohnmacht einleiten sollte.