Blutspendezentrum
beider Basel

Online Jahresbericht 2018

Auch für das Jahr 2018 durften wir den Geschäftsbericht des Blutspendezentrum beider Basel voller Highlights, Fakten und einer Überraschung als Web-Version umsetzen.

Herzliche Gratulation! Der Online-Jahresbericht ist in dieser Form schlicht und einfach genial.

Markus Nydegger, Stiftungsrat Blutspendezentrum beider Basel

Lösung

Der Jahresbericht 2018 hat einen prominenten Hauptdarsteller: der neue Blutspendebus, ein Scania-Lastwagen, komplett um- und ausgebaut in Finnland.

Die Geschichte hinter dem Bus und wie er Schritt für Schritt – vom Chassis bis zur Beschriftung – zusammengesetzt wurde, zieht sich wie ein roter Faden durch den Jahresbericht.

Auch in diesem Jahr wurde wie im letzten Jahr ein «One-Pager» (ohne Unterseiten) realisiert, der mittels Scrollen entdeckt wird:

Der Anwender konsumiert Videos, Fotostrecken, Highlights und spannende Stories, und animiert dabei den Blutspendebus bei seinem interaktiven Streifzug gleich selbst. Hierfür wurde der Bus in mehreren Ebenen illustriert, für das Web animiert und mit Hintergrundinformationen bestückt.

1. Chassis

Der Blutspendebus ist ein Lastwagen mit Aufbau. Das Chassis kommt von der Firma Scania.

2. Gerüst und Verkleidung

Im Innenraum mussten Aussparungen für Elektrik, Lüftung usw. geschaffen werden.

3. Innenausbau und Spezialkonstruktionen

Der Bus wird als mobile Blutspendestation betrieben und muss auch so gebaut sein. Das Maximalgewicht beträgt 18 Tonnen.

4. Der erste Blutspendebus der Schweiz

Der Blutspendebus - die «Bloody Mary» - muss viele Kriterien erfüllen und zahlreiche Vorschriften einhalten.

Technische Informationen zur Umsetzung

Die Grundlage zur Realisierung des Online Jahresberichts 2018 bildet django CMS. In diesem Fall wurde der Bericht in die bestehende Multi-Site Umgebung des Blutspendezentrums integriert, wo bereits die 2017er Version sowie die Corporate Webseite (www) vom Kunden verwaltet werden.

Aufgrund der hohen Interaktivität ist die Umsetzung durch die Webagentur arteria hauptsächlich im Front-End zu suchen. Die Stop-Scroll Mechanik sowie das Controlling der Animationen wurden mit den Java Script Frameworks bzw. Bibliotheken ScrollMagic, Velocity und TweenMax programmiert.

Die Charts zur Darstellung der Fakten & Zahlen wurden mittels ChartNew sowie eigenen Erweiterungen realisiert. Das Front-End basiert auf Twitter Bootstrap (Full Responsive Design). Der Jahresbericht wurde zurück bis zur Version 11 des Internet Explorers optimiert, und ist auf allen modernen Browsern und Geräten (Desktop / Laptop, Tablet, Smartphone) lauffähig.

Der Betrieb (Hosting), das Backup und die Wartung werden von arteria auf der eigenen Serverfarm im Schweizer Rechenzentrum ausgeführt (Webagentur Private Cloud).

jb2018.blutspende-basel.ch