Feldschlösschen

Website & Microsites
Corporate Website
Umbraco
Jamstack
Headless
Wie alles began

Willkommen bei Feldschlösschen, Nueva

Feldschlösschen schrieb im Herbst 2019 einen grösseren Pitch aus, den Nueva dank eines überzeugenden Konzepts und einer gewinnenden Umsetzung für sich entscheiden konnte. Ausschlaggebend war neben dem Gespür für die Marke auch die Wahl der Technologie: Als erste Agentur im Carlsberg-Universum setzte Nueva auf den Einsatz von Umbraco Heartcore CMS, der Headless Variante von Umbraco Cloud.

Feldschlösschen Getränke AG ist die führende Bierbrauerei und der grösste Getränkehändler der Schweiz. Feldschlösschen mit Hauptsitz in Rheinfelden im Kanton Aargau produziert die gleichnamige traditionsreiche Schweizer Biermarke. Das Unternehmen ist seit 2000 Teil der dänischen Carlsberg-Gruppe.

Die Herausforderung

Modernität vs. Tradition

Der Auftritt im Web, das Tor zur Marke Feldschlösschen, soll neu gestaltet und weiterentwickelt werden. Feldschlösschen verfügt bereits über eine solide Community, die online mehr über die Marke, deren Geschichte, aktuelle Kampagnen und natürlich alles über die Produkte erfährt. So weit, so gut. Die Herausforderung: gleichbleibenden Content mit aktuellem Look & Feel deutlich in Richtung Modernität und Innovation hin erneuern, aber gleichzeitig auf die grosse Tradition und den Standort, das einzigartige Schloss in Rheinfelden, bauen.

«Unsere neue Webseite ist ein Quantensprung zum Vorgänger. Schaut super aus, ist modern, zeitgemäss und macht auch Spass beim Content Editing»Dominique Zingg, Feldschlösschen
Die Lösung

Bier, Schloss, Geschichten

Aller guten Dinge sind drei. Traditionellerweise braucht man mit Wasser, Hopfen und Malz nur drei Zutaten für Bier. Die moderne, neue Website des bekanntesten Schweizer Bierbrands braucht nur deren drei Navigationspunkte: Bier, Schloss und Geschichten. Dank cleverer Aufteilung und einem konsequenten Teaserkonzept braucht es auch nicht mehr, um das reiche Sortiment, das verwurzelte Erbe und die Markenidee «Feldschlösschen verbindet» auf der Website zugänglich und erlebbar zu machen. Dank einem komplett modular gebauten System können sämtliche Elemente (inkl. Slider, Video-Slider, Produkt-Widget, Bildergalerie usw.) auf jeder Seite an jedem Ort platziert werden. Ohne Aufwand ganz einfach mittels Drag&Drop. Ein wahres Vergnügen für jeden Content-Editor.

Die Technologie

Nueva als Jamstack First Mover im Carlsberg-Universum

Mit dem Einsatz des Headless CMS «Umbraco Heartcore», das zum Pitch-Zeitpunkt noch nicht einmal öffentlich verfügbar war, konnten die Verantwortlichen von Feldschlösschen und Carlsberg von Nuevas technischer Kompetenz überzeugt werden. Bei Umbraco in Dänemark standen die Tore ebenfalls weit offen. Vom ersten Moment konnte sich das Projekt auf den hervorragenden Support vom Team rund um Gründer und CEO Niels Hartvig verlassen. Dank des hohen Innovationslevels unseres Frontend-Teams ist Neuva weltweit die erste Agentur, die Umbraco auf einer vollständigen Jamstack-Architektur rund um Nuxt und Vue.js hochgezogen hat.

😍🎉🍻 Ooooh la la, congratulations to everyone involved with a very cool new site for @Feldschloss1876 by @NUEVAZRH powered by @vuejs, @nuxt_js and with content fetched headless from @umbraco Heartcore CMS: https://t.co/0goo8Zm195 #umbraco #headless #cms #jamstack 🍻🎉😍pic.twitter.com/Ovi2byasRdNiels Hartvig (@thechiefunicorn) April 1, 2020 via Twitter
Umsysteme

Alles API: Die Promo-Engine

Bereits vor drei Jahren hat die Nueva-Schwesteragentur «cab web services» eine Lösung für Promotionen gebaut, die auf TYPO3 basiert. Dies, um die Hunderttausenden von On-Pack-Promo-Codes für diverse Wettbewerbe und deren Preisausschüttung für Feldschlösschen zu managen. Um den Headless-Ansatz ganzheitlich zu verfolgen, haben wir eine API konzipiert, die cab als Update der Promo-Engine umgesetzt hat. Auch die Übertragung in die bestehende Kundendatenbank und die Verbindung zum Newsletteranbieter konnte damit gelöst werden. Das komplette Frontend bleibt so unabhängig und kann die Preise aus der Promo-Engine anzeigen, unzählige Codes an die Engine senden und gleichzeitig Content aus Umbraco ausliefern. Und: Die Promo-Engine kann durch diese Erweiterung auch innerhalb von Mobile-Apps etc. genutzt werden. Superschlank und superschnell.

Die schönen DInge

Parallax, Microanimations und «der Paternoster»

Bei Nueva sind Nice-to-haves immer auch Must-haves: Dank der Begeisterungsfähigkeit unseres Auftraggebers in Rheinfelden konnte Nueva die User-Experience weiter steigern. Zum einen ist da die smoothe Animation der wählbaren Gebinde auf der Produkt-Detailseite, der Filter nach Bittergrad, Alkoholgehalt und Farbe auf der Produktübersicht und dann, der «Paternoster» als alternative Übersicht auf die einzelnen Biere, die sich wie das urtümliche Liftsystem «on scroll» rauf und runter bewegt.

«A big thank you to all involved. We love our new brand website. 😍»Feldschlösschen (@Feldschloss1876) April 15, 2020