Skip to main content
Die Tonhalle Düsseldorf am Abend

Tonhalle Düsseldorf

Digital Landscaping

 

 

 

 

 

 

 

Tradition trifft Digitalisierung

Wie präsentiert man eines der schönsten Konzerthäuser Deutschlands zeitgemäß im Netz? Mit einer passenden Digitalstrategie und der Modernisierung von Website und Kartenshop.

Mit unserem Ansatz und der erfolgreichen Umsetzung belegen damit den zweiten Platz bei den Drupal Splash Awards Deutschland und Österreich im Jahr 2022.

Unser Techstack für das Projekt

Wir setzen auf Drupal - aber nicht ausschließlich. Für das Projekt der Tonhalle Düsseldorf haben wir Drupal als headless CMS eingesetzt und mit einem Next.js Frontend ausgeliefert. Das Hosting für die gesamte Infrastruktur wurde mit AWS umgesetz.

Technologien

AWS Logo
Drupal Logo
Next.js Logo

Unsere Herausforderung

Im ehemaligen Planetarium am Düsseldorfer Rheinufer residiert eines der schönsten Konzerthäuser Deutschlands: die Tonhalle.

Mehr als 300.000 Zuschauer pro Jahr besuchen die Düsseldorfer Symphoniker und viele andere namhafte Künstler in über 450 Konzerten. Unsere Aufgabe bestand in der Umsetzung anspruchsvoller Ziele und Herausforderungen:

  • Kompletter Relaunch der digitalen Marketing-Landschaft
  • Umsetzung eines modernen UI, dessen UX inspiriert wurde von etablierten Streaming Diensten wie Netflix
  • Migration alter Inhalte aus dem Legacy System
  • Anbindung an neue Fremdsysteme
  • Moderne Architektur etablieren
  • DSGVO konforme Umsetzung
Luftaufnahme der Tonhalle

Wie wird eine Kulturinstanz digital?

Durch User Experience und eine durchdachte Customer Journey

Damit wurde die Webseite für die Tonhalle nicht nur technisch auf einen zeitgemäßen Stand gebracht, sondern auch visuell an das neue und frische Corporate Design angepasst. Zusätzlich wurden Prozesse hinterfragt, optimiert, angepasst und externe Systeme (wie das Ticketsystem für den Kartenverkauf und das Veranstaltungs-Management-System) angebunden. Mit einem einzigen Ziel: dem Besucher eine konsistente und angenehme Buyer Journey zu ermöglichen.

Durch Inhalte, die beeindrucken

Hunderte Veranstaltungen pro Saison, Geschichte & Kultur der Tonhalle und Informationen rund um alle Services und Dienstleistungen des Konzerthauses sowie einen umfangreichen Presse- und PR-Bereich für Fachbesucher bietet die Webseite Musikinteressierten ein vollständiges Repertoire an Inhalten und Informationen.

Auf den Punkt gebracht

Folgende Ziele hat uns unser Kunde gesetzt:

  • Hohe Anforderungen an die Performance des Gesamtsystems, um für die kommenden Jahre gerüstet zu sein.
  • Modernes, schnelles User Interface - das dürfen Besucher heute erwarten.
  • Ein komfortables und intuitives Backend macht Redakteuren ihre tägliche Arbeit einfacher.
  • Flexible Möglichkeiten zur Content-Erstellung durch das Inhouse-Team spart externe Kosten.
  • Ein modernes CMS zeigt, dass die Tonhalle mit der Zeit geht.
  • Anbindung an die neue SaaS Ticketing-Plattform Secutix.
  • Integration der bestehenden Veranstaltungsdatenbank, den dort werden die Events gepflegt.
 

Unser Lösungsansatz

Legacy-Systeme in den Griff bekommen

Inhalte der alten Website sollen in das neue System importiert werden - möglichst ohne manuelle Arbeit. Wir verwenden Drupal Migrate um die alten Presse-Inhalte in das neue System umzuziehen.

Modernes Frontend & Robustes CMS

Wir verwenden Drupal als decoupled (headless) System in diesem Projekt - das erlaubt uns ein vollständig javascript basiertes Frontend umzusetzen und gleichzeitig das volle Potenzial von Drupal zu nutzen. So können wir die gewünschte User Experience unserer Kunden und dem Design-Team umsetzen ohne Kompromisse einzugehen. Für eine professionelle Medienlösung verwenden wir Cloudinary als CDN - denn mit programmable Media können wir weitere Redaktionsarbeiten der Kunden automatisieren und Bilder mit einer Gesichtserkennung automatisch skalieren und zuschneiden.

Wie erschafft man ein gutes Produkt? Durch einen guten Prozess!

Wir führen einen agilen Prozess mit allen Beteiligten ein. Kunden, Partner und andere Dienstleister arbeiten und denken mit uns erfolgreich in Sprints. Wir schaffen die Möglichkeit, schnell auf sich ändernde Anforderungen reagieren zu können und iterieren und entwickeln die Features für die neue Website gemeinsam.

Neue Systeme im Projekt

Zusammen mit der neuen Website führt unser Kunde auch ein neues Shopsystem ein. Der neue Secutix Webshop der Tonhalle wird vollständig an das Design der Tonhalle angepasst.

abstrakte elemente
Linie mit Drupal 9 Logo

Bitmade entwickelt mit State-of-the-Art Technologie

  • Als Basis dient Drupal als Decoupled/Headless CMS, das Frontend wurde mit Next.js umgesetzt.
  • Anzuzeigende Daten werden von Drupal via JSON:API mit Hilfe der Next-Drupal-Pakete (Next.js for Drupal ) an das Frontend ausgeliefert.
  • Als Frontend-Frameworks kommen React und Tailwind CSS zum Einsatz.
  • Das System wird in der AWS Cloud gehostet und betrieben.
  • Für Redakteur-freundliches Arbeiten wurde ein automatisches Bilder-Resizing und Cropping implementiert: über die Cloudinary Facedetection werden alle benötigten Bilder-Derivate AI-gestützt erzeugt und über ein CDN ausgeliefert.
  • Ein automatischer, zeitbasierter Import von Events mit dem Migrate API Framework wurde eingerichtet.
  • Das Drupal-Backend erfreut mit dem Gin-Theme und bietet Nodes/Paragraphs als Building-Blocks für Website-Content.
  • Mit Elastic/OpenSearch wurde eine moderne und schnelle Suche integriert, die umfangreich genutzten Veranstaltungs-Slidern zeigen passende Events mittels Search API an.
  • Smarte realtime Segmentierung von Events erlaubt den Redakteuren, neue Themen-Bereiche (Karusselle/Slider) in Drupal flexibel und einfach als Paragraphs zu erzeugen und die zahlreichen Veranstaltungen nach Kundenvorstellung zu gruppieren.
 

Ein starkes Team für ein erfolgreiches Projekt

Das Logo von Grand Quest

Grand Quest

Kreation von Design & digitalen Experiences

Als inhabergeführtes Kreativstudio entwickelt Grand Quest Marken, die mitten ins Wunschzentrum des Menschen zielen.

Ein Profilbild von Max Wagner

Max Wagner

Digitale Transformation

Max hat die Tonhalle bei der digitalen Transformation unterstützt und beraten. Wir haben gemeinsam agile Workflows etabliert um die Kundenanforderungen zu realisieren.

Logo von TecBits

TecBits

DevOps & Hosting

Andreas Geerts & Florian in der Beek waren als zertifizierte Amazon Web Service Partner im Projekt für Umsetzung der Cloud-Infrastruktur verantwortlich.

Profilbild von Simon vom Eyser

Simon vom Eyser

Frontend Engineering

Als Senior Frontend-Engineer hat Simon unser Team bei der Entwicklung der Next.js UI unterstützt.

Ergebnisse

  • Moderne, neue Website sorgt für Begeisterung
  • Hochperformante Website mit Enterprise Architektur
  • Ändern des Shopsystems hat keinen negativen Impact auf Verkaufszahlen gehabt
  • Autoscaling der Hosting-Architektur
  • Zero-downtime Deployments

Folgende Herausforderungen hat Bitmade erfolgreich meistern können:

  • Neuer Look&Feel wurde konsequent und systemweit umgesetzt.
  • Legacy-Inhalte wurde mit Hilfe der Migrate API aus dem alten System importiert.
  • Drittanbieter wurden u.a. über SOAP-API angebunden.
  • Unter der Haube arbeitet ein professionelles Caching in Verbindung mit dem Decoupled-System.
Das Logo der Tonhalle

Fazit

Visuell erwartet den Besucher eine moderne Webseite, die klassische Musik entsprechend würdigt.

Unsichtbar für den User ist der umfangreiche Techstack, der dies ermöglicht: ein modernes Headless Drupal, welches Fremdsysteme über verschiedene Schnittstellen anbindet und integriert. AI-gestützte Bilderzeugung, welche die Redakteure bei der täglichen Arbeit unterstützt. Moderne Suchdienste und realtime Segmentierung von Events, die gewünschte Inhalte filtern. Ein React- und Next.js-basiertes Frontend, welches dem Besucher eine angenehme User Experience bietet.

All das ergibt zusammen ein System nach modernsten Standards, welches die Tonhalle viele Jahre begleiten kann.

Bitmade bei den Splash-Awards Teaser-Bild

Bitmade bei den Splash Awards

Wir sind stolz darauf, direkt mit unserer ersten Wettbewerb-Einreichung den 2. Platz erreicht zu haben. Und zwar in der Kategorie eCommerce für unser Projekt "Website und Kartenshop der Tonhalle - dem Planetarium der Musik am Düsseldorfer Rheinufer".