Stiftung Preußische Schlösser und Gärten Berlin-Brandenburg

Einfach glänzend: optimierte UX und erneuerte Systeme

Die Stiftung hat es sich zur Aufgabe gemacht, die Gartenanlagen, Bauwerke und Sammlungen der preußischen Schlösser und Gärten in Berlin-Brandenburg, welche zentrale Zeugnisse der europäischen Kultur sind und in weiten Teilen zum UNESCO-Welterbe gehören, als Gesamtkunstwerk zu erhalten und sie allen zugänglich zu machen. Die Stiftung pflegt, erforscht, interpretiert, präsentiert und vermittelt dieses einzigartige Erbe für die Öffentlichkeit und regt zur Diskussion an. Zugänglichkeit sowie eine intuitive Informationsvermittlung für unterschiedliche Zielgruppen sind auch für die Website von zentraler Bedeutung und konnte in einem konzeptionell, gestalterisch und technisch getriebenen Update deutlich verbessert werden.

Auftakt des Projekts bildeten zwei Auftakt-Workshops, innerhalb derer wir unsere Pitch-Beiträge zu den beiden Teilprojekten „Update der Website” und zum „Relaunch des Ticketshops” gemeinsam mit allen Beteiligten auf Kunden- und Agenturseite auswerteten und die Ziele und Anforderungen in Bezug auf UX-Konzept, Design und technische Umsetzung festlegten. 

Eine der zentralen Aufgaben dieses Relaunch-Projekts bestand in der Optimierung der Conversion-Rate für den Ticket-Verkauf. Den zuvor separaten Ticketshop der SPSG integrierten und verzahnten wir dazu vollständig nahtlos in die Website, um ein durchgängiges Nutzungserlebnis ohne spürbare Unterbrechungen zu schaffen. Durch die konsequente Einbindung von Ticketlinks in Teasern und Detailseiten der Schlösser, Gärten, Veranstaltungen und Ausstellungen sowie die zentrale Platzierung des Warenkorb-Icons im Header wird der Ticket-Kauf für Nutzende auf der Website durchgehend präsent und erreichbar. Zusätzlich realisierten wir für einen mühelosen Ablauf bei der Ticketauswahl einen gänzlich neuen User Flow auf Basis von Personas. Dieser unterstützt und leitet Nutzende mit gezielten Abfragen durch die komplexe Preisgestaltung und -struktur der Stiftung. Auch die bisherige manuelle Mehrarbeit durch die doppelte Content-Pflege in Website und Ticketshop konnten wir mit der Zusammenführung von Website und Ticketshop für das Team der Online-Redaktion deutlich reduzieren.

Für eine bessere Zielgruppenansprache sollte die Website insgesamt moderner, frischer und emotionaler werden, ohne dabei in das bestehende Corporate Design einzugreifen. Dazu haben wir einen vollbreiten Video-Teaser auf der Startseite eingeführt, der Nutzende direkt in die Welt der Schlösser & Gärten zieht und zu einem Besuch einlädt. Auch die Headerbilder auf den Detailseiten wurden vergrößert und lassen bereits den Blick auf Details zu. Mit der Gestaltung zweier neuer Teaser-Formate können Inhalte bei Bedarf nun deutlich plakativer und werblicher dargestellt werden. Ergänzungen im bestehenden Icon-Set verhelfen jetzt zur passgenauen Kommunikation, so konnten beispielsweise generische Pfeil-Symbole mit Icons, die dem Inhalt entsprechen, ausgetauscht werden. Weiterhin umfasst unser Redesign die generelle Optimierung von Abständen, Schriftgrößen und der Überschriften-Hierarchie, aber auch Aspekte der Nutzendenführung durch die Einführung von Primary und Secondary Buttons.

Von übergreifender Wichtigkeit jedoch war die Überarbeitung des Designs hinsichtlich mobiler Zugriffe und der barrierefreien Nutzung. So wurden Zeilenlängen, -abstände und Kontraste entsprechend angepasst und beispielsweise Steuerungselemente wie ein Pause-Button für automatisierte Slider eingeführt.

Die Website der Stiftung Preußische Schlösser und Gärten Berlin-Brandenburg basiert auf dem Content Management System TYPO3. Eine der zentralen Aufgaben für unser Backend-Development-Team in diesem Projekt bestand aus der schrittweisen Durchführung von vier Versions-Updates des CMS, wofür wir die TYPO3-Migrationsskripte nutzten und erweiterten. Dadurch waren für das Redaktionsteam in der Vorbereitungsphase des Launches nur kleinere Anpassungen und Optimierungen des über viele Jahre entwickelten Website-Content erforderlich.

Der zweite Baustein unserer Systemarchitektur für das Portal der SPSG ist das neu aufgesetzte Shop-System auf Basis von Magento Version 2, das das bisherige Magento Version 1 ablöst. Im Zuge der technischen Konzeption entschieden wir gemeinsam mit allen Stakeholdern, die bisher getrennten Oberflächen von Website und Shop zugunsten einer optimierten Customer-Journey sowie eines ressourcenschonenden Pflegeaufwands zu einer zentralen Plattform zusammenzuführen. 

Das Shop-System ist an die Buchungsmanagementsoftware KORONA via APIs angebunden. Als zentrale Unternehmenssoftware hält KORONA die Artikelstammdaten vor, übernimmt gleichzeitig buchhalterische Vorgänge und ermöglicht der SPSG die Verwaltung von individuellen Kapazitäten und Öffnungszeiten je nach Objekt. Per Cron werden automatisiert Produkte von KORONA in Magento importiert und aktualisiert.

Den mehrstufigen Prozess des Ticketkaufs verschlankten wir durch eine hochperformante Umsetzung als React-App für die TYPO3-basierte Website, die Nutzenden eine schnelle Buchung ihrer Tickets ohne Reloads erlaubt. Die React-App bezieht fortlaufend die aktuellen Informationen aus dem Magento-Cache, ein Cron wiederum sorgt regelmäßig für die Aktualisierung dieses Caches – so werden Ladezeiten beim User auf ein Minimum reduziert und die Performance erhöht. 

Aus Gründen des Denkmalschutzes sind für ausgewählte Objekte die Besucherzahlen beschränkt und werden durch spezifische Zeit-Slots reglementiert. Dafür wird im Buchungsprozess das vom Kaufenden ausgewählte Zeitfenster für 15 Minuten sowohl in Magento also auch via Schnittstelle in KORONA reserviert. Erst nach Abschluss des Kaufs wird der Slot verbindlich eingebucht. Dabei werden sämtliche Käufe in unserem Message Broker via Queue abgearbeitet, sodass das entgegennehmende System nicht überlastet wird. Zunächst sendet Magento eine Buchungsbestätigung an den Kunden. Erst nachdem KORONA den Kauf erfolgreich entgegengenommen hat, wird das Ticket an den Kaufenden als PDF sowie als pkpass-Datei – eine digitale Eintrittskarte mit QR-Code – versendet, das am Einlass gescannt wird.

Wird ein Kauf innerhalb der 15-minütigen Frist nicht abgeschlossen, wird der Warenkorb und die Reservierung gelöscht. So stehen die vorhandenen Kapazitäten eines Objektes oder einer Veranstaltung wieder für eine neue Buchung zur Verfügung.

Innerhalb des Checkout-Prozesses im Ticket-Shop wurde eine freiwillige Abfrage der Postleitzahl des Kunden integriert. Sofern Nutzende ihre Zustimmung erteilen, wird die Postleitzahl an KORONA übertragen, sodass die SPSG dort die Käufe für künftige Marketingaktivitäten statistisch auswerten kann.

Um die Vorzüge eines professionellen Newsletter-Systems vollends ausschöpfen und um auf aktuellste Sicherheitsstandards setzen zu können, ersetzten wir die in TYPO3 integrierte Newsletter-Funktion durch das Newsletter-System Brevo. In Brevo wurden die bestehenden Newsletter-Empfänger migriertund für die verschiedenen Abteilungen eigene Newsletter-Templates hinterlegt, um individuell auf die Zielgruppen zugeschnitten zu kommunizieren.

Für den Betrieb der rundum erneuerten SPSG-Website übernahm SIRUP die Beratung zum Hosting-Konzept und ist nach Abschluss des Relaunch-Projekts mit der dauerhaften Wartung der Systeme, Betreuung des Redaktionsteams und Weiterentwicklung des Portals betreut.