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
Grundlagen zur Analyse von Informationsaufnahmeprozessen und Strukturierung komplexer Informationszusammenhänge unter didaktischen, logischen und ergonomischen Gesichtspunkten.
Aufgabenstellung
IA/IV Spurensuche. Untersucht werden Strukturen von Informationsarchitektur im digitalen Medium. (Beispiel: Sitemap, Matrix, Hyperbolic Tree, Thesaurus...) oder Grundlagen zur Informations- visualisierung. (Semiotik, Wahrnehmungstheorie, Ergonomie, Farblehre, Piktogramme...). Gliedern Sie Ihre Untersuchungen in Recherche, Dokumentation, Analyse und Präsentation als 15-Minute-Report vor dem Semester. Jeder Student erarbeitet ein IA oder IV-Beispiel.
Mein Referat „Piktogramme“ ist als Präsentation und als Druckversion links im Materialorder herunterzuladen.
Aufgabenstellung:
Erstellen Sie Diagramme welche: 02.1 entweder Ihren Umgang mit Text visualisieren oder 02.2 den Inhalt Ihres Textes darstellen zu 02.1 - Sie können, als Beispiel, die Anzahl aller im Text vorkommender Buchstaben in Form einer Datengrafik visualisieren zu 02.2 - Sie können eine Informationsarchitektur erstellen, die in ihrer inhaltlichen Aussage einen Bezug zu Ihrem Thema darstellt. Erstellen Sie Ihre Grafiken in Freehand oder Illustrator.
Lösung:
Ich habe ein 5-kantiges Grundraster entwickelt um welches das Alphabet im Uhrzeigersinn angeordnet ist. Die Vokale befinden sich im Gegensatz zu den Konsonanten jeweils auf einer verlängerten Linie die von einer der 5 Ecken ausgeht.
Durch verbinden der Buchstaben, wobei man nach jedem benutzten Buchstaben ein Kästchen nach außen springt, entwickelt sich ein individuelles und eindeutiges Symbol für das jeweilige Wort.
Aufgabenstellung:
Erstellen Sie eine 10 x 10 grosse Matrix. Kombinieren Sie die visuellen Variablen der Spalten und Zeilen.
Visuelle Variablen:
01 Punkt 02 Linie 03 Kurve 04 Umriss 05 Kontrast 06 Progression 07 Schraffur 08 Struktur 09 Unordnung 10 Prägnanz
Erweitern Sie die Aufgabe in dem Sie die Darstellungsart in ihrer Abstraktion als Fotografie umsetzen.
Aufgabenstellung:
Umsetzung einer Funktion (statisch) im Raster in Form eines Icons. Die unten aufgeführten Wortpaare dienen als Grundlage.
ein — aus - standby schnell — langsam groß — klein kurz — lang addieren — subtrahieren laut — leise oben — unten weich — hart rauh — glatt dunkel — hell links — rechts positiv — negativ aktiv - passiv elastisch - starr schwebend - lastend heiss - eisig leer - voll ausgeglichen - spannungsvoll nah - fern anschwellend - abschwellend
Umsetzung der Funktionen (bewegt) im Raster in einem animativen/interaktiven Kontext. Grundelemente sind Pixel.
Zu den Icons http://jochen-fuchs.com/Icons/SEITE.html
Aufgabenstellung:
Erstellen Sie eine visuelle Abbildung von einer Suchergebnissliste, bsp. Googlesuchergebnisse. Ihre visuelle Abbildung muss verständlich, logisch und lesbar sein. Sie sollte dem User eine Relevanz und Zuordnung der Suchergebnisse vermitteln und die Möglichkeit bieten, eine textliche Ebene zusätzlich abrufen zu können.
Konzept:
Meine Suchmaschine namens „Moviemap“ dreht sich um Filme. Bei Start der Applikation erscheinen als „Begrüßung“ die Filme der Woche (Bild 1). Von hier aus kann man direkt den Trailer oder weitere Informationen über den Film aufrufen (Bild 2). Beim Schließen dieser Fenster kommt man auf die Hauptseite auf der man alle Kinofilme (eventuelle verknüpfung mit imdb.com) als Miniaturen sehen kann, zeitlich von unten nach oben geordnet und farblich in Genres aufgeteilt. Bei mouseover wird das Filmcover angezeigt (Bild 3). Bei einer Suche nach einem Film ohne den ganzen Namen zu wissen werden die möglichen Treffer angezeigt (Bild 4). Wenn man die Miniaturdarstellung anklickt kommt man auf die Infoseite des Filmes in der Hinterfrundfarbe des Genres (Bild 5). Von hier aus hat man einige Möglichkeiten zu weiteren Informationen zu kommen, wie z.B. „Alle Filme des Regisseurs“(Bild 6). Zusätzlich gibt es noch einen Favouritebutton auf den man seine Lieblingsfilme ziehen kann (Herz rechts unten, drag´n´drop) und auf klick kommt man zu all seinen Lieblingsfilmen.
Aufgabenstellung:
Führen Sie eine Recherche über Strahlungsarten, ihre Zusammensetzung, Form, Vorkommen... durch.
Wo tritt Strahlung auf: - Sateliten - Radio - Handy - Microwellen - Fernseher - etc.
http://www.quarks.de/elektrosmog/01.htm
Untersuchen Sie Visualisierungsmethoden:
Wählen Sie eine Strahlungsart und ihre Visualisierung und übertragen Sie diese auf eine vorgegebene Bilddatei. Arbeiten Sie mit der Ebenenfunktion.
Hier habe ich versucht eine eventuelle Strahlung an dem CERN Teilchenbeschleuniger in der Schweiz darzustellen.
Hier habe ich am Beispiel des Berliner Fernsehturms am Alexanderplatz Strahlung visualisiert. In der Endpräsentation ist noch eine weitere visualisierung zu sehen.
Aufgabenstellung
Selektieren Sie Ihre Arbeiten nach ästhetischen, lesbaren und funktionalen Aspekten. Konzipieren und gestalten Sie eine sinnvolle, einfache und themenbezogene Navigation durch Ihre bisher erarbeiteten Ergebnisse. Die Navigation soll für einen Betrachter verständlich und nachvollziehbar sein. Der Benutzer könnte die Möglichkeit erhalten, den Ablauf selbst zu beeinflussen und dadurch neue Erfahrungen zu erlangen. Achten Sie bei der Erstellung Ihrer Navigation auf Parameter wie die Lesbarkeit der Schrift, bedingt durch Schriftart und Schriftgrösse. Hierbei sollten Sie auch darauf achten, eine bildschirmadäquate Schrift zu nutzen. Verwenden Sie Farben nur zur Auszeichnung. Beachten Sie die Positionierung der Navigation. Sie sollte immer verfügbar sein, aber nicht zu prägnant gestaltet werden. Legen Sie, falls nötig, Hierarchien fest (Hauptmenüpunkte, Untermenüpunkte, usw.).
Ich habe mich beim gestalten der Navigation an meiner Grundidee der Aufgabe 5 (Moviemap) orientiert, und so das Prinzip der Aufgabe mit den Inhalten aller Aufgaben gefüllt.
Die Endpräsentation ist links im Materialordner zu finden. Zur richtigen Darstellung bitte downloaden und im Flash Player öffnen.