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

Verbindungen der Designer

Dokumentation des Kurses Designer/-innen-Geschichte bei Philip Zerweck im Wintersemester 2015/16

EINLEITUNG

In dem Kurs Designer/-innen-Geschichte behandelten wir die Verbindungen von Designern untereinander. Was waren z.B. die Arbeitskollegen von Walter Gropius oder Freunde von Otl Aicher und welche weiteren Verbindungen können diese Designer aufweisen. Die Aufgabe des Kurses bestand darin 10 verschiedene Designer und jeweils 10 Verbindungen zu anderen Designern akademisch zu recherchieren.

Wir haben jedoch als Gruppe die gesammelten Daten Visualisiert. Dabei haben wir die Visualisierung sowohl technisch als auch konzeptionell als Webseite Umgesetzt. Durch die extreme Fülle an Informationen von 606 Designern und insgesamt 1.700 Verbindungen gerieten wir jedoch sowohl technisch als auch konzeptionell an unsere Grenzen.

Screenshot03.pngScreenshot03.png

DAS PROJEKT

Die Designer sind chronologisch von links nach rechts anhand des Geburtsdatum geordnet. Die vertikale Verteilung in beide Richtungen ist dabei zufällig, wobei die Designer mit den meisten Verbindungen in der Mitte liegen.

Durch scrollen lässt sich die ganze Visualisierung verkleinern oder vergrößern. Zum bewegen innherhalb der Grafik klickt und zieht man die Maus in eine Richtung. Durch einen „mouse hover“ auf einen Knoten oder auf eine Verbindung lassen sich die jeweiligen Informationen dazu abrufen. Ein Klick auf eine Verbindung öffnet den hinterlegten Link zur jeweiligen Quelle. Durch klicken auf einen Knoten öffnen sich weitere, von den Studenten recherchierte, Informationen zu dem jeweiligen Designer, wie z.B. die besuchten Institutionen, eine kurze Vita oder die Zusammenfassung aller Verbindungen.

Webseite zum Projekt: designgeschichte.fh-potsdam.de

Screenshot01.pngScreenshot01.png

Übersicht aller Knoten und Verbindungen

Screenshot02.pngScreenshot02.png

hover Effekt bei einem Knoten

Screenshot04.pngScreenshot04.png

detaillierte Informationen zu einem Designer

TECHNIK

Das Projekt haben wir komplett mit Hilfe von d3.js umgesetzt. Die Daten werden dabei von 3 verschiedenen JSON Dateien aus dem Backend der Datenbank geliefert und interaktiv im Browser gerendert.

Das [Backend](http://designgeschichte.fh-potsdam.de/backend/dashboard „Backend“) wurde komplett von Julian Scheidsteger programmiert und konnte mit dem Entsprechenden Login von den Studenten gefüllt werden.

Den kompletten Quellcode zur Visualisierung gibt es hier: github.com/varusgarcia/Design-History-InfoVis

Bildschirmfoto 2017-02-20 um 14.08.37.pngBildschirmfoto 2017-02-20 um 14.08.37.png

Liste der Knoten im Backend

Fachgruppe

Theorie

Art des Projekts

Studienarbeit im ersten Studienabschnitt

Betreuung

foto: PZ

Entstehungszeitraum

Wintersemester 2015 / 2016

Keywords