Project Aufklauben+

Aufklauben+

MultiMediaTechnology, 2016

Über Aufklauben+

Aufklauben + ... Biken, Skaten, Laufen, Wandern. Stelle dir vor du unternimmst mit deiner neuen Liebe einen romantischen Waldspaziergang. Alles ist wunderbar. Die Sonne strahlt hin und wieder zwischen den Baumkronen hindurch. Die Vögel zwitschern fröhlich durch die Luft. Alles perfekt solange man den Blick nicht auf den Boden richtet. So kommt es nicht selten vor, dass zwischen diesem wunderbaren Waldschauspiel sich leere Bierdosen hervor tun. Meistens bleibt es nicht nur bei den Dosen. In ...

Aufklauben + ... Biken, Skaten, Laufen, Wandern.

Stelle dir vor du unternimmst mit deiner neuen Liebe einen romantischen Waldspaziergang. Alles ist wunderbar. Die Sonne strahlt hin und wieder zwischen den Baumkronen hindurch. Die Vögel zwitschern fröhlich durch die Luft. Alles perfekt solange man den Blick nicht auf den Boden richtet. So kommt es nicht selten vor, dass zwischen diesem wunderbaren Waldschauspiel sich leere Bierdosen hervor tun. Meistens bleibt es nicht nur bei den Dosen. In den Blickwinkel geraten Zigarettenstummeln, Plastiksäcke, Plastikflaschen ect. Der Weg wird täglich von vielen Menschen bewältigt, aber warum nimmt den Müll niemand mit? Ein Handgriff und wir würden den Müll Aufklauben + dem Nächsten eine Freude bereiten.

Der gleichnamige Facebook Blog Aufklauben+ soll alle Personengruppen dazu animieren ganz unscheinbar der Umwelt ein bisschen zu helfen. Egal ob es Aufklauben+ Biken oder Aufklauben+ Spazieren gehen sein soll. Es braucht gar nicht viel Motivation dazu und schon hat man sein eigenes Umweltbewusstsein verbessert. Die Webaplikation Aufklauben+ stellt eine Landkarte zur Verfügung, auf der saubere Plätze in aller Welt markiert werden können. Aufklauber können ihre Müllsammlungen so ganz einfach veröffentlichen und sich über ihre Aktionen freuen.

So funktioniert‘s:

Der Aufklauber entdeckt während eines Spaziergangs einen vermüllten Platz und macht ein Foto davon. Alleine oder mit Freunden beginnt er den Platz in kürzester Zeit zu säubern und nimmt den gesammelten Müll mit. Direkt vor Ort, oder auch später zuhause, kann er sich auf der Landkarte lokalisieren und auf diesen Platz einen Smiley setzten. Dazu muss der Aufklauber einen Blogtitel, ein Vorher- und ein Nachherfoto mit jeweiligen Beschreibungen und das aktuelle Datum hochladen. Schon wurde der Platz mit einem neuen grünen Smiley markiert. Die verschiedenen Blogeinträge können über die grünen Smileys auf der Landkarte erreicht werden. Diese referenzieren zusätzlich zu den fleißigen Aufklaubern. Auf der Seite eines Aufklaubers erfährt der Betrachter wie viele saubere Plätze insgesamt schon gesetzt wurden. Außerdem sind dort auch die einzelnen Beiträge der jeweiligen User aufgelistet.

Die Umsetzung:

Die moderne Webaplikation wurde mit HTML, CSS, JavaScript und PHP umgesetzt. Der Zugriff auf die 4-tabelige Datenbank erfolgt über MySQL. Alle User werden über den Facebook Login eindeutig identifiziert und in der Datenbank gespeichert. Für den Login wurde die Facebook API verwendet. In der Datenbank gespeicherte Standorte wurden auf der eingebetteten Google Map mit Längen- und Breitengraden eindeutig festgelegt. Die eingebundene Places Libary der Google Maps API vereinfacht es dem Aufklauber erheblich Plätze zu suchen und zu markieren.

Das Design:

Die Applikation präsentiert sich in einem schlichten Design. Überschriften sind blau, der Hintergrund ist beige und alle Links gelb. Diese Farbenkombination harmoniert sehr mit den Farben der Map und wurde aus diesem Grund überlegt gewählt. Die Webapplikation ist full responisive. Das bedeutet sie hat sowohl am Desktop, aber auch am Mobiltelefon ein userfreundliches Auftreten. Die Schriften und Icons wurden mit der Google Fonts Api und der Font Awesome Api eingebunden. Sie geben dem Design einen ganz besonders smarten Eindruck.

Visuelle Eindrücke

ich markiere dort einen sauberen Ort
ich markiere dort einen sauberen Ort

ein fertiger Beitrag
ein fertiger Beitrag

Userpage gibt mir einen kleinen Überblick
Userpage gibt mir einen kleinen Überblick

video

thats a test video
Die Vorschau für das Video video ist leider nicht möglich.