Basics Interface Design | WS 05_06
Eine Dokumentation der 4 Kursthemen ("Zeitung lesen", "Videorecorder", "Narratives in Time and Space" sowie "Hypertext") und meiner Ideen- und Konzeptlösungen aus dem WS 05_06.
Thema: Zeitung lesen
Aufgabe:
Schritt a: 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.
Schritt b: 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.
Idee und Umsetzung
Untersucht habe ich ein Titelblatt der Berliner Morgenpost. Dieses habe ich als allererstes grob schematisiert - jeder Rubrik eine Farbe zugeordnet und die einzelnen Artikel so markiert.
Als Darstellung und Verlinkung der Informationen der Titelseite habe ich mich für einen Würfel entschieden.
Auf der Oberseite des Würfels befinden sich die einzelnen Artikel bzw. Teaser der Titelseite als kleine "Fähnchen" mit der Headline. Zieht man so einen Teaser heraus, hängt daran der komplette dazugehörige Artikel. Geordnet sind die einzelnen Artikel in Boxen. Jede Box enthält eine komplette Rubrik der Zeitung (Politik, Gesellschaft,...) und ist an der Vorderseite beschriftet. So hat der Leser die Möglichkeit über zusätzlichen diesen Ordnungsweg sich nur die Rubriken zu entnehmen, die ihn interessieren Durch die Draufsicht hat er aber trotzdem den Überblick über das Tagesgeschehen.
Der Zeitungswürfel
Thema 2: Videorekorder bedienen
Aufgabe:
__Schritt a: __
Video / Fotorecherche zu Bedien- und Steuerungselementen in der Küche und in der Wohnung allgemein.
__Schritt b: __
VCR konzipierenEs soll neu über die Bedienung von Videorekordern 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 Küchengegenständen nachvollzogen werden.
Idee und Umsetzung
Auf der Suche nach geeigneten Haushaltsgegenständen stieß ich zum einen auf den Toaster - er übernimmt den Part der Abspielsteuerung (Start/Stop/Pause/Fortwärts/Zurück) [-> Playback]sowie auf einen großen Messbecher. Mit dem kontrolliere ich in meinem Model die zeitgesteuerte Aufnahme [-> Timer].
Playback:
Die Videocassette wird oben in den Toaster eingelegt. Per Drehhebel kann zwischen den verschiedenen Abspielmodi gewählt werden.
Timer:
Zum Aufnehmen einer Sendung zu einer bestimmten Zeit wird der Messbecher bis zum Rand mit Wasser gefüllt. Als nächstes der Timer auf den Aufnahmezeitpunkt geschoben (in h ausgehend vom Zeitpunkt der Programmierung) sowie der Sendeschlauch auf den Zeitpunkt des Aufnahmestops. Startet man jetzt die Programmierung, läuft das "Programm" durch den Abflusschlauch ab, bis der Wasserstand den Timer erreicht. Dieser schaltet ein Ventil um und das Programm tropft durch den Sendeschlauch in eine der gewählten Programmtassen. Dort wird das Programm gesammelt, bis der Wasserstand niedriger ist als der Sendeschlauch und kein Programm/Wasser mehr abfließt.
Das aufgenommene Programm steht nun zur Wiedergabe in der Tasse bereit.
Breakfast VCR
Thema: Narratives in Time and Space - 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.
Idee und Umsetzung
Als Klangerlebnis habe ich die Aufnahme eines anfahrenden LKW gewählt. Die Aufnahme wurde im Fahrerstand des Trucks gemacht, somit sind Motor- und Schaltgeräusche deutlich zu erkennen.
Als Kontrast zum rauen und lauten Dröhnen der Maschine habe ich als Visualisierung eine Berglandschaft gewählt.
In der Illustrator-Zeichnung werden 5 verschiedene Dimensionen durch Details in der Landschaft visualisiert:
- Zeit (link -> rechts)
- gefahrene Geschwindigkeit (Anstieg der Seilbahn)
- Lautstärke des Motors (Höhe der Berge)
- eingelegter Gang (Höhe der Wolken)
- zurückgelegte Wegstrecke (Abstand der Kühe)
Alle diese Informationen lassen sich aus der Aufnahme -abstrahiert- herausleiten. Exakte qualitative Aussagen über Geschwindigkeit und damit den zurückgelegten Weg sind natürlich nicht möglich, daher wird ohne Maßangaben gearbeitet.
das komplette Klangbild als Flash-Animation
Thema 4: Hypertext
Aufgabe:
Es soll ein Hypertext- bzw. ein Hyperbildsystem konzipiert werden, in dem eine nichtlineare Geschichte erzählt wird. Diese Geschichte soll entweder auf einer schon existierenden Erzählung beruhen oder mehrere bereits existierende Erzählungen miteinander kombinieren. Wichtig ist, daß der Verlauf der interaktiven Geschichte vom Benutzer bestimmt werden kann.
Zur Vorbereitung der Umsetzung sollen die Erzählstränge in einem Diagramm dargestellt werden, aus dem die Wege durch die Geschichte hervorgehen.
Das System soll in reinem HTML umgesetzt und im Browser präsentiert werden. Es ist auch möglich, mithilfe von ImageMaps reine Bildergeschichten
zu erzählen.
Idee
Die Grundidee kam durch ein zufällig im Netz gefundenes "Gegenscript" http://www.xs4all.nl/~egbg/duits.pdf mit dem man sich gegen wissbegierige Telefon-Marketer und deren Umfragen zur Wehr setzen sollte. Dabei soll der TeleMarketer durch den Gesprächsfaden unterbrochen und mit -relativ trivialen- Gegenfragen überrumpelt werden.
Das Gegenscript soll damit enden, dass der Gegenscripter auflegt und der TeleMarketer seine Frage nicht beantwortet bekommen hat.
Umsetzung
Mein Ziel war es also, dieses GegenScript in ein navigierbares Gespräch umzuwandelt, bei dem man von einzelnen markanten Knotenpunkten das komplette Gespräch in eine andere Richtung leiten kann. Dazu habe ich ein Schema mit möglichen Fragen, Gegenfragen, Reaktionen und Antworten erstellt.
Bei der Erstellung dieses Grundscripts hat mir eine Freundin geholfen, die selbst als TeleMarketer arbeitet und diverse Gesprächsverläufe, Fragen und Reaktionen gut kennt. Sie hat später auch zusammen mit mir den Original-Anruf geführt und aufgenommen.
Das Script ist relativ komplex, auch wenn noch lange nicht alle eventuellen Gesprächsmöglichkeiten darin auftauchen. Hier habe ich mich auf die naheliegendsten und wahrscheinlichsten beschränkt.
The Call - ein Anruf mit Umwegen
Nachdem das Script erstellt war, ging es ans Aufnehmen der einzelnen Gesprächsfäden, sodass jeder Gesprächsverlauf mit einem anderen kombinierbar wäre.
Zusammengebaut habe ich das ganze Projekt dann in Flash, da hier die Soundimplementierung einfacher und problemloser machbar ist als in reinem Html.
Das Gespräch kann jetzt durch das Drücken auf die Controller-Tasten gesteuert werden. Dabei hilf die schematische Übersicht den gegenwärtigen Standpunkt sowie die Reaktionsmöglichkeiten der Telefonierenden auszuwählen.
(ca 1.80 MB)
