von Manuel Ramirez Ponce, Janik Schäfli, Daniel Bucher und Ramon Kratzer
Ziel
In den vergangenen Monaten wollten wir eine Plattform entwickeln, die eine Übersicht über ausgewählte Bars in Winterthur bieten soll. Die User sollen auf «Wintis Barweiser» einen ersten Eindruck von den Lokalen gewinnen können. Das soll ihnen die Entscheidung erleichtern, wo sie ihr Bier oder ihren Drink geniessen könnten oder ihnen Inspiration geben, etwas Neues auszuprobieren. Um einen möglichst guten ersten Eindruck zu vermitteln, soll auf der Plattform ein Foto der Bar gezeigt werden. Ausserdem sollten die User sehen können, wie das Lokal bei seinen Gästen ankommt. Die User sollten es auch selbst bewerten können. Bei der Entwicklung der Plattform verfolgten wir stets das Credo von Apple-Gründer Steve Jobs: «Wintis Barweiser» sollte schlicht gestaltet werden und übersichtlich sowie kinderleicht in der Bedienung sein.
Vorgehen
Wir standen vor einem Haufen Arbeit, als wir uns entschieden, die Idee einer Plattform für Bars in Winterthur umzusetzen. Wir mussten uns einen Eindruck der Bars in Winterthur verschaffen, die Webseite entwickeln mit einer Login-Funktion und der Möglichkeit, die Bars zu bewerten und wir wollten auch ein Video der Bars in die Webseite einbinden.
Zuerst verschafften wir uns eine Übersicht über die Lokale, die es in Winterthur gibt. Die Plattform wollten wir den Gastrobetrieben dieser Stadt widmen, da wir in der Nähe aufgewachsen sind. Da es aber sehr zeitaufwendig gewesen wäre, sämtliche Bars zu erfassen, entschieden wir uns, in einem ersten Schritt mit deren zehn zu arbeiten. Bei der Auswahl achteten wir auf den Standort. Wir wollten mit Bars arbeiten, die in der Nähe des Bahnhofs oder in der Altstadt sind. Weiter sollen sie in der Bevölkerung bekannt sein und eine hohe Gästefrequenz aufweisen.
Gleichzeitig überlegten wir uns, nach welchen Kriterien die User die Lokale bewerten können. Wir entschieden uns für «Ambiente», «Angebot», «Lage», «Bedienung» und «Preis». Die User sollten dafür Sterne vergeben können. Ein Stern bedeutet, dass eine Bar in dieser Kategorie zünftigen Nachholbedarf hat, fünf Sterne bedeutet, dass es nichts auszusetzen gibt und die Erwartungen übertroffen werden. Ziel war, dass alle Bewertungen zusammengezählt werden und mit einem weiteren Sternesystem dargestellt werden. So sehen die User auf einen Blick, wie gut beziehungsweise schlecht ein Lokal bei den Gästen ankommt.
Nachdem die Kriterien feststanden machten wir uns an ein Datenbankschema, das für das Erfassen und Anzeigen der Bewertungen, sowie dem Login und dem automatischen Darstellen bestimmter Inhalte auf der Webseite nötig war. Dass die Daten der Bars für die Webseite aus einer Datenbank kommen, war wichtig, weil wir ursprünglich geplant hatten, dass die User selbst Bars erfassen und somit auf der Webseite anzeigen konnten. Davon kamen wir aber wieder ab.
Nun ging es ans Programmieren. Wir arbeiteten mit keinem Framework, sondern schrieben die Seiten selbst, mit HTML5 und CSS. Um die Seite möglich schön darzustellen, verwendeten wir Flexboxen und Grids. Für die Karte, in die die Standorte der Bars eingezeichnet sind, nutzen wir das Pluglin Leaflet. Die Geodaten stammen von OpenStreetMap. Wir entschieden uns für Leaflet, da es sehr viele Funktionen und gestalterische Freiheiten bietet. Zum Beispiel war es möglich, die Marker, die die Standorte der Bars anzeigen, mit Bierkrügen zu versehen. Zudem programmierten wir, dass sich die Farbe des Markers ändert, wenn er beziehungsweise die Bar angeklickt wird. Leaflet ermöglichte auch, dass die Koordinaten der Standorte aus einer Datenbank bezogen werden. Für die Interaktionen mit der Datenbank arbeiteten wir mit PHP.
Übrigens stammen nicht nur die Koordinaten der Standorte für die Karte sowie die Bewertungen der Bars aus der Datenbank, sondern auch die Fotos, Beschreibungen, Adressen und Links. Dies hat den Vorteil, dass wir ohne grossen Aufwand weitere Lokale erfassen und auf der Plattform anzeigen lassen können.
Damit wir der Website mehr Pepp einhauchen konnten, haben wir für den Header-Bereich einen kurzen Clip erstellt. Dieser soll Aufnahmen / Impressionen von Bars in Winterthur zeigen. Eine längere Version des Videos (mit Sound und Abspann) haben wir im unteren Teil der Website eingebaut. Dabei kann der Betrachter direkt ins Geschehen eintauchen und wird am Schluss des Videos aufgefordert, auf barweiser.ch seine Lieblingsbar zu bewerten.
Die Aufnahmen haben wir mit einer Sony A7 III durchgeführt. Dank dem Objektiv Samyang 24mm f1.5, welches besonders Lichtstark ist (tiefe Blende f1.5), konnten wir auch bei schlechten Lichtverhältnissen (am Abend oder in Bars) gute Aufnahmen machen.
Filmequipment
- 1x Sony A7 III body
- 1x Objektiv Samyang 24mm f1.5
- 1x Objektiv Sony E 18-135mm f3.5-5.6
Die Files haben wir anschliessend mittels Adobe Premiere Pro CC bearbeitet und zu einem fertigen Clip zusammengeschnitten. Der Soundtrack wurde aus dem Grund ausgewählt, weil er einen schnellen Rhythmus hat und wir so optimal den Bildwechsel darauf abstimmen konnten. Nach dem Rohschnitt folgte der Feinschnitt. Dabei haben wir Bildeffekte wie Speed Ramping, Walk by transition oder Slow Motions eingebaut. Diese Effekte verleihen dem Video mehr Abwechslung und passen sehr gut zu diesem Video Genre. Beim Color Grading / Color Correction haben wir darauf geachtet, dass die Farben kontrastreich und im gleichen Farbstil (Feinanpassungen Farben sowie Verwendung eines neutralen LUT’s) sind.
Den Abspann haben wir mit der Software Adobe After Effects CC erstellt. Um dem Abspann mehr Pepp zu verleihen, haben wir den Effekt Glitch Animation eingebaut. Dabei wird die Schrift verzogen / verzerrt mit dem Ziel, eine Art TV-Bild-Panne zu erreichen. Die Glitch Soundeffekte runden das ganze ab und machen das Erlebnis realistischer.
Damit der Leser sich ein Bild von den verschiedenen Bars machen kann, haben wir die einzelnen Bar von aussen fotografiert. Für die Fotos verwendeten wir ebenfalls die Sony A7 III mit den oben erwähnten Objektiven. Anschliessend haben wir mit der Software Adobe Lightroom Classic CC die Bilder aussortiert und bearbeitet. Den Fokus legten wir dabei auf den Farbbereich. Uns war es wichtig, dass die Bilder alle im selben Stil daherkommen und zum Farbkonzept auf der Website passen. Beim Colorgrading haben wir verschiedene Versionen (unterschiedliche LUT’s, Farben, Kontrast, Höhen und Tiefen) erstellt, im Team dann die beste ausgesucht und schlussendlich in die Website integriert.
In einem weiteren Schritt erstellten wir den Loginbereich. Wir wollten aus Sicherheitsgründen, dass die User nur Bewertungen vornehmen können, wenn sie sich angemeldet haben. Wir mussten also zum einen ein Formular erstellen, in dem der User die nötigen Daten für die Registrierung angeben oder seine Logindaten ändern kann. Mit einem weiteren Formular ermöglichten wir, dass sich die User anmelden können. Auch hier arbeiteten wir mit HTML5, CSS und PHP.
Anschliessend arbeiteten wir an der Benutzerfreundlichkeit der Webseite. Wie bereits im Kapitel «Ziel» erwähnt, soll sich der User einfach auf der Plattform zurechtfinden. Zudem soll sie schlicht gestaltet sein. Deshalb erstellten wir eine «Onepage». Ausserdem achteten wir darauf, mit möglichst wenig Icons, Buttons und Text zu arbeiten. Wir erstellten auch die Funktion, dass wenn der User auf einen Marker klickt, ihm in der Spalte neben der Karte automatisch die Informationen der entsprechenden Bar angezeigt werden. Zuguterletzt haben wir die Webseite mit all ihren Funktionen getestet. Wir haben die Bars testweise bewertet und Kommentare geschrieben, bis auch die letzten Fehler behoben waren.
Schwierigkeiten
Eine der grössten Herausforderungen war es, dass unsere Webseite dynamisch ist. Wie bereits erwähnt, lautete unser Ziel ursprünglich, dass die User selbst weitere Bars erfassen konnten. Damit dies möglich war, mussten die Daten der Bars, die in der Karte und der Spalte nebenan, aus einer Datenbank kommen. Von dieser Idee kamen wir aber ab, da die User einige Hürden überwinden mussten, um eine Bar zu erfassen. Beispielweise sollte der Stil des Bildes der Bar dem der von uns erstellten Bilder ähnlich sein. Dennoch verfolgten wir das Ziel, dass sämtliche Daten zu den Lokalen aus Datenbanken stammen, weiterhin. So bleibt uns die Möglichkeit offen, ohne grösseren Aufwand die Plattform mit weiteren Bars zu ergänzen.
Auch die Auswahl der Bars führte zu Diskussionen. Aus zeitlichen Gründen arbeiteten wir nur mit zehn Lokalen. Die Stadt Winterthur weist aber eine erheblich grössere Zahl an Lokalen auf, weshalb wir uns entscheiden mussten. Nachdem wir die bereits beschriebenen Auswahlkriterien festgelegt hatten, fiel es uns einfacher, uns für zehn Bars zu entscheiden.
Schwierigkeiten bereitete uns auch, dass es uns einige Inhaber und Pächter von Lokalen verboten hatten zu filmen. Sie begründeten dies mit dem Persönlichkeitsrecht oder zu hohem Aufwand für sie. Wir mussten deshalb von unserem Plan abkommen, in allen Bars Filmaufnahmen zu machen.
Auch die Lichtverhältnisse in bestimmten Bars bereiteten uns Mühe, da einige Lokale nicht sonderlich gut ausgeleuchtet waren. Wir verwendeten deshalb ein lichtempfindliches Objektiv und spielten mit dem ISO-Wert.
Unsere Gehirnzellen arbeiteten auch auf Hochtouren, als wir das Datenbankschema erstellt haben. Wir wollten Fehler wie zum Beispiel Dopplungen in der Datenbank vermeiden und die Abfragen so einfach wie möglich gestalten können. Wir mussten uns deshalb gut überlegen, welche Inhalte wir in die einzelnen Tabellen packten. Geholfen haben uns dabei die Unterlagen aus den Vorlesungen von Rolf Hofstetter, der uns in das Thema der Datenbanken und Datenbankabfragen einführte.
Kritik
Nach mehrmonatiger Arbeit haben wir erreicht, was wir uns vorgenommen hatten: das Erstellen einer Plattform, die eine Übersicht über bestimmte Bars in Winterthur bietet. Wir sind mit dem Resultat sehr zufrieden. Die Webseite ist unserer Meinung nach visuell ansprechend, benutzerfreundlich und informativ. Zudem können ohne grossen Aufwand weitere Bars erfasst werden. Zudem ist es möglich dieselbe Webseite für Plattformen zu Bars in weiteren Städten zu verwenden, da sämtliche Daten zu den Lokalen aus Datenbanken stammen.
Zu kritisieren ist, dass wir uns auf zehn Winterthurer Bars beschränkt haben. Die Auswahl geschah aufgrund unserer Erfahrung und ist wissenschaftlich oder mit Fakten nicht zu begründen. Es kann uns deshalb vorgeworfen werden, diese Bars gegenüber anderen Lokalen zu bevorzugen, was aber überhaupt nicht unsere Absicht ist. Wie bereits erklärt, haben wir die Bars aufgrund ihres Standorts sowie ihrer Bekannt- und Beliebtheit ausgewählt.
Zu erwähnen ist auch, dass wir ein Teilziel nicht erreicht haben. Ursprünglich planten wir, dass die User selbst Bars erfassen können. Davon kamen wir wie im Kapitel «Schwierigkeiten» beschrieben aber wieder ab. Dennoch gefällt uns die Plattform sehr gut.
