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

Zeichne Berlin!

Zeichne Berlin! ist im Rahmen vom Kurs »Stadtmuseum Berlin – Personalisierte Wissensräume« von Prof. Sebastian Meier entstanden. Die Anwendung erlaubt das Malen auf einer Karte der näheren Umgebung des Stadtmuseums. Dabei können die BesucherInnen ein neues Bild von Berlin generieren.

Kurs

Im Kurs »Stadtmuseum Berlin – Personalsierte Wissensräume« nähern wir uns der Personalisierung im Kontext von Wissensvermittlung an. Dabei untersuchen wir verschiedene Museumskonzepte auf ihre Dimensionen der Personalisierung und gestalten final am Beispiel des Märkischen Museums ein Personalisierungskonzept.

Märkisches Museum

Märkisches_Museum_Berlin_2.jpegMärkisches_Museum_Berlin_2.jpeg

Der Kurs wurde in Kooperation mit dem Märkischen Museum organisiert. Das Märkische Museum ist das Stammmuseum der Stiftung Stadtmuseum Berlin und liegt Zentral im Stadtteil Mitte.

Es zeichnet sich vor allem dadurch aus, dass es Architekturstile verschiedener Epochen in sich vereint und als Tageslichtmuseum konzipiert wurde. Da das Gebäude unter Denkmalschutz steht, ist es teilweise schwierig die Räume auszuleuchten und Exponate ansprechend zu platzieren.

Inhaltlich zeichnet sich das Märkische Museum vor allem dadurch aus, dass es versucht möglichst offen für Partizipation aus der Berliner Zivilgesellschaft zu sein. Das motivierte Team des Stadtmuseums versucht dem Gebäude die Seele des heutigen Berlins einzuhauchen.

Zielgruppe

Die größte Zielgruppe des Berliner Stadtmuseums sind SchülerInnen. Allerdings wünschen sie sich auch Studierende und junge Erwachsene ins Haus. Das Stadtmuseum möchte gleich auf sein mit den zeitgemäßeren Häusern in der Berliner Museumslandschaft.

In meinem Projekt Zeichne Berlin! fokussiere ich mich auf die Zielgruppe der SchülerInnen.

Personalisierung

Meine Dimension der Personalisierung liegt in der Partizipation. Die BesucherInnen sind dazu eingeladen das Stadtmuseum und Berlin selbst mit zu gestalten. Dementsprechend sollen die BesucherInnen das Exponat interaktiv verändern können.

Prozess

Seit Beginn des Kurses wollte ich Machine Learning und AI kennenlernen. Das Feld Machine Learning wirkte erstmal schwer greifbar und realisierbar.

Ich schaute mir verschiedene Algorithmen an und hatte erste Projektideen. Meistens war aber die Hürde groß, weil ich entweder kein Python kannte oder für das Trainieren eines Algorithmus eine enorme Rechenleistung notwendig war und das Ergebnis (z.B. ein 256x256 px Video) in keinem Verhältnisstand.

Nach einigen Startschwierigkeiten im Selbstversuch, hat Sebastian uns in einem Workshop auf grandiose Weise in ml5js auf Javascript Basis eingeführt.

Da ich schon in vorherigen Semestern mit Processing und p5js für Javascript gearbeitet habe, war der Einstieg von hier nicht mehr so schwer.

Research

Bewaffnet mit neuen Erkenntnissen aus dem Machine Learning/AI Workshop ging ich noch einmal in die Ideation und versuchte eine neue Idee zu entwickeln.

Meine Grundidee zu dem Zeitpunkt war, dass durch die Bewegung der BesucherInnen die Karte von Berlin verändert wird.

In einem weiteren Gespräch mit Sebastian machte er mich auf die Arbeit Invisible Cities von Gene Kogan aufmerksam:

Durch das Anzeigen des Inhalts von Vimeo akzeptieren Sie die Datenschutzbestimmungen des Anbieters.

Vimeo vertrauen und Inhalt immer anzeigen
EmbedPreviewImage-843086474-de59196efeecc5d4948725d06e1652fabdb9ae2bf76d5b916da27fad8b273b38-d_640.png

Die Arbeit wurde tatsächlich im Futurium, Berlin ausgestellt. Mit der Arbeit können BesucherInnen aus selbst gemalten Bildern Karten generieren.

LA-33_8203--118_1651--176_000.jpegLA-33_8203--118_1651--176_000.jpeg

Die Idee war nun, mithilfe einer Webcam die Karte von Berlin durch die Bewegungen der BesucherInnen zu beeinflussen.

Im nächsten Schritt stellte sich dann heraus das es auch für ml5js einen pix2pix Algorithmus gibt.

pix2pix Algorithmus

In der ml5 libary gibt es einen »Bild zu Bild« Algorithmus. Der Algorithmus wurde mit Bilderpaaren so trainiert, dass er bei beliebigem Input versucht einen den Trainingsdaten ähnelndem Output zu generieren.

Glücklicherweiße wurde der pix2pix Algorithmus der ml5 libary auch mit Kartendaten trainiert.

maps_BtoA.pngmaps_BtoA.png

Ein anderes Beispiel ist der Pikachu-Trainingsatz. Aus beliebigem Input wird ein Pikachu gerechnet. Funktioniert am besten wenn der Input den Trainingsdaten ähnelt. So wie in diesem Beispiel eine Strichzeichnung von Pikachu und das daraus berechnete eingefärbte Pikachu-Bild:

reference__header-pix2pix.pngreference__header-pix2pix.png
Bildschirmfoto 2022-04-01 um 00.24.22.pngBildschirmfoto 2022-04-01 um 00.24.22.png

Handpose Algorithmus

Da ich die Karte ursprünglich durch die Bewegungen der BesucherInnen verändern wollte, schaute ich mir den Handpose Algorithmus in der ml5js libary an.

reference__header-handpose.gif
reference__header-handpose.gifreference__header-handpose.gif

Mithilfe von diesem Algorithmus können über die Webcam Punkte auf den Fingerspitzen und Gliedern der Hände erkannt werden. Mithilfe dieser Punkte wollte ich auf der Karte zeichnen.

Dies erwies sich von der Steuerung allerdings eher als unpraktisch und experimentell und daher fokussierte ich mich im Prototypen auf eine Steuerung per Touchscreen.

Prototyp

titel.pngtitel.png

Zeichne Berlin!

In der Anwendung kann auf einer Karte die das Stadtmuseum im Zentrum zeigt gemalt werden. Dabei können Pinselfarbe und Pinselgröße verändert werden. Es gibt Farben für Grünflächen, Gewässer. und Straßen. So sollen die BesucherInnen die Chance haben die Stadt und die nähere Umgebung des Märkischen Museums nach ihren Vorstellungen zu gestalten. Ist das Bild fertig gemalt, kann ein neues Satellitenbild generiert werden.

Selbst ausprobieren

Den aktuellen Prototypen habe ich für Web-Browser entwickelt. Wer die Anwendung testen möchte, kann sie hier herunterladen. Dabei muss die index.html auf einem live-server geöffnet werden z.B. über Visual Studio Code oder Sublime.

Ausblick

Für den finalen Prototypen habe ich mir vorgestellt, dass ein Multi-Touchscreen ideal für die Input-Karte wäre. So könnten die BesucherInnen mit ihren Fingern direkt die Umgebung des Märkischen Museums malen. Auf einem weiteren Bildschirm wird das neue Bild der Umgebung live generiert.

mockup.pngmockup.png

Reflexion

Die verschiedenen Übungen am Anfang des Semesters und die Besuche und Analysen der Museen Futurium und Humboldt-Forum, waren ein guter Einstieg und Referenz für das Thema.

Nach der Führung durch das Märkischen Museum und das Kennenlernen der Eigenheiten und Bedürfnisse, fand ich die Entscheidung zur Einschränkunge auf das Märkische Museum gut.

Besonders gut gefallen haben mir die Inputs von Sebastian, vor allem der Machine Learning Workshop. Die Annäherung an Machine Learning über Javascript war für mich angenehm und erfolgreich. Ich hatte schon mehrere Anläufe im Thema AI und bin froh bei Sebastian auf so eine kompetente Lehrkraft gestoßen zu sein, die uns und unsere Projekte unterstützt hat.

In Retrospektive sehe ich, dass am Anfang meines Projekt mein Fokus stärker auf der Technologie und der Machbarkeit, als auf der Auseinandersetzung und Entwicklung eines spezifischen Konzeptes für das Märkische Museum gelegen hat. Jetzt wo die Hürde der Machbarkeit niedriger scheint, würde ich in einem neuen Projekt von Anfang an den Fokus auf das Märkische Museum legen.

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im Hauptstudium

Betreuung

foto: Prof. Dr. Sebastian Meier

Zugehöriger Workspace

Stadtmuseum Berlin - Personalisierte Wissensräume

Entstehungszeitraum

Wintersemester 2021 / 2022