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
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.
Der Blutspendebus ist ein Lastwagen mit Aufbau. Das Chassis kommt von der Firma Scania.
Im Innenraum mussten Aussparungen für Elektrik, Lüftung usw. geschaffen werden.
Der Bus wird als mobile Blutspendestation betrieben und muss auch so gebaut sein. Das Maximalgewicht beträgt 18 Tonnen.
Der Blutspendebus - die «Bloody Mary» - muss viele Kriterien erfüllen und zahlreiche Vorschriften einhalten.
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).