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
12FOId-XD Interaction Design 1.151 Grundlagen Interfacedesign WS 2015/2016 Dozent: Prof. Boris Müller
Es soll eine digitale Fassung ihres Lieblingsbuches gestaltet werden. Das Buch kann ein Roman, ein Sach-, Koch-, oder Fachbuch, oder auch ein Gedichtband sein. (Keine Comics!)
Die digitale Fassung des Buches soll exemplarisch anhand von mindestens vier Screens in zwei verschiedenen Formaten vorgestellt werden - mindestens zwei horizontale Screens im Format von 1024×768 Pixeln (XGA) und mindestens zwei vertikale Screens im Format von 240×320 Pixeln (QVGA).
Die Screens sollen nicht nur die Inhalte des Buchs wiedergeben, sondern sollen auch das Navigationskonzept verdeutlichen, mit dem die Inhalte des digitalen Buches erschlossen werden können.
Lesbarkeit und Klarheit der Darstellung sind die wichtige Kriterien bei der Bearbeitung der Aufgabe.
Bei diesem Projekt habe ich mit [Marc-Andre Nagusch](https://incom.org/profil/7126 „Marc-Andre Nagusch“) zusammengearbeitet.
Wir haben uns zur Ausarbeitung der Aufgabe für das Sachbuch »Die Geschichte der Welt in 100 Objekten« entschieden.
Die sicherlich größte Herausforderung ergab sich aus dem massiven Inhaltsverzeichnis der gewählten Vorlage, das neben mehreren Kapiteln zusätzliche Unterkapitel aufweist. Wir mussten daher ein Menü gestalten, welches die Navigation in drei Tiefenebenen (Kapitel, Unterkapitel, Unterkapitelvorschau) erlaubt, dabei aber dennoch intuitiv bedienbar bleibt.
Die letztendliche Ausarbeitung legt einen Fokus auf reduzierte Optik mit sanften Farben und ruhiger Typografie.
Es soll eine akustische Begebenheit (Gespräch, Klangaufzeichnung, Filmausschnitt, Musik, etc.) 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. Die akustische Begebenheit soll aufgezeichnet und auch präsentiert werden und darf nicht länger als eine Minute sein.
Die zweite Aufgabe bereitete mir mit Abstand am meisten Schwierigkeiten.
Ich habe mir das Leben selbst unnötig schwer gemacht, indem ich ein Musikstück zur Analyse auswählte: das Intro der TV-Serie »Der Tatortreiniger«. Bei der Visualisierung von Musik ist Takt- und Rhythmusgefühl von klarem Vorteil. Jedoch bin ich hilflos unmusikalisch. Teilweise fühlte ich mich wie ein Blinder, der versucht die Mona Lisa zu zeichnen.
Mit viel, viel Zeit, Kaffee und der Audiospur auf Dauerschleife gelang es mir dennoch einzelne Instrumente zu isolieren, zu identifizieren und von Hintergrundgeräuschen zu trennen.
In der Visualisierung habe ich taktgebende Instrumente sowie Hintergrundgeräusche in Spuren aufgeteilt und in einem klaren Raster dargestellt. Melodiegebende Instrumente hingeben wurden in drei losen Linien, mit roten Farbtupfen, über das Raster gelegt.
Die Elemente des Rasters geben sowohl Lautstärke als auch zeitliche Abstände wieder. Die roten Melodiespuren enthalten Informationen zu Tonhöhe und zeitlicher Abfolge.
Es soll ein Brainstorm-App für das iPhone realisiert werden. Das App soll also eine Gruppe von Designer / Entwicklern bei der Generierung von Ideen und Entwürfen unterstützen. Die genauen Funktionalitäten können in der Konzeptphase entwickelt werden.
Die Applikation kann unter Umständen über das technisch Machbare hinausgehen - wichtiger ist die Ausgestaltung des User-Interfaces. Es sollen mindestens vier Screens entwickelt werden - gerne auch mehr.
Das Ziel ist, einen iOS-8-konformen und gleichzeitig individuellen Entwurf zu erarbeiten. Es soll die standardisierte iOS-8-GUI eingesetzt werden - das App soll aber auch eine eigene Note bekommen. Die Entwürfe sollen 375x667 Pixel groß sein (für den Entwurf setze ich Punkt=Pixel). Zusätzlich zur GUI soll ein Programmablaufplan (Bewegungspfade durch die App) skizziert werden.
Die Aufgabe soll in Zweierteams bearbeitet werden.
Bei diesem Projekt habe ich mit [Florian Zia](https://incom.org/profil/7088 „Florian Zia“) zusammengearbeitet.
Statt einer klassischen »gebe Stichwörter ein und verbinde / ordne diese dann sinnvoll«-App fiel unsere Wahl auf eine inspirationsgetriebene Lösung.
Bei inspired.app liefert ein Algorithmus passende Stichworte und Bilder zu einem selbst eingegebenen Suchbegriff (ähnlich einer Kombination aus Lexikon und Suchmaschine). Durch Klick oder Tap auf einen der Vorschläge wird dieser als neuer Ausgangspunkt einer Suche verwendet. Auf diese Weise kann man sich relativ schnell in verschiedene Richtungen und Tiefen inspirieren lassen. Ein typischer Inspirationspfad könnte etwa so aussehen: Kalender → Monat → Jahreszeiten → Winter → Weihnachten.
Passende Vorschläge können per Drag and Drop in einer Projektmappe abgespeichert werden. Zu abgespeicherten Bildern können Kommentare hinterlassen werden.
Es soll ein komplexer Sachverhalt gesucht und in einem Schaubild oder in einem interaktiven Film dargestellt werden. Die Darstellung darf keinerlei Text enthalten. Der Sachverhalt soll möglichst deutlich und klar kommuniziert werden.
Bei der Auswahl eines Themas sollte darauf geachtet werden, dass das Thema hinreichend komplex ist. Naturwissenschaftliche Themen sind z.B. gut geeignet. Es können aber auch Alltagsthemen genommen werden wie z.B. die Zubereitung eines Essens.
Ich entschied mich, den »Low Earth Orbit«, also die niedrige Erdumlaufbahn, zu erklären. Hierbei mussten folgende Sachverhalte erörtert werden:
Bei der Bearbeitung diese Aufgabe habe ich zum ersten Mal ausschließlich mit illustrativen Mitteln gearbeitet. Ganz klassisch mit Stift auf Papier und später die eingescannten Skizzen per Photoshop kombiniert. Für mich eine spannende Erfahrung. Hätte ich noch etwas mehr Zeit gehabt, so hätte ich noch etwas Zeit in die stilistische Vereinheitlichung der einzelnen Skizzen investiert.