high-fidelity Mockups Kleingärten Berlin-Neukoelln Icon

Im Rahmen der Neugestaltung der Webseite des Bezirksverbands Neukoelln wurde der Wunsch geäußert, eine interaktive Karte für die Darstellung von Kleingärten im Bezirk zu integrieren. Als Mitglied einer Kleingartenfamilie habe ich mich freiwillig dazu bereit erklärt, das Konzept für diese Karte zu entwickeln und die wichtigsten Funktionen in einem High-Fidelity Mockup vorzustellen.

In diesem Dokument werden die geplanten Funktionen und das Design der interaktiven Karte präsentiert. Ziel ist es, den Bewohnerinnen und Bewohnern des Bezirks einen einfachen Zugang zu Informationen rund um die Kleingärten zu ermöglichen und die Vorteile der neuen Webseite anschaulich darzustellen.

Karte: Kleingärten im Berliner Bezirk Neukoelln

Diese interaktive Karte visualisiert zwei überlagerte räumliche Ebenen, die gemeinsam Informationen über den Bezirk Neukoelln und seinen Kleingärtenanlagen bereitstellen.

⬤ Ebene: Kleingartenanlagen

In der ersten Ebene sind sämtliche Kleingartenanlagen im Bezirk Neukoelln als farbige Polygone dargestellt. Die Flächen sind interaktiv gestaltet:

  • beim Hovern über eine Anlage wird ein kurzer Name angezeigt
  • beim Klick öffnet sich ein detaillierter Popup, der folgende Informationen enthält:
    • Name der Anlage
    • Adresse (Straße)
    • Fläche (in m²)
    • Anzahl der Parzellen
    • Zuständiger Bezirksverband
    • wem die Parzelle gehört (Bezirk/Land)

Die Farbe der Polygone sind bewusst einheitlich in einem Rot (#e5441f) gehalten, diese sind an das offizielle Bezirkswappen von Neukoelln angelehnt. So entsteht ein visuelles Erscheinungsbild mit lokalem Bezug.

⬤ Ebene: Bezirk Neukoelln

In der zweiten Ebene wird die Grenze des Bezirks Neukoelln in Grün (#0b601d) als Polygon eingeblendet. Diese Ebene dient der räumlichen Orientierung und betont das administrative Gebiet, in dem sich die Kleingartenanlagen befinden. Beim Überfahren mit der Maus wird der Name des Bezirks eingeblendet.

⬤ Interaktivität

Die Karte nutzt eine Leaflet-Umgebung, die folgende interaktive Elemente unterstützt:

  • Zoom (per Mausrad oder Buttons)
  • Verschieben
  • Hover-Labels und Popups
  • Layer Funktion, mit der beide Ebenen unabhängig ein- oder ausgeschaltet werden können

Weitere Inhalte

Tabelle

Die tabellarische Darstellung ergänzt die interaktive Karte um eine alternative, strukturierte Ansicht der Kleingarteninformationen. Dadurch wird es dem Anwender ermöglicht, die Daten visuell unabhängig von der Karte zu erkunden und gezielt zu analysieren.

Folgende Funktionen stehen zur Verfügung:

  • Suchfunktion: Über ein eingebautes Suchfeld können gezielt Namen, Straßennamen oder andere Inhalte gefiltert werden
  • Sortieren: Spalten lassen sich durch einen Klick auf die Kopfzeile auf- oder absteigend sortieren
  • Seitenanzahl wählen: Nutzer können individuell entscheiden, wie viele Einträge gleichzeitig angezeigt werden sollen
  • Zusätzlich zur interaktiven Navigation und Sortierung bietet die Tabelle Export- und Druckfunktionen

Metadaten

  1. Sina Philipowski, Mai 2025. Daten aus Geoportal Berlin und Bezirksamt Neukoelln. Erstellt mit R.

Bezirkswappen Neukoelln