Xenix Kino & Bar

Kino Xenix und Xenix Bar sind eine Oase im hektischen Kreis vier. Ein Zuhause für Filme, ein Raum für cinematische Entdeckungen und sorgfältig kuratierte Programme, für Diskussionen mit jungen Talenten und erfahrenen Filmemachern, für neue Strömungen und wichtige Hintergrundinfos. Ein Ort der Kinokultur. Und ein Ort für ein Feierabendbier.

Der Filmclub Xenix betreibt Bar und Kino und ist zu 80 Prozent selbsttragend. Indem du bei Xenix ein Bier trinkst, das Kino besuchst, oder Mitglied wirst, trägst du zu einer lebendigen Zürcher Kinokultur bei.

 

Webprojekt Xenix Kino & Bar Applikationen, Soziales & Kultur
Auftraggeber Xenix
Design Astrom / Zimmer
Front End networking
CMS / Backend networking
Jahr 2016

Redesign für Xenix Kino und Bar. Die Webseite basiert auf einer Single-Page Applikation bei der alle Daten über APIs (Schnittstellen) geladen werden.

Grundlage bilden die drei Panels / Spalten. Links werden aktuelle Informationen 'angeteast', in der Mitte steht der Spielplan mit allen Filmen und in der rechten Spalte Detailinformationen zu den (angewählten) Filmen oder aber zum aktuellen Monatsprogramm. Durch CSS-Transitions haben die Panels immer den korrekten Fokus.

Wird z.B. auf der Startseite ein aktuelles Thema gewählt, schiebt sich die Webseite nach links. In der rechten Spalte erscheinen die Detailinfos  zum Thema und in der mittleren Spalte werden alle Filme zu diesem Thema markiert.

Wird nun ein Film ausgewählt, werden die Interaktionsmöglichkeiten in derselben Zeile (mittleres Panel) angezeigt sowie alle Detailinfos zu diesem Film in der rechten Spalte. Trotz der komplexen und unterschiedlichen Zustände der Webseite können mittels HTML5_mode und Extended Routing konsequent nice-URLs verwendet werden.

Trotz Fokus auf den aktuellen Spielplan und die Monatsveranstaltungen können auch 'normale' Seiten über die bereits klassische 'Burger'-Navigation aufgerufen werden.

Mit modernen technischen Lösungen wie Angular JS konnte kosteneffizient eine zeitgemässe, User-zentrierte Webseite realisiert werden.