Web-Applikation "Achtung Hindernis" für Die Grünen im Römer

Die Frankfurter Rathausfraktion der Grünen, Die Grünen im Römer, nahm sich das 2006 in Wien gestartete Projekt Radfalle zum Vorbild, in dem Radfahrer auf Hindernisse hinweisen. Für Frankfurt erweiterten sie die Benutzergruppe um Fußgänger, sowie Rollstuhlfahrer und Eltern mit Kinderwagen.

Auf "Achtung Hindernis" sammeln Benutzer nicht nur Hindernisse, sondern erhalten auch Rückmeldung durch die Fraktion. Mitarbeiter beobachten die eingetragenen Hindernisse, erarbeiten zusammen mit der Stadtverwaltung Lösungsvorschläge und informieren über deren Umsetzung. Die Website bringt Bürger, Verwaltung und Politik zusammen.

Die Website sollte es den Benutzern erleichtern, zur Verbesserung ihrer Stadt beizutragen. Darum musste die Applikation möglichst einfach, klar und selbsterklärend aufgebaut sein.

Unser erster Schritt war, die wichtigsten Funktionen zu identifizieren: neue Hindernisse eintragen sowie bereits vorhandene Hindernisse betrachten, suchen und merken. Wir konzentrierten uns bewusst auf diesen Kern, denn alles weitere lenkt ab und macht die Umsetzung aufwändiger.

Der zweite Schritt war, eine geeignete Benutzerschnittstelle zu finden. Dabei sollte der Stadtplan als ständig sichtbare Komponente die zentrale Rolle einnehmen. Die Funktionen der Applikationen umgeben die Karte und sind meist nur sichtbar, wenn sie gebraucht wird. Dieses Konzept bleibt bei fast allen Tätigkeiten konstant. Die Benutzer müssen die Applikation nicht mehrmals neu lernen.

Auch die Anmeldung macht den Einstieg leicht. Nur Name und E-Mail werden für die Kommunikation zwischen Benutzern und Fraktion gespeichert. Öffentlich sichtbar ist nur der Benutzername. 

Das Layout unterstützt das Konzept: nur so viel, wie für die Kernaufgaben gebraucht wird. Die zentrale Karte füllt den Bildschirm, während die anderen Elemente gleich groß bleiben. Symbole in Ampelfarben auf der Karte zeigen den Status der Hindernisse. Schwerpunkte mit mehreren Hindernissen werden zusammengefasst und hervorgehoben. Die einfachen Symbole, Buttons und Dialogfelder fordern keine unnötige Aufmerksamkeit. 

Der Stil der Site ist durch Notizzettel und Handschrift unkompliziert und alltäglich. Diese Elemente tauchen immer wieder auf und geben der Site zusammen mit dem Grün der Betreiber ein konsistentes Aussehen.

Die Umsetzung der Web-Applikation erfolgte auf Basis von Google Maps, Django und jQuery. Dabei spielt die Serverseite eine untergeordnete Rolle, denn der Großteil der Applikation spielt sich per Javascript im Web-Browser des Benutzers ab. Bei normaler Verwendung bleibt der Benutzer auf der Startseite, einzelne Fragmente der Seite werden bei Bedarf per Ajax nachgeladen.

Eine Hauptaugenmerk war die Performance und Übersichtlichkeit der Applikation bei einer großer Anzahl an eingetragenen Hindernissen. Hierzu haben wir einen Ansatz zum Clustering der Punkte auf der Karte gewählt, bei dem der Abstand der Punkte zueinander in der gewählten Zoomstufe herangezogen wird. Dadurch wird vermieden, dass die Karte in Rechtecke aufgeteilt werden muss, in welche dann hereingezoomt werden muss. Zudem haben wir viele der standardmäßigen Steuerelemente durch eigene, leichtgewichtigere Varianten ersetzt.

Die Grünen im Römer haben Zugriff auf einen speziellen Verwaltungsbereich zur Bearbeitung der eingetragenen Hindernisse. Dieses Backend ist eine erweitere Version des Django Adminbereichs. Unter anderem können dort von Benutzern hochgeladene Bilder freigeben werden, und es kann natürlich auf Hindernisse geantwortet werden.