Spinn mit

Idee

Wir haben gemeinsam beschlossen, unser Visu 5 Projekt weiterzuziehen. Wir haben die Idee einer interaktiven Website mobile optimiert umgesetzt, auf der Verbesserungsvorschläge für die Stadt direkt auf einer Stadtkarte eingereicht werden können. Bei einem Brainstorming-Prozess haben wir ein Konzept erarbeitet, wie wir nach der Visu-Abgabe weiterfahren. Wir haben verschiedene Ideen entwickelt und diskutiert. Wir haben uns darauf konzentriert, die Website für mobile Geräte zu optimieren und dafür gesorgt, dass sie auf Desktops ebenfalls gut funktioniert.

Design

Wir haben verschiedene Optionen in Bezug auf die Benutzeroberfläche, die Navigation und das visuelle Erscheinungsbild der Webseite verglichen und ein Design ausgewählt, das wir für am besten geeignet hielten. Während der Entwicklung des Designs haben wir uns bemüht, die Bedürfnisse der Nutzer und die Ziele des Projekts in den Vordergrund zu stellen. Wir haben die Website so gestaltet, dass sie einfach zu bedienen ist und es den Nutzern ermöglicht, ihre Vorschläge einfach und intuitiv einzureichen.

Social Media

Um die 11 Posts für unseren Instagram-Kanal «spinn-mit» auszuwählen, haben wir zunächst einen Redaktionsplan erstellt. In diesem haben wir verschiedene Themen festgelegt, die wir in den Posts behandeln wollten, sowie eine grobe Zeitplanung, wann welcher Post veröffentlicht werden sollte. Anschliessend haben wir uns zusammengesetzt und die einzelnen Themen diskutiert. Wir haben uns auf eine Themenauswahl geeinigt und die Posts eingeteilt. Dann haben wir Ideen für den Inhalt der Posts entwickelt und umgesetzt. Danach haben wir angefangen, die Inhalte für die ausgewählten Posts vorzubereiten. Zusammen haben wir uns um die Erstellung der Texte, der Bilder oder Illustrationen und des Designs gekümmert, damit alles im Voraus produziert werden konnte. Durch die frühzeitige Produktion der Inhalte können wir sicherstellen, dass alles rechtzeitig veröffentlicht wird.
Wir hatten im Studium in der Theorie gelernt, dass es diverse Social-Media Managers Tools gibt und ein solches wollten wir für unser Projekt einrichten. Nach unserer Recherche fanden wir ein gratis Tool: planable.io. Wir lernten jedoch, dass es nicht so einfach ist ein solches Konto einzurichten. Denn wir mussten dafür eine E-Mail-Adresse für unser Projekt erstellen und viele andere Details die auf einmal viel Arbeit generierten. Nach Stunden ausprobieren und versuchen den Social Media Planer einzurichten und unseren Content in die gewünschten Tage zu planen, haben wir aufgegeben. Denn wir erkannten, dass es für diese 11 Posts, die wir geplant haben, der Aufwand zu gross war und wir nun an den geplanten Tag manuell posten werden.
Insgesamt war die Zusammenarbeit im Team erfolgreich, durch die gemeinsame Diskussion und die Planung konnten wir uns auf eine Auswahl von Posts einigen, die unsere Zielgruppe anspricht. Die vorherige Produktion der Inhalte ermöglichte es uns, die Veröffentlichung reibungslos durchzuführen und auf eventuelle Probleme schnell reagieren zu können.

Programmieren

In der Visu Woche hatten wir bereits eine Grundlage geschaffen, in der die wichtigsten Funktionen abgedeckt waren. Die Webapp war vor allem für mobile Devices schon auf einem guten Stand. Einige Features benötigten aber noch eine Überarbeitung oder mussten noch programmiert werden. Folgende Features wurden überarbeitet oder hinzugefügt:
– Möglichkeit zum upload von mehreren Bildern (via uploadcare API)
– Anzeige von Bildern in einer Fullscreen-Gallerie
– Anzeigen des Standorts als Adresse (via Google Maps API) und Möglichkeit zur Bearbeitung
– Loadingscreen beim Öffnen von Spinnerei
– Diverse kleine Bugfixes und Optimierungen im CSS und JS damit auch alles auf allen Browsern sauber läuft und gleich aussieht

Daneben musste die WebApp noch für Desktopgeräte optimiert werden. Dafür haben wir ein wie schon für die Mobile Version eine Designvorlage erstellt und diese anschliessend mittels CSS umgesetzt. Wir hatten für die Desktopversion den Wunsch, die Marker mit Hover-Effekten auszustatten und die Logoanimation auf das verschieben der Map abzustimmen. Wir konnten aber nach auch langem recherchieren und pröbeln keine Lösung finden, wie wir diese Features neben der Google Maps API einbinden könnten und haben daher darauf verzichtet. Ausserdem haben wir uns verschiedene Konzepte für Spam-Schutz überlegt und Möglichkeiten recherchiert, da wir mit der Website ja öffentlich gehen und ein Missbrauchspotenzial vorhanden ist. Am Ende haben wir uns jedoch dafür entschieden, dass uns die Einfachheit der Bedienung wichtiger ist und wir das Prolem des Spams erst angehen wollen, falls es auftaucht.

Um die Finale WebApp öffentlich zugänglich zu machen, haben wir uns die Domain spinn-mit.ch gekauft und unsere Daten auf ein privates hosting gezügelt. Überraschenderweise hatten wir dabei keine Probleme, obwohl wir neben den normalen Webdaten auch die Datenbank zügeln und die Google Maps API anpassen mussten.

Fazit

Wir sind sehr froh, dass wir das Projekt weitergezogen haben und es zu einem fertigen Produkt vollendet haben! Der grosse Aufwand, sowohl beim Coden wie auch bei der Social Media Kampagne, hat sich gelohnt. Die Aufteilung im Team hat gut funktioniert und jeder konnte den Part übernehmen, den er am besten beherrscht. Für uns ist das Projekt jedoch noch nicht unbedingt zu Ende. Wir stehen derzeit in Kontakt mit dem Verein Dynamo und der Stadt Zürich, um das Projekt weiter zu bewerben und möglicherweise einen Partner zu gewinnen. Je nachdem in welche Richtung sich das Ganze entwickelt, möchten wir noch mehr in dieses Projekt investieren.