Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

Basic Interface Design 07|02 - Dokumentation Karen Hentschel

Basic Interface Design 07|02 - Dokumentation Karen Hentschel

Dokumentation der vier Kursthemen »Zeitung«, »Videorekorder«, »Klangbild« und »1000 Worte«, welche der Auseinandersetzung mit den zentralen Themen und Problemem des Interface Designs dienten.

Zeitung

AUFGABE
In der Aufgabe »Zeitung« sollten die Inhalte der Vorderseite einer Tageszeitung in ihre kleinsten, sinnvollen Informationseinheiten zerlegt und auf Verweise innerhalb der Zeitung untersucht werden, um sie dann für mobile Geräte in einer Auflösungen von 240px x 320px sowie für die übliche Bildschirmdarstellung in einer Auflösung von 1024px x 768px neu aufzubereiten und zu strukturieren.

ANALYSE
Um die Inhalte des Print-Layouts, der von mir für diese Aufgabe gewählten Süddeutschen Zeitung, für die entsprechenden Auflösungen effektiv aufzuarbeiten, bedurfte es zuerst einer genauen Analyse der bisherigen Strukturen und Zusammenhänge der Inhaltselemente. Dazu wurde das Raster der Titelseite in seine semantischen Einheiten zerlegt und auf Hierarchien untersucht, um diese auch auf die Zielauflösungen anwenden zu können.

9AKiiXQQ.png9AKiiXQQ.png

FARBWAHL
Damit der Betrachter sich innerhalb der Layouts gut orientieren kann, wurden unterstützend Farben eingesetzt. Diese dienen vor allem zur Abgrenzung der einzelnen Inhaltsbereiche sollen aber gleichzeitig inhaltliche Hierarchien unterstreichen. Um einen eindeutigen Bezug zur Print-Form der Zeitung herzustellen, wurde hierbei auf die Hausfarbe der Süddeutschen Zeitung zurückgegriffen. Um die einzelnen Inhaltsbereiche als solche zu definieren, wurden Abstufungen dieser Hausfarbe verwendet.

240x320
Um die Vielzahl an Informationen und Inhaltselementen der gedruckten Form der Zeitung unter so eingeschränkten Platzverhältnissen übersichtlich abzubilden, bedurfte es einer komplett neuen Struktur. Vor allem aber bedurfte es einer Schrift, die auch bei kleinster Größe eine möglichst gute Lesbarkeit garantiert. Deshalb habe ich eine Pixelschrift, die Unibody verwendet.

An zentraler Stelle stehen das Logo und das Datum der Ausgabe. Ihm folgt der Leitartikel durch welchen man sich mittels eines Scollbalkens an der rechten Seite bewegen kann. Das Fortlaufen des Balkens am unteren Rand des Screens, signalisiert dem Betrachter, dass der Artikel noch weiter geht.

Der Benutzer erhält zu dem einen Überblick über die Gesamtanzahl der Artikel, welche entsprechend ihrer Position innerhalb der Print-Ausgabe nacheinander aufgelistet sind, und kann darüber auch in einen anderen Artikel springen.

Am Kopf des Screens befindet sich eine, nach den Themenbereichen gegliederte Navigation. Sie informiert den Benutzer über die thematischen Einheiten der Zeitung und ermöglicht ihm die Inhalte auch unter diesen Gesichtspunkten zu betrachten. Die Höhe der farbigen Blöcke über den Menüpunkten visualisiert dabei zusätzlich die Menge der Inhalte zu diesem Themengebiet innerhalb der Ausgabe.

zeitung_240_320_schwarz.pngzeitung_240_320_schwarz.png
zeitung_240_320_schwarz_big.pngzeitung_240_320_schwarz_big.png

1024x768
Bei dieser Auflösung steht für die Aufbereitung der Inhalte wesentlich mehr Platz zur Verfügung, welcher auch die Nutzung anderer Schriften erlaubt. Um einen visuellen Zusammenhang zwischen den beiden Auflösungen für den Benutzer zu verdeutlichen, befindet sich auch bei dieser Darstellung die Sortierung nach Themenbereichen mittels einer Navigation am Kopf des Layouts. Farbige Quadrate vor den Überschriften visualisieren dem Benutzer die thematische Zuordnung des Artikels. Den beiden Leitartikeln wird dabei, entsprechend der Print-Ausgabe der Zeitung eine übergeordnete Rolle zu Teil, indem sie ausführlich anmoderiert werden. Alle anderen Inhalte werden nach dem selben, hierarchischen Muster aufbereitet und in, den Themenbereichen entsprechende Einheiten zusammengefasst abgebildet.

YO63imGo.pngYO63imGo.png

Das PDF der Präsentation finden Sie unter Material zum Download.

Videorekorder

AUFGABE

Beim »Videorekorder« bestand die Aufgabe darin, einen VCR zu konzipieren, dessen Interface, seinen jeweiligen Zustand deutlich und möglichst »dinghaft» kommuniziert ohne sich dabei Displays zu bedienen. Es sollten die Funktionen Start, Stopp, Vorspulen, Zurückspulen, Aufnahme, der Zeitpunkt des Aufnahmestarts sowie der Zeitpunkt des Aufnahmeendes und die Programmwahl für die Aufnahme abbgebildet werden.

ANALYSE
Zu aller erst habe ich mich mit herkömmlichen Videorecordern, ihren Eigenschaften und ihren Besonderheiten auseinander gesetzt um das Prinzip eines Videorekorders und seine für uns als gegeben hingenommene Funktionsweise und Handhabung zu analysieren und auf meine Arbeit anzuwenden. Ziel war es, dem Gedanken der Aufgabe entsprechend, ein neues Konzept zu entwickeln, dass dem Betrachter auf einen Blick alle notwendigen Informationen über den Zustand des Rekorders vermittelt.

AUFBAU
Die Grundform meines Videorekorders ist ein Zylinder. Auf seiner Oberfläche befinden sich neun weitere Zylinder wobei der innerste die Größe eines CD-Lochs und der darauf folgende die einer CD besitzt. Der innerste Zylinder ist zu dem mit einem Druckmechanismus ausgestatten. Auf dem äußersten Zylinder befindet sich das Ziffernblatt einer Uhr, das 24 Stunden darstellt. Ihm folgen sieben Zylinder in farblichen Abstufungen von Blau und Grüntönen die für jeweils einen Wochentag stehen.

BEDIENUNG
Das zu bespielende oder abspielende Medium hat die Form einer CD. In unbespieltem Zustand ist es durchsichtig. Um es abzuspielen oder etwas aufzunehmen muss das Medium in den zweiten Zylinder von innen gelegt werden. Dies wird dem Benutzer schon durch die Größe des zweiten Zylinders vermittelt. Auf seinem Grund befindet sich der Teil einer schwarzen Kreisbahn, die zu den Seiten hin an Farbe abnimmt. Mit Hilfe des Druckknopfes in der Mitte kann das Medium wieder entfernt werden.

Play, Pause und Stop
Das Medium beginnt sofort nach dem Einlegen mit dem abspielen. Durch leichtes Drücken des mittleren Druckknopfes wird das Medium ein wenig über den Grund gehoben und pausiert. Zum stoppen muss der Druckknopf durchgedrückt werden was ein herausspringen des Mediums zur Folge hat.

Vorwärts- und Rückwärts Spulen
Sobald sich das Medium im Play Modus befindet kann man es auch Vor-und Zurückspulen. Dies geschieht indem man das Medium gegen oder mit dem Uhrzeigersinn solange anschiebt, bis die gewünschte Stelle des Films erreicht ist. Das Drehen mit dem Uhrzeigersinn führt zum Vorspulen und das entgegengesetze Drehen zum Zurückspulen. Um dies dem Benutzer näher zu bringen, befindet sich am Boden der Zweiten Zylinders von innen, der Teil einer Kreisbahn, welcher von der Mitte zu den Seiten hin an Farbintensität abnimmt.

Programmieren
Der Videorekorder verfügt über mehrer schwarze und weiße, kleine, ovale Stifte, die durchnummeriert sind und alle Zahlen der Kanalplätze des Fernsehers mehrfach abbilden. Da Fernsehbelegungen individuell eingestellt werden und sich ändern können, kann der Benutzer den Sender anhand der Zahl auf dem Stift, über den von ihm eingestellten Sendeplatz an seinem Fernseher identifizieren.

Auf dem äußersten Zylinder befindet sich ein Ziffernblatt welches die 24 Stunden des Tages mit 15 minütigen Zwischenschritten anzeigt. Die farbigen Zylinder stehen für die einzelnen Tage, wobei Montag durch den innersten, bunte Zylinderverkörpert wird und Sonntag durch den, dem Ziffernblatt am nächsten gelegenen.

Um einen Film an einem bestimmten Wochentag zu einer bestimmten Uhrzeit aufnehmen zu können bedarf es nun zweier Stifte mit der Nummer des Sendeplatzes, der den aufzunehmenden Kanals im Fernseher belegt. Dann müssen die Stifte im Zylinder des entsprechenden Wochentages an der Stelle der Aufnahmeanfangs- und Endzeit positioniert werden. Da die Größe der Zylinder von Außen nach Innen abnimmt und somit den Stiften unterschiedlich viel Platz bieten sind die Stifte oval. So kann man sie von Zylinder zu Zylinder ein wenig drehen um effektiv den selben Raum zur Verfügung zu haben. Zusätzlich sind die Zylinder von außen nach Innen etwas schmaler. So werden die Stifte im Sonntags-Zylinder wagerechte und im Montags-Zylinder senkrecht eingesteckt. Anhand des Ziffernblattes auf dem äußersten Zylinder kann man dann die Aufnahmedauer genau ablesen. Da alle Stifte mehrfach vorhanden sind, können mehrere Aufnahmen des gleichen Senders an verschiedenen Tagen programmiert werden. Es kann aber nur für eine Woche im Voraus programmiert werden.

Nach dem Einlegen eines leeren Mediums kann die Aufnahme dann starten. Ein Medium verfügt immer über eine Aufnahmedauer von 24Stunden. Während der Aufnahme wird ein, der Filmlänge entsprechendes Segment der Oberfläche des Medium transparent eingefärbt. Dies ermöglicht dem Benutzer im Nachhinein den Status des Mediums sowie die Länge des Films eindeutig abzulesen. Um das Ablesen zu erleichtern, befinden sich auf dem Boden des »Medium-Zylinders« Verlängerungen der Striche des Ziffernblattes.

ANSICHTEN DER ZUSTÄNDE DES VIDEOREKORDERS

Videorekorder cleanVideorekorder clean
Videorekorder mit Stiften für die AufnahmeVideorekorder mit Stiften für die Aufnahme
Videorekorder mit leerem MediumVideorekorder mit leerem Medium
Videorekorder mit Medium im beschriebenden ZustandVideorekorder mit Medium im beschriebenden Zustand

Klangbild

AUFGABE
In der Aufgabe »Klangbild« ging es darum, eine Minute einer akustische Begebenheit, sei es ein eine Geräuschkulisse oder ein Lied, in einem Zeitraster zu visualisieren.

ANALYSE
Grundlage meines Klangbildes ist der Tune »ghost hardware« von »burial«.

In meiner ersten Analyse habe ich ihn auf alle Geräusche hin analysiert und versucht deren Auftreten in einer Zeitachse zu notieren. Dadurch entstand ein Bild mit dessen Hilfe man jedes akustische, innerhalb des Tunes verwendete Mittel genau verfolgen konnte. Es war nun möglich genau abzulesen wann welches akustische Mittel und mit welchen anderen kombiniert zum Einsatz kommt. Danach habe ich versucht, meine analytischen Informationen visuell zu Verpacken und ein Bild zu erzeugen, welches die bei mir durch diesen Tune hervorgehobenen Emotionen visualisiert.

FORMSPRACHE
Das Klangbild stellt eine bewachsene Wand dar deren Oberfläche diffus ist. Alle die Struktur beeinflussenden Elemente sowie die Bewachsung sind dabei Bilder für akustische, im Tune verwendete Mittel. Da das Lied neben den synthetischen Geräuschen auch humane beinhaltet, habe ich diese auch durch die Formsprache getrennt. So werden weitestgehend alle floralen Elemente menschlichen Geräuschen zugewiesen, während alle anderen akustischen Mittel die Struktur der Wand verändern.

ZEITRASTER
Das Klangbild wird von links nach rechts gelesen. Innerhalb des Bildes sind die ersten 60 Sekunden des Tunes abgebildet.

DPV0xMBG.pngDPV0xMBG.png

Den analysierten Sound von »burial« finden Sie unter Material zum Download.

1000 Worte...

AUFGABE
Bei »1000 Worte« bestand die Aufgabe darin, einen komplexen Sachverhalt ohne Text oder Worte, möglichst deutlich und klar zu visualisieren.

IDEE
Ich habe für diese Aufgabe versucht, fünf Punkte des Parteiprogramms der »Black Panther Party« als Piktogramme darzustellen:

Kein Parteimitglied darf Narkotika oder Marihuana in seinem Besitz haben, während es für die Partei arbeitet! _Bild 1 der Bildergalerie _

Jedes Parteimitglied, das Narkotika injiziert, wird aus unserer Partei ausgeschlossen! _Bild 2 der Bildergalerie _

Kein Parteimitglied darf eine Waffe, gleich welcher Art, unnötig oder versehentlich gegen irgend jemanden benutzen, richten oder abfeuern! _Bild 3 der Bildergalerie _

Kein Parteimitglied darf in eine andere militärische Streitmacht eintreten als in die schwarze Befreiungsarmee! _Bild 4 der Bildergalerie _

Kommunikation: Alle Zweigstellen haben dem nationalen Hauptbüro schriftliche Wochenberichte vorzulegen! _Bild 5 der Bildergalerie _

PIKTOGRAMME DES BLACK PANTHER PARTEI PROGRAMMS

Punkt 2 des ProgrammsPunkt 2 des Programms
Punkt 5 des ProgrammsPunkt 5 des Programms
Punkt 6 des ProgrammsPunkt 6 des Programms

Das PDF der Präsentation finden Sie unter Material zum Download.

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im ersten Studienabschnitt

Betreuung

foto: Prof. Boris Müller

Entstehungszeitraum

SoSe 07 – WiSe 07 / 08