Stadt Wedel
Die Stadt Wedel, unweit von Hamburg gelegen, ist eine spannende und vielfältige Stadt mit Erholungsqualität. Das Leben dort ist von einem maritimen und weltoffenen Flair geprägt. Wedel bedeutet auch: “Hochschulstandort, Natur-Idylle, Bundesliga-Basketball, gediegenes Einkaufen und gastronomische Fülle”. Die neue Webseite soll als eine offene Plattform und das offizielle Portal der Stadt Wedel dienen.
Projektumfang
Problemstellung
Ein breites Feld an Themen in einer offenen, städtischen Plattform.
Wedel.de agiert nicht nur als ein Stadtportal, sondern auch als eine offene Plattform. Neben allgemeinen Informationen betreffend Wedel, soll die Stadtverwaltung, die im Rat vertretenen Fraktionen, agierende Beiräte und Arbeitskreise, Schulen, kulturelle Einrichtungen, Sportvereine und Hilfsorganisationen die Möglichkeit haben, selbstständig Beiträge einzustellen. Daneben soll auch Werbung, zB. für Produkte oder Dienstleistungen aus Wedel, geschaltet werden können. Die Werbeflächen sollen sich nahtlos in das UI Design einfügen und dennoch als “Anzeigen/Werbung” ausreichend gekennzeichnet werden.
Lösung
Ein modernes Erscheinungsbild mit maritimen Elementen.
Die vielfältigen Anforderungen und die Fülle an darzustellenden Informationen für die zahlreichen Anwendergruppen erforderten ein Konzept für ein gut strukturiertes und übersichtliches User Interface. Um den Überblick über das große Angebot an unterschiedlichen Informationsblöcken zu behalten, wurde eine Fülle an unterschiedlichen Design-Elementen konzipiert, die sich miteinander harmonisch zum Gesamtbild fügen ließen. Neben unterschiedlichsten Teaser-Boxen (zB. News-, Events-, Text-, Bild-, Ansprechpartner- und Mini-Teaser) wurden u.a. Formulare für verschiedene Anwendungen, Akkordeons und Filter-Funktionen erarbeitet. Ausserdem wurde ein Konzept erarbeitet, um Werbung ins Layout zu integrieren.
Eine weitere Herausforderung war, die gesamte Seite barrierefrei zu gestalten. Das Design der Templates und der Design-Elemente musste gewährleisten, dass auch bei stetiger Veränderung des Contents durch das selbständige Upload von Beiträgen, die Barrierefreiheit bestehen bleibt.
Das gesamte User Interface Design wurde als Responsives Design konzipiert. Ausgehend vom kleinsten Device wurde ein Einstieg in das Navigationsmenü als Hamburger Icon gestaltet. Das Navigationsmenü beinhaltet mehrere Tiefebenen, die typografisch und farblich gekennzeichnet sind. Ausserdem bietet das aufgeklappte Navigationsmenü ein Suchfeld. Somit wird sichergestellt, dass die Suchfunktion von jeder Seitenposition und zu jedem beliebigen Zeitpunkt aus erreichbar ist.
Details der Umsetzung
In der Konzeptphase wurden die beliebten Themen und die meist besuchten Seiten ermittelt. Um die User weiterhin auf diese Themen zu lenken, welche nun im neuen visuellen Gewand erscheinen, wurden mehrere “Sprungbretter” eingearbeitet. Als Beispiele hierfür kann man “Beliebte Seiten” und die Suche nennen, welche im oberen Bildschirmbereich und über die Icons am Bildschirm-Rand zu erreichen sind. Die Module “Beliebte Themen” und “Wedel entdecken” bieten ebenfalls einen Schnelleinstieg in die meist besuchten Seiten. Um den Bezug zum Logo herzustellen und einen maritimen Touch zu integrieren, wurden Wellen-Formen und schräge Kanten in den Gestaltungselementen verwendet.
Übergabe an die Entwickler
Neben kompletten Layouts für verschiedene Seitentypen wurde auch ein Design-System entwickelt. Dieses bestand aus zahlreichen, einzelnen Design-Elementen, wie zB. Teaser, Formulare, Akkordeons und Vorgaben für die Darstellung von Bild-Text-Elementen oder die unterschiedlichen Headline-Typen. Anhand dieser Design-Elemente und der Seiten-Templates konnte nahezu jede einzelne Seite des Stadt-Portals generiert werden.
