Webentwicklung & UX 2025

Teatre Nacional de Catalunya

Komplette Neugestaltung der digitalen Plattform des Teatre Nacional de Catalunya mit Drupal: dynamischer Kalender.

8 Monate 6 Spezialisten 2025 tnc.cat

Leistungen

Drupal-Entwicklung
UX/UI Design
WCAG-AA-Barrierefreiheit
Performance-Optimierung
Content-Architektur

Verwandte Leistungen

01Die Herausforderung

Das Teatre Nacional de Catalunya verwaltet einen Kalender mit hoher redaktioneller Rotation, Traffic-Spitzen bei Kampagnen und Premieren, und dem kritischen Bedarf, Nutzer in 2-3 Klicks zum Ticketkauf zu führen, ohne sich zu verlieren. Das Redaktionsteam benötigte schnelle Veröffentlichung mit Qualitätskontrolle, AA-Barrierefreiheit und stabile Leistung auf Mobilgeräten.

02Die Lösung

Wir entwickelten ein aufgabenorientiertes UX-Redesign: Kalendernavigation mit intelligenten Filtern, Showseiten mit klarer visueller Hierarchie und konsistente Call-to-Actions. Wir implementierten Drupal mit wiederverwendbaren Komponenten, redaktionellen Workflows und einer soliden Performance-Basis mit Cache-Strategie und CDN-Vorbereitung.

Tech-Stack

So ist es gebaut

Frontend

Twig Frontend-Templates
Tailwind CSS Styling-System

Engine

Drupal 10 Strukturiertes CMS

Daten

Varnish HTTP-Cache
Redis In-Memory-Cache
Cloudflare CDN & Sicherheit

03Architektur

Wie eine Anfrage verläuft

Ein Redakteur veröffentlicht oder aktualisiert die Seite einer Veranstaltung in Drupal, mit Freigabe- und Vorschau-Workflow, bevor sie live geht
Die Anfrage eines Besuchers läuft über Cloudflare und dann über Varnish, das die Seite bei vorhandenem Cache-Eintrag aus dem Cache ausliefert
Ist kein Cache-Eintrag vorhanden, baut Drupal die Seite mit seinen wiederverwendbaren Komponenten (Termine, Besetzung, Preise) auf und nutzt für häufige Abfragen Redis
Der Besucher filtert das Programm und erreicht die Veranstaltungsseite in 2-3 Klicks dank der visuellen Hierarchie des Inhalts und des Kauf-CTA
Der CTA führt zum Ticketkauf, mit Lazy Loading und optimierten Assets, die den LCP auch bei Trafficspitzen durch Premieren und Kampagnen niedrig halten

04Gemessene Wirkung

Ergebnisse

-37% LCP Mobil
+18% Seiten/Sitzung
100% WCAG AA
2.4s LCP (vorher 3,8s)

Überprüfbare Daten

Metriken im Detail

Klicks bis zum Ticketkauf ab der Startseite: 2-3
Dauer des kompletten Plattform-Redesigns (Monate): 8
Spezialisten im Projektteam: 6
Cache-Schichten, die die Traffic-Spitzen bei Premieren und Kampagnen abfangen (Cloudflare, Varnish, Redis): 3

Methodik: Projektumfangs- und Umsetzungsdaten (2025): Dauer und Team stammen aus dem Vertrag; die Kauf-Journey und die Cache-Schichten aus der ausgerollten Architektur. Die Performance- und Barrierefreiheitskennzahlen des Redesigns (LCP, Seiten pro Sitzung, WCAG AA) stehen im Ergebnisbereich dieses Cases.

05Der Prozess

Der Prozess

Discovery

UX-Audit der aktuellen Seite, Analyse der Kaufflüsse und KPI-Definition
Architektur

Entwurf von Inhaltstypen, Taxonomien und redaktionellen Workflows
Design

UI/UX mit Fokus auf Konversion und WCAG-AA-Barrierefreiheit
Entwicklung

Drupal-Implementierung mit wiederverwendbaren Komponenten und kontinuierlichem Testing
Optimierung

Performance-Tuning, Cache und Vorbereitung auf Traffic-Spitzen