Tomorrowland

Digital Tomorrowland: Eine immersive Experience für das legendäre Musikfestival

pr tomorrowland

Tomorrowland ist eines der größten EDM-Festivals der Welt. Doch als die Welt im Jahr 2020 aufgrund der Pandemie zwischenzeitlich still stand, war es ungewiss, ob das legendäre Festival überhaupt stattfinden würde. 
 
Erfahren Sie, wie Dogstudio (part of DEPT®) Tomorrowland dabei geholfen hat, ein bahnbrechendes, umfassend digitales Erlebnis zu schaffen: Tomorrowland, Around the World.

Eine Experience, zum Leben erweckt

Zwei Tage lang tauchten Tomorrowland-Fans rund um den Globus (eine Million Menschen) in eine magische Welt ein. Dank einer WebGL-Experience, die sowohl für Mobilgeräte als auch für den Desktop entwickelt wurde, konnten die Fans ihre Lieblingssets bequem von zu Hause aus verfolgen. Die Atmosphäre auf einem Festival Gelände variiert natürlich je nach Tageszeit und auch bei EDM-Festivals haben die Sets am Tag oder in der Nacht eine andere Stimmung. Genau das haben wir durch das Design und die Entwicklung eines Tag- und Nachtmodus nachgestellt. Da die Set-Zeiten mit dem traditionellen Zeitplan des Musikfestivals übereinstimmten, wurde das Festival dadurch so lebensecht wie möglich gestaltet. 
 
Stellen Sie sich nun eine Insel vor, die mit Booten, Lampions, Fischen, Sonnenstrahlen, Schmetterlingen und Wolken versehen ist. Diese fantasievollen Elemente waren entscheidend für das magische Gefühl, für das Tomorrowland bekannt ist. Um die Besucher:innen zu begeistern, fügten wir verschiedene Preps hinzu, um die Insel zum Leben zu erwecken. Diese wurden mit Hilfe eines verstellbaren WYSIWYG-Spline-Systems positioniert, sodass das Tomorrowland-Team bei der Auswahl der besten Platzierungen helfen konnte.

Erkundung & Navigation

Während des Festivals konnten sich die Besucher:innen frei auf der Insel bewegen, indem sie schwenkten, hinein- und herauszoomten und durch die Landschaft klickten. Aber wie bei jedem Festival kamen die Leute vor allem wegen der Musik. Ein Lichtspektakel um die verschiedenen Bühnen herum symbolisierte das Netzwerk der Menschen, die sich um den Live-Act versammelten und machten sie zu einem Teil des Erlebnisses.

Durch einen Klick auf die Bühnen konnten die Inselbesucher:innen Informationen über den Veranstaltungsort, die Bühne und das Line-up abrufen, bevor sie die Show besuchten. Sobald sie eine Bühne betraten, wurden sie sofort in eine einzigartige DJ-Performance mitgenommen, die in die beeindruckende 3D-Welt von Tomorrowland integriert war.

Wir lieben kleine Details. Deshalb haben wir alles an unserer GUI (Graphical User Interface) vollständig konfigurierbar gestaltet. Zum Abschluss rundete ein Überraschungsfeuerwerk das Ende der Shows am ersten Tag ab, genau wie bei einem echten Festival.

Es ist uns gelungen, die einzigartigen Emotionen des Festivals in ein digitales Erlebnis zu übersetzen.

Philippe Ben Mohamed, Lead Digital & Development, Tomorrowland

+1M

Zuschauer:innen auf der ganzen Welt, von Japan bis Mexiko

4

Verschiedene Recording Studios auf der ganzen Welt errichtet

+60

Der bekanntesten EDM-Künstler:innen, die ihre neuesten Tracks präsentierten

Credits

  • Creative Direction und Concept: Henry Daubrez
  • Lead Producer: Sebastien Goffin
  • UX/UI Design: Camille Theveniau, Lorena Foucher & Henry Daubrez
  • 3D Simulation: Paul Guilhem Repaux
  • Lead Developer: Anthony Du Pont
  • Technical Direction: Anthony Du Pont & Samuel Honigstein (3D)
  • 3D Developer: Samuel Honigstein & Jordan Machado
  • Sound Engineering: Gimmi Pace
  • Video MusiK: Ocoeur – Overclock

Fragen?

CEO / CCO at Dogstudio

Henry Daubrez

INTER

Fans rund um den Globus inspirieren und unterhalten

Das Jahr 2022 war für Inter mit klaren Zielen verbunden. Nach dem Brand Identity Update und der Neugestaltung des ikonischen Wappens in Zusammenarbeit mit Bureau Borsche ging es in diesem Jahr um die Überarbeitung der digitalen Kanäle von Inter. Mit der zunehmenden Digitalisierung des Fußballs – von Esports bis hin zur globalen Fangemeinde und allen Arten von Digital Ownership – ist Inter bereit, die Vorreiterrolle einzunehmen. Daher stellte sich die Frage: “Wie können wir unsere digitalen Kanäle für ein breiteres globales Zielpublikum relevant machen?” DEPT® lieferte die Antwort und übernahm die Strategie, das Design sowie die Entwicklung der neuen App und Website.

INTER slanted static

Die 3 wichtigsten Erkenntnisse

Wie Inter die digitalen Kanäle nutzt, um die weltweite Fangemeinde zu vergrößern.

Wie Inter die Sponsoring-Aktivitäten ankurbelt.

Wie Inter die Marke mit Kultur verbindet.

Weltweites Wachstum der Fangemeinde

Fußball wäre nicht Fußball ohne die Fans. Und das wissen auch die Nerazzuri. Um ein globales Publikum anzusprechen, das sich für “mehr” als Fußball interessiert, haben wir uns für eine neue digitale Experience Strategie entschieden, die sich auf die Mailänder Kultur, Spieler und Geschichten konzentriert. Und der Content ist hier wirklich King. 

Das gilt auch für Inter TV, wodurch den Fans auf der ganzen Welt Zugang zu einer großen Bandbreite an Videos ermöglicht wird. Doch alles, was mit dem Fußballspiel an sich zu tun hat, ist natürlich auch im neuen Match Center zu finden, das Engagement-Funktionen wie “Man of the Match” beinhaltet. 

Last but not least wird auch eine Differenzierung in der Channel-Strategie vorgenommen, wobei sich das Web hauptsächlich an (internationale) Sportfans richtet, während die App eher für die Hardcore-Fans der Schwarz-Blauen gedacht ist.

Die Fans können Inter nun auf eine noch immersivere Weise über die Website und die App verfolgen, welche dank der wertvollen Zusammenarbeit mit DEPT® in neuem Ganz erscheinen.

Luca Danovaro, Chief Revenue Officer beim FC Internazionale Milano

INTER players

Verstärkung der Aktivierung von Sponsoren

Die neue Website und die App bieten sowohl für Inter als auch für seine Sponsor:innen, Partner:innen und Advertiser:innen eine Vielzahl von kommerziellen Möglichkeiten. Diese reichen von bekannten Optionen wie Bannering und Werbeflächenbis hin zu exklusiveren Optionen wie speziellen Microsites mit maßgeschneiderten Erlebnissen, die Inter’s Hauptsponsor:innen und Partner:innen besonders ins Rampenlicht rücken.

Inter x Nike wurde Anfang Juli gestartet, um die neuen Trikots für 2022 zusammen mit Nike zu präsentieren. Darüber hinaus greifen die digitalen Kanäle von Inter auf Konten zurück, die über einen Login den Zugang zu Inter TV ermöglichen und exklusive Inhalte sowie andere Vorteile freischalten.

Brand mit Kultur verbinden

Für Inter ist Fußball die eine Seite. Die Kultur ist die andere. So ist es nicht verwunderlich, dass das Thema Kultur einen prominenten Platz in allen Kanälen einnimmt. Die Spieler werden auf den dafür vorgesehenen Seiten vorgestellt und teilen ihre Geschichten, Interessen und Vorlieben – über den Fußball hinaus. Da etwa einer von fünf Fans mehr an den Spielern selbst als am Spiel interessiert ist (laut The European Football Benchmark 2021), gibt es hier sicherlich einen Bedarf zu decken. In Zukunft wird Inter seine Kultur-Seiten mit dem Fokus auf (lokale) Promi-Fans und ihre Liebe zu Mailand ausbauen – so wird das Globale lokal.

INTER jerseys

Der Blick nach vorn

Genau wie auf dem Spielfeld ist für den digitalen Erfolg eine gute Strategie unerlässlich. Deshalb verfügen alle Kanäle über eigene Roadmaps. Diese enthalten mehrere zukünftige Veröffentlichungen mit neuen Seiten rund um Kooperationen und die Mailänder Kultur, eine “IM Premium”-Kontenstufe mit noch mehr Inhalten und Vorteilen, spezielle Microsites mit anderen Sponsoren, exklusive Inter NFTs und vieles mehr. 

Die neuen digitalen Kanäle sind nur der Anfang des Engagements von Inter, ein führender Verein in Sachen digitales Fan-Engagement und -Erlebnis zu werden. Forza Inter!

FORZA INTER!
Entdecken Sie die Website

Fragen?

Product Design Team Lead

Jakob Ulrich

Hochbahn

Website Relaunch für die Zukunft der digitalen Mobilität

Hochbahn Mood Image4 1

Die Zukunft der Mobilität liegt in Hamburg. Dieses Ziel hat sich zumindest die Stadt Hamburg und, als einer der größten Arbeitgeber der Stadt, auch die Hamburger Hochbahn AG gesetzt. So geht Hamburg als “Reallabor Digitale Mobilität” in eine Testphase, die erforschen soll, wie die Digitalisierung die Mobilität in den kommenden Jahren im städtischen und ländlichen Raum beeinflusst und verbessern kann.

Die Hamburger Hochbahn AG ist das größte Verkehrsunternehmen in Hamburg. Sie betreibt das U-Bahn-Netz sowie einen Großteil des Stadtbus-Netzes innerhalb des Hamburger Verkehrsverbundes (hvv). Für dieses Projekt hat die HOCHBAHN DEPT® mit einem technischen sowie visuellen Relaunch ihrer Website hochbahn.de beauftragt. Neben der Einführung von CoreMedia als CMS, hat DEPT® ein komplett neues digitales Designkonzept für die HOCHBAHN entwickelt.

Hochbahn Mockup Grid

In die Zukunft mit benutzerfreundlichem Headless-CMS

Bis 2030 will der Hamburger Senat ca. 30% der Hamburger:innen mit dem öffentlichen Nahverkehr an ihre Ziele bringen. Dafür werden große Teile der Infrastruktur digitalisiert und auf ein neues Level gebracht. Als das größte Verkehrsunternehmen in Hamburg, darf da die HOCHBAHN natürlich nicht fehlen. Sich selbst sieht die HOCHBAHN als Zukunftsbeweger:innen. Zu den erklärten Zielen gehört es, die Lebensqualität in Hamburg und dem Umland zu erhöhen, indem Abgase eingespart werden und der Lärm auf ein Minimum reduziert wird. Über 6.000 Angestellte arbeiten täglich daran, genau diese Mission umzusetzen, darunter verschiedenste Stellen im Handwerk, Jobs im Fahrbetrieb und Verwaltungstätigkeiten. Aus diesem Grund ist das Recruiting neuer Mitarbeiter:innen eine zentrale Aufgabe der Hamburger Hochbahn AG. Zu den wichtigsten Werkzeugen zählt dabei die eigene Website.

Um dem Anspruch einer modernen, zukunftsfähigen Website gerecht zu werden, wurde sich im Vorfeld für das Headless-CMS von CoreMedia als neue technologische Basis entschieden. Das System zeichnet sich durch hohe Flexibilität und Benutzerfreundlichkeit aus, was eine optimale technische Grundlage für die Hochbahn schafft.

Hochbahn Mockup Startseite Grau 2

Zielgruppenorientiertes Designkonzept mit Barrierefreiheit im Fokus

Bei der Entwicklung der neuen HOCHBAHN Website wurde sehr viel Wert auf ein modernes Design, eine sehr gute Usability nach dem Mobile First Ansatz, sowie auf einen geschärften Zielgruppenfokus gelegt. Zur Kern-Zielgruppe zählen in diesem Fall Bewerber:innen, Presse, Politik und alle, an der HOCHBAHN als Unternehmen interessierten Menschen. Die konkreten Anforderungen dieser Nutzer:innen wurden im Rahmen einer gemeinsamen Workshop-Serie zu Beginn des Projekts identifiziert.  Die Schwerpunkte lagen dabei auf den Themen Branding/ Digital Design Direction, Informationsarchitektur, sowie einem User-Story-Mapping. Auf diese Weise wurden essentielle Grundlagen für die Umsetzungsphase erarbeitet.

Eine besonders wichtige Anforderung an die neue Website galt der Barrierefreiheit und der Realisierung nach Web Accessibility Standard WCAG 2.1 (Level AA), um den Zugang der Website-Inhalte für Menschen mit Behinderungen, für ältere Menschen sowie Menschen mit temporären Einschränkungen zu verbessern. Dies wurde bei Konzeption, Design und der technischen Umsetzung entsprechend berücksichtigt.

“Als Agentur mit Sitz in Hamburg war es für uns eine große Freude, den Relaunch der neuen Website der Hamburger Hochbahn AG umzusetzen. Ein zielgruppenorientiertes Design zu entwickeln und dabei stets die Barrierefreiheit im Fokus zu behalten, war eine spannende Herausforderung. Die Workshops mit den Ansprechpartner:innen der Hochbahn liefen sehr harmonisch und stets auf Augenhöhe. Wir freuen uns, dass wir so einen Teil dazu beitragen konnten, dass die Hamburger Hochbahn AG als “Zukunftsbeweger” auch digital zukunftssicher unterwegs ist”, erklärt Oliver Cloppenburg, Managing Director Design & Technology bei DEPT®.

“Hamburg ist ein Reallabor für digitale Mobilität und wir sind mit unserer neuen Website ein großer Teil davon. Wir bewegen mit unseren über 6.000 Mitarbeiter:innen täglich tausende Menschen in und um Hamburg, und auch die mobile Zukunft unserer Stadt und Region. Durch den Website-Relaunch können wir diese Botschaft jetzt auch digital viel besser vermitteln, potenzielle engagierte Bewerber:innen zielgruppengerecht ansprechen und sehen uns damit für die Zukunft dank DEPT® bestens aufgestellt”, erklärt Marcus Schulz, Fachbereichsleiter Digitale Geschäftsmodelle bei der HOCHBAHN.

Fragen?

Key Account Manager

Markus Altenkirch

Formula E

Aufbau, Beschleunigung und Neuerfindung des Rennsports

1 EPS606 071410 J6I3423 scaled 2

Ein jahrhundertealter Sport, neu erfunden: Lautlos, ohne CO2-Emissionen und mit Rennstrecken mitten in der Stadt – die Formel E bietet einzigartige Erlebnisse, sowohl offline als auch online.

Marken wie Michelin, BMW, Heineken und Boss haben ihren Namen bereits mit dem immer beliebter werdenden Motorsport verbunden, während die junge Fangemeinde schnell wächst. Über die brandneue App, in der smarte Renndaten, innovative Augmented-Reality-Lösungen und ein Live-Rennzentrum zusammenkommen, können Fans ab sofort noch näher an ihre Lieblingsfahrer:innen herankommen.

Racing, reinvented

Da die Formel E zu 100% elektrisch betrieben wird, eröffnen sich dank der neuen Technologie bisher unbekannte Möglichkeiten. So können die Zuschauer:innen den Ausgang des Rennens aktiv mitbestimmen, indem sie den Rennwagen ihres Lieblingsfahrers während des Rennens über ein Online-Abstimmungssystem boosten. Dieser so genannte “FanBoost” verleiht dem Fahrer je nach Anzahl seiner Fans mehr PS. Das nennt sich innovatives Engagement 2.0. Und das ist noch nicht alles, denn im Rennen der Zukunft sind Sie näher an Ihrem Sport dran als je zuvor. Die Formel E-App bietet Ihnen alles, was Sie für ein erstklassiges Renntagserlebnis brauchen. Sehen Sie, wo berühmte Künstler:innen auftreten, fahren Sie virtuell gegen Ihre Lieblingsfahrer in Rennsimulatoren, verfolgen Sie die Qualifikationen live und erfahren Sie jederzeit die neuesten Nachrichten und wichtigen Entwicklungen während des Tages.

Visual Light 102 1 scaled


Augmented Reality und ein Live-Rennzentrum kommen zusammen

Visual Light 103 scaled

Stammesbildung

Auf der Plattform werden sowohl Marken und Veranstaltungen rund um den Renntag als auch das Engagement der Fans in einem einzigen integrierten Erlebnis vereint. In dieser digitalen Welt des Motorsports dreht sich alles um soziale Netzwerke und Influencer, aber die Live-Interaktion ist ein ebenso wichtiger Teil des Sports. Die App unterstützt dieses Konzept durch Stammesbildung, ein Mittel, das es Besucher:innen ermöglicht, sich langsam zu echten Fans zu entwickeln. Der Schwerpunkt liegt dabei auf persönlichen und kontextbezogenen Berührungspunkten, bei denen auch gesponserte Marken in dem Moment relevant sind. Man denke an Live-Rennberichte, Tracking-Board-Radios und Unfall-Updates.

Visual Light 104 scaled

Die Macht der Daten

Abgesehen von der Tatsache, dass die App die Fans mit Informationen und einem unterhaltsamen Erlebnis versorgt, ist die Plattform auch intelligent. Sie passt sich den unterschiedlichen Gegebenheiten an, denn die Renntage sind dynamisch, in jeder Stadt anders und ändern sich jedes Jahr. Deshalb hat DEPT® eine Funktion entwickelt, die mit Google Maps verknüpft ist und sich jedes Jahr anpasst. Sie informiert die Menschen darüber, wo sie sich befinden, was sie tun können und wie sie dorthin gelangen können. So ist die App immer auf dem neuesten Stand und relevant. Darüber hinaus macht es die App potenziellen Fans leicht, in das Wissen der Formel E einzutauchen: Was genau ist so interessant? Wer sind die Helden? Wie lauten ihre Platzierungen? Und was ist so anders als unsere bekannte Formel 1?

Intelligente Daten, ein umfassendes Erlebnis, soziale Updates, Kontakt mit den Fahrern und Veranstaltungsinformationen sind nahtlos integriert; von dem Moment, in dem Sie sich für den Kauf eines Tickets entscheiden, bis zum Renntag und bis zu dem Moment, in dem Sie zufrieden nach Hause zurückkehren.

Visual Light 105 scaled

Fahrplan für die Zukunft

Innovation ist der Schlüssel, aber die Entwicklung der App ist nur ein Ausgangspunkt für die Formel E. Während wir sprechen, ist eine größere, integrierte Plattform, ergänzt durch eine Website, in Arbeit. Der Entwicklungsfahrplan sieht auch die Integration von Augmented Reality vor. Das bedeutet eine weitere Verbesserung der beeindruckenden Erlebnisfunktionen, wie die Chance, sowohl die Rennwagen als auch die Fahrer in 3D darzustellen, sowie die Möglichkeit, das Rennen virtuell von der Position des jeweiligen Fahrers aus zu verfolgen. Die ganze Zeit über denkt die künstliche Intelligenz über mögliche Rennausgänge nach, die sie mit Ihnen über eine dialogorientierte Benutzeroberfläche bespricht.

Was kommt als Nächstes?

Die Formel E ist mehr als eine Rennserie. Die auf der Rennstrecke gewonnenen Erkenntnisse helfen, unsere ohnehin schon zuverlässigen Elektroautos noch besser, intelligenter und schöner zu machen. Wir freuen uns, mit der entwickelten Super-App, die durch eine allumfassende Website noch erweitert werden wird, dazu beizutragen. Letztendlich bieten wir ein globales Erlebnis, das alle Aspekte des Formel-E-Rennens zusammenbringt. Nicht nur für die modernen Fans, sondern auch für die Rennteams und die innovativen Marken, die mit dem Motorsport verbunden sind – einzigartig in der heutigen Sportwelt. Wir sind stolz darauf!

Fragen?

Global SVP Technology & Engineering

Jonathan Whiteside

Transavia

In neuen Dimensionen abheben

RGB 21 Transavia Airplane Model 3 scaled

Transavia ist Teil der Air France-KLM-Gruppe und operiert von sechs Heimatstützpunkten in den Niederlanden und Frankreich. Das Ziel: Transavia soll zu Europas führender Fluggesellschaft in Hospitality und Service werden. Das Hauptziel ist dabei, neue Routen hinzuzufügen, Business-Passagiere sowie Freizeitreisende anzusprechen und eine dominante Online-Marke zu schaffen.

Kreation einer dominanten Online Brand

Das Rebranding war ein integrierter Prozess, der Unternehmensstrategie, E-Commerce und Markendesign kombinierte. Transavia begann mit der Arbeit an einer neuen E-Commerce-Plattform, um die Zusatzumsätze zu steigern, die Konvertierung von Flügen zu verbessern und die Betriebskosten zu senken. Nachdem die Notwendigkeit erkannt wurde, die Positionierung und visuelle Identität von Transavia in Übereinstimmung mit der neuen E-Commerce-Strategie und dem Konzept neu zu definieren, wurde DEPT® eingeladen, dem Team beizutreten.


Visual Light 104 3 scaled

Das neue visuelle Design ist verspielt, zugänglich und flexibel

Ergebnisse

Es begann mit der Entwicklung der neuen Positionierung von Transavia. Die beiden wichtigsten Ergebnisse waren die Änderung des Namens von transavia.com zu Transavia und die Definition von “It’s a pleasure” als Leitprinzip für das Unternehmen. Das Design ist verspielt, zugänglich und flexibel. Ein besonderes Merkmal ist die Anwendung von Symbolen auf den Unterbauch von Transavias Flugzeugen mit einer anderen Kombination von Symbolen für jedes Flugzeug in der Flotte. Eine weitere symbolische Bemalung erscheint neben dem Eingang, wo das Wort “Willkommen” in allen Sprachen der von Transavia bedienten Länder geschrieben ist. Die Identität wurde in der Marke eingeführt, einschließlich Uniformen, Catering-Trolleys, Bordservice und mehr.

RGB XX Transavia Compilation Articles min scaled

Fragen?

Operations Director

Wouter Dirks

Ascot Racecourse

Eine einzigartige Erfahrung

Ascot Banner2

Ascot ist berühmt für seine Verbindungen zur königlichen Familie und seine reiche Geschichte als Austragungsort von Weltklasse-Pferderennen. Es ist eine Ikone in der Reitsportgemeinschaft und mit einem Preisgeld von 7,3 Millionen Pfund das beliebteste Rennmeeting Großbritanniens. Royal Ascot begrüßt jedes Jahr 300.000 Rennbesucher:innen an fünf Tagen.

Visual Light 53 1 scaled

Die Markenwahrnehmung verändern

Die Ascot-Rennbahn kam mit einer einzigartigen Herausforderung zu DEPT®: Sie verfügte über einen erstklassigen Veranstaltungsort mit globaler Markenbekanntheit, aber ihre digitale Präsenz lag weit hinter ihren Wünschen zurück. Mit jahrelang veralteten Inhalten, Funktionen und einer überwältigenden Menge an Informationen nahmen unsere Teams die Herausforderung an, das Online-Erlebnis von Ascot komplett neu zu gestalten.

Dazu gehörte die Neudefinition der digitalen Markenpositionierung von Ascot mit der Veröffentlichung einer neuen Website. Die Plattform fängt die Lebendigkeit und Dynamik der Rennbahn ein, während sie den Besucher:innen der Website einen klaren Leitfaden für die Etikette des Veranstaltungsorts bietet. Das Online-Erlebnis wird durch eine elegante Benutzerführung erreicht, die sich nahtlos in die Back-of-House-Systeme und die Infrastruktur von Ascot einfügt und gleichzeitig ein beeindruckendes Website-Erlebnis bietet.

Visual Light 93 5 scaled

Das digitale Ascot-Erlebnis freischalten

2142930093 01 06 2021 10 48 03 Royal Ascot 2 scaled

Den digitalen Nachlass konzipieren

Es wurden umfangreiche Vorbereitungen getroffen, um einen Aktionsplan zu entwickeln, der das Markenangebot radikal neu positionierte und den Lifestyle-Aspekt dieser weltbekannten Sportmarke in den Mittelpunkt stellte.

Über einen Zeitraum von 10 Wochen leitete DEPT® eine Reihe von Discovery-, UX- und Branding-Workshops mit Ascot, um den Markt, in dem das Unternehmen tätig ist, vollständig zu verstehen und die Möglichkeiten zu ermitteln, die sich aus der Positionierung des Unternehmens in diesem Markt ergeben. Dabei wurden die Zielpersonen der Ascot-Rennbahn genauer unter die Lupe genommen, um herauszufinden, wer sie sind, wonach sie suchen und welche Probleme sie haben. Und um ihre wichtigsten Vor-Ort-Reiseabläufe zu erfassen. Auf der Grundlage dieser Untersuchung erstellte DEPT® ein umfassendes Wireframing der optimalen Website-Struktur für die Plattform, wobei die Recherchen und Empfehlungen unserer SEO- und CRO-Teams berücksichtigt wurden.

Visual Light 53 scaled

Ein Bild sagt mehr als tausend Worte

Die neu gestaltete Ascot-Website macht sich das bezaubernde Erlebnis, das ein Besuch der Rennbahn mit sich bringt, zunutze, indem sie die Mode, das Flair und die Aufregung mit einer fesselnden, einprägsamen und höchst ansprechenden Benutzererfahrung verbindet. Die Bilder auf der Website sind im redaktionellen Stil gehalten und zeigen Menschen, die die verschiedenen Bereiche des Veranstaltungsortes genießen, z. B. beim Trinken von Champagner, beim Anfeuern der Rennen, beim Essen in Gruppen, bei Verabredungen oder beim Lachen in den Kinderecken. Dadurch wird das Angebot von Ascot an die Oberfläche gebracht und die breite Anziehungskraft und Offenheit des Veranstaltungsortes visuell demonstriert, was wiederum zu kommerziellen Ergebnissen geführt hat.

Auf der gesamten Website wurde ein Hauch von Klasse vermittelt, indem die Opulenz des Gastfreundschaftsangebots von Ascot durch intelligentes Design hervorgehoben wurde. DEPT® übernahm die Markenrichtlinien von Ascot in einer modernen, frischen Art und Weise, die neue Besucher:innen anzieht, aber dennoch erkennbar ist, um sicherzustellen, dass die Website bei ihren treuen, langjährigen Gästen beliebt bleibt. Die Schriftart, die Farben, das Layout und die Inhaltsstruktur der Website sind eine Anspielung auf die königliche Familie, mit Blautönen, subtilen Animationen, sauberem Weissraum, bildgestützten Inhalten, klaren Call-to-Actions und einer reibungslosen User Journey.

Visual Light 96 1 scaled

Den Glamour des Renntags einfangen

Visual Light 69 3 scaled

Informationen auf Knopfdruck

Daten, Insights und die Ziele von Ascot, seine Veranstaltungsorte zu erweitern und seine Kundenbasis zu vergrössern, inspirierten die Inhaltshierarchie und die Benutzerführung auf der neuen Website  ascot.co.uk. Die Ergebnisse unserer Untersuchung zeigten, dass es für Menschen, die eine Veranstaltung in Ascot besuchen wollen, viele Unsicherheiten gab, die sie letztendlich von einer Buchung abhielten. Die Nutzer:innen machten sich zum Beispiel Sorgen über die Parkmöglichkeiten, die Kleiderordnung und den Einfluss des Wetters auf den Tag. Es wurden hilfreiche Leitfäden erstellt und in das Design der Homepage integriert, um diese Informationen klar zu vermitteln. Ebenso wurde die Funktion “Plan Your Day” neu definiert, um wichtige Details in den Vordergrund zu rücken, die zuvor auf der Plattform verborgen waren. Sie sollen die Nutzer:innen mit relevanten Informationen versorgen und Upselling-Möglichkeiten durch maßgeschneiderte Pakete schaffen.

Visual Light 53 3 scaled

Ein elegantes mobiles Erlebnis

Visual Light 54 scaled

Ansprechendes mobiles Erlebnis

Da die digitale Welt immer stärker auf mobile Endgeräte ausgerichtet ist, war es wichtig, eine Website zu erstellen, die die Marke Ascot auf visuell beeindruckende Weise präsentiert. Aufgrund der schieren Größe und der Menge an Bildern optimierte unser Team den Code und die Dateien umfassend für Geschwindigkeit und Leistung, um sicherzustellen, dass die Website vollständig responsive ist und auf allen Geräten hervorragend funktioniert.

Im Rahmen eines robusten Mobile-First-Ansatzes arbeiteten die UX- und CRO-Teams eng mit Ascot zusammen, um die Online-Informationen von Tausenden auf Hunderte von Seiten zu reduzieren und die Sitemap so zu strukturieren, dass sie auf die verschiedenen Zielgruppen zugeschnitten ist. Im Zuge der Neuausrichtung der Website auf das Erlebnis des Rennbesuchs wurden branchenspezifische Inhalte auf ein Minimum reduziert. Wichtige Inhaltsseiten wie der Royal Ascot Style Guide, Informationen zu den vier Anlagen und die Sektionen “Plan Your Day” wurden vollständig umstrukturiert und für die mobile Anzeige optimiert, um sicherzustellen, dass die Kund:innen die Inhalte unabhängig von ihrem Standort entdecken und geniessen können.

Beim Design hat DEPT® Ascot von einem kopflastigen “Mega-Nav” zu einem mobilfreundlichen “Hamburger”-Menü mit einer erweiterbaren sekundären Navigation am unteren Rand für die Suche nach Renntagen geführt. Die Website-Module wurden für mobile Nutzer:innen konzipiert und enthalten deutlichere Handlungsaufforderungen. Ausführliche Benutzertests wurden mit Fokusgruppen durchgeführt, wobei die mobile und die Desktop-Nutzung vor der Einführung gleich gewichtet wurden.

41%

Anstieg der Conversion Rate

21%

Anstieg des Online-Umsatzes

54%

Anstieg der Mobile Transactions

Ergebnisse

Der Relaunch war ein großer Erfolg und bot Ascot eine solide Grundlage für den Ausbau der digitalen Präsenz. Die neue Website wurde während einer wichtigen Verkaufsperiode für Royal Ascot veröffentlicht und verzeichnete außergewöhnliche Ergebnisse, die die Ziele, die Ascot ursprünglich für DEPT® gesetzt hatte, weit übertrafen.

Infolge der digitalen Neupositionierung von Ascot durch den Start der neuen Website stiegen der Kartenverkauf und die Einnahmen, was ein Hauptziel des Unternehmens war. Diese Statistiken wurden in den ersten sechs Wochen nach dem Start der Website erstellt:

  • 21,32% Anstieg der über die Plattform erzielten Einnahmen im Vergleich zum Vorjahr
  • 41%-ige Steigerung der E-Commerce-Konversionsrate im Vergleich zum Vorjahr
  • 22%-ige Steigerung der Transaktionen im Vergleich zum Vorjahr
  • 22%-ige Steigerung der gekauften Artikel im Vergleich zum Vorjahr
  • Steigerung des organischen Traffics um 2,11% im Vergleich zum Vorjahr, obwohl die Zahl der Live-Seiten auf der Plattform um mehr als 90% gesunken ist.
  • Anstieg der durchschnittlichen Sitzungsdauer um 26,38% im Vergleich zum Vorjahr

Die Verbesserungen, die an Ascots mobilem Erlebnis vorgenommen wurden, haben maßgeblich zur Steigerung der Konversionen beigetragen:

  • 54% Anstieg der Transaktionen über das Mobiltelefon
  • 41%-ige Steigerung des durch mobile Transaktionen erzielten Umsatzes
  • 50%-ige Steigerung der E-Commerce-Konversionsrate auf dem Handy
  • Durchschnittliche Sitzungsdauer auf dem Mobiltelefon um 26% im Vergleich zum Vorjahr erhöht
  • Verbessertes Nutzererlebnis mit einer Reduzierung der durchschnittlich aufgerufenen Seiten auf dem Weg zum Kauf um 20% im Vergleich zum Vorjahr
  • 10% mehr Besucher:innen auf der Seite mit den Spielterminen am Renntag
  • +1,5 Millionen Aufrufe der “What to Wear”-Seiten
  • Der Bereich ‘Plan Your Day’ verzeichnete einen Anstieg der Seitenaufrufe um 147%

Ascot und DEPT® haben eine langjährige Partnerschaft und arbeiten gemeinsam an verschiedenen Projekten in den Bereichen Design, UX, Web- und Mobile-App-Entwicklung bis hin zu digitalen Marketingkampagnen. Unsere Teams schätzen die Möglichkeit, mit den Teams einer der traditionsreichsten Marken Großbritanniens zusammenzuarbeiten, um die Art und Weise zu verbessern, wie die digitalen Kanäle aktiviert werden.

Fragen?

Executive Creative Director

Jake Welsh

Takeaway.com

Ein Blick in die Zukunft des Essens

iStock 518459098 1 scaled 6

Haben Sie sich schon einmal schwer getan, online Speisekarten lokaler Restaurants zu finden? Just Eat Takeaway macht diesen Prozess einfacher, indem es die Speisekarten aller Ihrer Lieblingsrestaurants auf einer Website zusammenfasst. Es ist also nicht nur eine Lösung für Kund:innen, sondern auch ein Tor für Restaurants, um mehr Menschen zu erreichen.

takeaway2 scaled

Nutzung von Daten zur Unterstützung lokaler Restaurants

Der globale Online-Marktplatz für Essenslieferungen begann als kleine niederländische Marke und hat sich zu einer globalen Plattform entwickelt, die in elf Ländern tätig ist und jährlich über vierzehn Millionen Kund:innen beliefert. Um sicherzustellen, dass es ein führender Global Player bleibt, beschloss das Unternehmen, seine digitale Transformation zu beschleunigen. Das Ergebnis? Ein neuer, innovativer B2B-Marktplatz, der auf die Bedürfnisse von Gastronom:innen eingeht, indem er die Fülle an Daten nutzt, über die das Unternehmen verfügt.

takeaway3 1 scaled

Aufwertung des bestehenden Designs

Das Essensliefer-Unternehmen bietet nicht nur die Möglichkeit, Essen online zu bestellen, sondern verfügt auch über einen B2B-Marktplatz, auf dem Restaurantbesitzer:innen sowohl Lebensmittel als auch Non-Food-Artikel von Drittanbieter:innen kaufen können. Just Eat Takeaway wollte die Fülle an Kundendaten nutzen, um seinen Marktplatz stärker datengesteuert zu gestalten. Um dies zu ermöglichen, musste unser Team das Design des aktuellen Marktplatzes verbessern und gleichzeitig die bestehende Plattform der Marke von Magento auf Commercetools und Prismic migrieren. Dank der API-Fähigkeiten von Commercetools konnte das Unternehmen dann regionale Einblicke in die Verbrauchernachfrage liefern, die es den lokalen Restaurants ermöglichen, ihre Speisekarten besser anzupassen. Zusätzlich zu lokalem Angebot, Nachfrage und Empfehlungen für alle Artikel.

Zu diesem Zweck führten wir zunächst einen kurzen, aber intensiven Design-Sprint durch, in dem wir die Customer Journey und die aktuellen Probleme der Restaurantbesitzer:innen analysierten. Daraufhin erstellten wir erste Skizzen, wie der Marktplatz aussehen könnte, und verfeinerten diese auf der Grundlage des aktuellen Systems des Unternehmens, seiner Wünsche und auch der Fähigkeiten von Commercetools. Auf diese Weise konnten wir neue Funktionen implementieren, die sich auf die Schaffung von mehr Kundenkomfort als je zuvor konzentrierten. Unser Team nahm auch eine Reihe funktionaler Optimierungen vor, wie z.B. eine verbesserte Navigationsstruktur und die Möglichkeit, Artikel, die man häufig kauft, schnell nachzubestellen, anstatt den gesamten Katalog durchforsten zu müssen.

takeaway4 scaled

Auf die Bedürfnisse der Verkäufer:innen eingehen

Eine der größten Herausforderungen bei der Einführung des neuen B2B-Marktplatzes war seine Komplexität, da die Verkäufer:innen Zugang zu ihrem Portal haben, über das sie ihre Produkte anbieten können. Daher haben wir das neue Setup mit einem einfacheren Navigationsprozess entworfen, der es allen Verkäufer:innen ermöglicht, jede Bestellzeile pro Restaurant leicht zu visualisieren. Durch die Implementierung von Commercetools wurde Adyen MarketPay integriert, das es den Gastronom:innen ermöglicht, eine einzige Zahlung zu leisten, die dann auf die Konten der einzelnen Verkäufer:innen aufgeteilt wird. Der Integrationsprozess war einfach, da das Unternehmen über ein Headless-Setup verfügte, das die Anbindung externer Kanäle an die bestehende Handelsumgebung erleichterte.

Die nächsten Schritte? Die Einführung des neuen Webshops in anderen Ländern, wobei die Bedürfnisse jeder Region berücksichtigt werden. Gleichzeitig wird die bestehende Plattform auf der Grundlage des Feedbacks von Gastronom:innen und Just Eat Takeaway weiter optimiert. Diese digitalen Innovationen tragen dazu bei, das Unternehmen zukunftssicher zu machen, indem sie seine Position als führendes globales Essens-Liefersystem erneuern.

Fragen?

UX Design & Research Lead

Franklin Schamhart

Otravo

Mit Automatisierung die Gewinnspanne und Loyalität steigern

Holiday2 scaled

Der führende europäische Online-Reiseveranstalter Otravo will den Buchungsprozess für Urlaubsreisen vereinfachen, indem er seinen Nutzer:innen wettbewerbsfähige Angebote aus verschiedenen Quellen zur Verfügung stellt. So können Kund:innen in mehr als 50 Ländern bei der Buchung von Flügen und Urlaubspaketen Geld sparen.

Otravo beauftragte DEPT® mit der Überarbeitung seiner Marketing-Automatisierungsstrategie, um persönlichere und profitablere Inhalte zu liefern, Skaleneffekte über seine Buchungsseiten hinweg zu erzielen und das Wachstum zu maximieren. Das Projekt wurde in Verbindung mit der Weiterbildung des internen digitalen Marketingteams durchgeführt, um eine kontinuierliche erfolgreiche Leistung zu gewährleisten.

Der Anspruch

Otravo hat sich zum Ziel gesetzt, über sein Netzwerk von “Local Heros” (z. B. Vliegtickets.nl, WTC.nl, Vliegtickets.be, Fylgstolen.se und Greitai.lt) und Meta-Booking-Sites (z. B. Travelgenio, Tripmonster, Travel2be und Schipholtickets) die bevorzugte Plattform für Reisende zu werden.

Eine der wichtigsten Möglichkeiten, mit denen sich DEPT® befasste, war die Steigerung des Umsatzanteils durch eigenen Traffic, indem die Relevanz von Kundeninhalten mithilfe von Marketing-Automatisierung erhöht wurde, wodurch Otravo weniger abhängig von bezahlten Kanälen wurde. So sind wir das angegangen…

iStock 1165603368 1 scaled

Die Lücke schließen

DEPT® half Otravo dabei, auf persönliche, aber skalierbare Weise besser mit potenziellen Kund:innen in Kontakt zu treten, um Konversion, Gewinnspanne und Markentreue über eigene Kanäle zu steigern. Otravo schöpfte die Möglichkeiten seiner Salesforce Marketing Cloud-Plattform nicht aus, und hier kam DEPT® ins Spiel, um die Lücke zu schließen.

Nach einem vollständigen Audit der Marketingautomatisierung und der E-Mail-Kampagneneinrichtung von Vliegtickets.nl (eine der “Local Hero” Reisebuchungsseiten von Otravos und die größte solche in den Benelux-Ländern) entdeckten wir ein erhebliches Wachstumspotenzial:

Die Basics verbessern

Nach der Migration bestehender, statischer E-Mail-Setups zum Journey Builder erleichterten wir es dem digitalen Marketingteam von Otravo, eigenständig Engagement Journeys zu erstellen. Mithilfe benutzerdefinierter Integrationen haben wir Daten von der Vliegtickets.nl-Plattform und dem CRM in die Salesforce Marketing Cloud übertragen. Wir verwendeten SQL, um die richtige Zielgruppe zu definieren, und AMPscript, um E-Mail-Journeys zu personalisieren und so die Gewinnspannen und Transaktionen zu verbessern.

Erkenntnisse gewinnen

Durch die Kombination von Salesforce Marketing Cloud-Daten (Öffnungsraten, Wiederfindungsraten) mit Google Analytics-Statistiken (Sitzungen, Transaktionen) konnten wir die potenziellen Auswirkungen von Vliegtickets.nl anhand eines Echtzeit-Dashboards aufzeigen, das Erkenntnisse in Aktionen umsetzt. Auf diese Weise konnten wir die sehr unterschiedliche Herangehensweise an die Buchung von Flügen, Hotels und Autos zwischen zwei verschiedenen Zielgruppen – Geschäfts- und Freizeitreisenden – unterscheiden, die unsere Strategie bestimmen sollten.

Ein Kompetenzzentrum errichten

Zusammen mit dem Otravo-Team definierten wir die notwendigen Rollen und Verantwortlichkeiten, um das zukünftige Wachstum voranzutreiben. Die Einbindung der Teammitglieder in unsere strategische Ausrichtung ermöglichte es uns, “on the job”-Schulungen zur Einrichtung, Überwachung und Verbesserung von personalisierten E-Mail-Journeys anzubieten, um Ergebnisse zu erzielen.

DEPT® schulte das interne Marketingteam in weniger als einem Monat.

Verbesserung des Kundenerlebnisses durch relevante Inhalte

Bei der Entwicklung der Cross-Selling-Lösung wurden auch Erkenntnisse und Präferenzen der Kund:innen berücksichtigt. Wir analysierten die Vorlaufzeiten von Flug-, Mietwagen- und Hotelbuchungen sowie die Gruppenzusammensetzung (Einzelreisende, zwei oder mehr Personen), um starke Unterschiede festzustellen. Nachdem wir herausgefunden hatten, dass die meisten Einzelbuchungen von Geschäftsreisenden getätigt werden und dass für Gruppen von zwei oder mehr Personen am häufigsten Freizeitaktivitäten gebucht werden, haben wir eine Strategie entwickelt, um Geschäfts- und Freizeitreisenden unterschiedliche Inhalte zukommen zu lassen, die ihren Bedürfnissen am besten entsprechen und so das Kundenerlebnis und die Konversion verbessern.

Die Beschleunigung des Wachstums priorisieren

DEPT® analysierte die Customer Journey, um zwei komplementäre Lösungen zu identifizieren, die das Wachstum fördern würden: eine Lösung für abgebrochene Warenkörbe, um potenzielle Kund:innen wieder in den Kaufprozess einzubinden, und eine Cross-Selling-Möglichkeit, um den Umsatz zu steigern, nachdem die Kund:innen Flüge gekauft hatten.

Die Lösung für abgebrochene Warenkörbe wurde unter dem Aspekt der Kundenbindung entwickelt. Nach der Analyse historischer Daten für bestimmte Kundensegmente erstellte DEPT® Nachrichtenflüsse, die die richtige Nachricht zur richtigen Zeit für verschiedene Zielgruppen lieferten. Wir nutzten auch personalisierte Inhalte, wie z. B. die Fluginformationen der Nutzer:innen, um die Kund:innen auf der Grundlage ihrer individuellen Vorlieben und ihres Verhaltens auf eine personalisierte Checkout-Seite zu leiten.

iStock 1158220335 1 scaled

Resultate

Nach der Vereinfachung und Personalisierung des Buchungsprozesses erzielte die Strategie von DEPT® in den ersten vier Monaten 50% mehr Gewinnspanne als ursprünglich geschätzt. Die Lösung lässt sich problemlos auf alle anderen “Local Hero”- und Meta-Seiten ausweiten, um den ROI für Otravo weiter zu maximieren.

DEPT® hat für Otravo die Grundlagen geschaffen, um das Beste aus der Salesforce Marketing Cloud herauszuholen. Sobald sich der Markt von COVID-19 erholt, wird Otravo in einer starken Position sein, um abgebrochene Einkaufswagen zu reaktivieren und gleichzeitig Cross-Sales von Hotels und Autovermietungen auf eine Art und Weise voranzutreiben, die für die Benutzer:innen persönlich ist.

Fragen?

Head of Strategy

Peter van Alphen

Celebrity Cruises

Gezielte E-Mail-Automatisierung

cruise 1 scaled

Celebrity Cruises wird regelmäßig zu einer der besten Kreuzfahrtlinien der Welt gewählt und bietet seit 1988 hochwertige Luxuskreuzfahrten an. Als führendes Unternehmen in diesem Bereich wollte Celebrity Cruises die E-Mail-Marketing-Automatisierung stärker nutzen, um eine schnelle Reaktion auf bestimmte Benutzeraktionen zu gewährleisten und den Kund:innen schnell die gewünschten Informationen zu liefern. Gemeinsam mit DEPT® wurde dies Wirklichkeit.

Trigger, alert, report

Ziel dieses Projekts war es, mit ExactTarget ein schnell reagierendes Trigger-E-Mail-System zu schaffen, so dass die Nutzer:innen automatisierte E-Mails mit nützlichen Informationen erhalten, wenn sie bestimmte Tridion- oder ShortStack-Formulare auf der Website ausfüllen. In diesem Zusammenhang mussten wir zwei neue CRM-Anfragetypen für Schiffsbesuche (SHIPVIS) und Wettbewerbe (COMPET) erstellen, aber vor allem einen Endpunkt für die Integration von Drittanbietern (wie ShortStack/WordPress-Formulare) zum Aufrufen der CRM/ExactTarget-Implementierung bereitstellen.

Das Team von DEPT® Digital Operations Services wollte ein verbessertes Fehler-Reporting einbauen und es ermöglichen, dass sie gewarnt werden, wenn bestimmte Parameter nicht erfüllt werden, z. B. wenn drei CRM-Anfragetypen innerhalb einer Stunde fehlschlagen. Darüber hinaus haben wir ein Kibana-Dashboard erstellt, in dem der/die Kund:in Berichte über erfolgreiche und fehlgeschlagene Übermittlungen in sein CRM, die Datenbank und für seine E-Mails leicht einsehen kann.

cruise 2 scaled

Ein schnell reagierendes, Trigger-E-Mail-System, um nützliche Informationen zu erhalten

In Zusammenarbeit mit dem internen IT- und Infrastrukturteam von Celebrity entwickelten wir eine effektive Lösung, die eine Überarbeitung des aktuellen Formularübermittlungsprozesses erforderte. Um eine generische Möglichkeit für die Einreichung einer Reihe verschiedener Einreichungstypen zu schaffen, entschied sich das Team für ein polymorphes Designmuster, um die relevanten Felder und Vorlagen für die Einreichung auszuwählen.

Wir führten eine neue Controller-Aktion ein, um die Integration von Drittanbieter:innen mit ShortStack-Formularen zu ermöglichen, wobei ein Unterscheidungsmerkmal zur Beschreibung des Übermittlungstyps verwendet wird. Dadurch konnten Anfragen, die sowohl die bestehende CRM-Integration als auch eine neue ExactTarget-Integration nutzten, die Daten speichern, an den CRM-Dienst übermitteln und E-Mails in ExactTarget auslösen. Mit Log4Net.ElasticSearch konnten wir das Ergebnis jeder der oben genannten Anfragen in ElasticSearch indizieren und diese Daten verwenden, um statistische Dashboards in Kibana zu erstellen und mit ElastAlert Warnungen auszulösen, wenn irgendwelche Fehler auftraten.

Für die erfolgreiche Umsetzung des Projekts lieferte DEPT® den internen Teams von Celebrity Cruises zusätzliche Unterstützung, damit ihre Siebel-Implementierung korrekt auf die Formulare abgebildet werden konnte. Wir führten auch den ELK-Stack und ElastAlert als neue Technologie in die Infrastruktur von Celebrity Cruises ein, was zukünftige Möglichkeiten für das Hinzufügen weiterer Metriken zur Verbesserung der Analytik bietet.

iStock 487627112 1 scaled

Resultate

Die FTP-Anwendung zum Hochladen von Broschüren von Celebrity Cruises wurde in den Überwachungsdienst aufgenommen, um Probleme beim Hochladen von Broschürenanfragen zu verfolgen. Dies war ein Bereich, der sich ernsthaft auf die Kundenerfahrung auswirkte. Die Chance, die Überwachung einfach in das System aufzunehmen, war eine grossartige Möglichkeit, auf der von uns geleisteten Arbeit aufzubauen und das Problem zu entschärfen.

Die auf dem Dashboard bereitgestellten Analysen sind unkompliziert, und die Art der Anfragen, die eingehen, regelt Trends auf schnelle und visuelle Weise. Nicht-technische Nutzer:innen können Probleme erkennen, und das Marketingteam kann die Menge ermitteln.

Fragen?

Managing Director UK

Brian Robinson

MySwitzerland

My Switzerland: huge Hub, hot Highlights

image 1

Das neue Webportal von Schweiz Tourismus setzt neue Standards. Hinter der spektakulären Präsentation einzigartiger Destinationen und der intuitiven User Journey auf der umfassendsten Informationsplattform des Ferienlandes Schweiz stecken konzeptionelle und technologische Innovationen.

Visual Dark 4 1 scaled

Informationsdichte

MySwitzerland.com präsentiert über 45.000 Reiseziele, Routen, Veranstaltungen, Sehenswürdigkeiten, Erlebnisse und Unterkünfte in 16 Sprachen. Alle detailliert abgebildet, auf einer Karte verortet und für Buchungen direkt verbunden mit sämtlichen relevanten Partner-Plattformen.

Gehen Sie mit uns auf eine digitale Reise durch die atemberaubende Schweiz. Ganz einfach, von Zuhause aus.

Durchdachte Informationsarchitektur

Das Herzstück eines soliden Webportals ist außerdem eine gut durchdachte Informationsarchitektur. Bei der Konzeption des Navigationskonzeptes wurde durch Baumtests mit Nutzer:innen eine nachvollziehbare und intuitive Navigationsstruktur entwickelt.

Die Tests wurden mit reinen Textversionen der Navigationsstruktur durchgeführt. Wir verglichen verschiedene Designansätze eines Navigationskonzepts und verifizierten sie in zusätzlichen Nutzertests. Außerdem gab es eine visuelle Prüfung der verschiedenen Navigationskonzepte. Für Workshops und Benutzertests wurden mehrere animierte visuelle Konzepte und Ansätze einschließlich der Navigation vorbereitet. Einige von ihnen waren rudimentäre html-Prototypen oder animierte Mockups von Principle, Flinto und Co.

Visual Dark 9 scaled

Ein digitales Designsystem für eine der größten Tourismus-Website

Das Ziel der neuen Website von Schweiz Tourismus war es, eine atemberaubende und vielfältige Bilderwelt mit inspirierenden Geschichten, Reiserouten, Ferienorten, Veranstaltungen und Themen zu bieten. Die Schweiz sollte nicht nur in der realen Welt, sondern auch online für jede:n und zu jeder Zeit einen Besuch wert sein. Für unser visuelles Konzept legten wir daher Leitprinzipien fest, die uns während der Ideenfindungsphase begleitet haben. 

  • Weniger Komplexität: Die Beschränkung des Inhalts auf eine Spalte vereinfacht das “Scannen” und den Lesefluss. Klare und reduzierte Top-Level-Navigation sowie eine konsequente Reduktion des Fließtextes mit längeren Texten auf Detailseiten waren hier im Fokus.
  • Maximale Inspiration: Die Benutzer:innen können durch vielschichtige Inhalte stöbern und sich so inspirieren lassen. Der Inspirationskalender bietet dafür Zugang zu einem breiten Themenspektrum. “Destination Pages” und Storytelling Pages werten das digitale Erleben verschiedener Themen und Regionen auf.
  • Garantierte Modularität: Ein ausgeklügeltes Rastersystem, atomares Design, die variable Platzierung von Inhaltsmodulen auf jeder Vorlage sowie eine ähnliche Struktur der verschiedenen Module und adaptives Rendering für jede Bildschirmgröße sorgen für perfekte Adaptivität.

Visual Dark 6 scaled

Inspirationskalender

Insgesamt 48 Drohnenvideos addieren sich zum plakativ auf der Startseite erscheinenden Inspirationskalender, der die Vielfalt der Schweiz als Tourismusdestination entlang des Jahreszyklus präsentiert. Alle wichtigen Infos bis hin zu den letztlich relevanten Buchungslinks sind immer nur einen Klick entfernt.

Grundlegende Designelemente und die richtige Typografie

Als Grundlage für unser Layout haben wir ein auf dem Markenlogo basierendes Raster definiert, um dem Web-Layout ein eigenständiges Aussehen zu geben und uns bei der Erstellung weiterer Seitenlayouts zu unterstützen. Durch das Hinzufügen einer Farb-, Font- und Symbolbibliothek mit verschiedenen Stilen und Grössen haben wir eine Grundlage geschaffen, auf der alle Komponenten aufbauen konnten. Die grundlegenden Elemente dienten so als Regeln für die Erstellung von Layouts. Änderungen, die während des Designprozesses an diesen vorgenommen wurden, wurden so immer mit der entsprechenden Stil- und Komponentenbibliothek synchronisiert. Endgültige Änderungen, insbesondere im Bereich der Typografie, wurden später während der Frontend-Implementierung aktualisiert.

Die Schriftart, die für dieses Projekt gewählt wurde, basiert auf einer wahren Ikone der Schweizer Typografie: Helvetica. Da das Webportal in 14 verschiedenen Sprachen angeboten wird, mussten allerdings auch Schriften für Kyrillisch, Arabisch, Japanisch, Chinesisch usw. implementiert werden.

User Experience

In jeder Phase des dreijährigen Relaunch-Prozesses waren prototypische Testpersonen ins Projekt involviert. Ihre Feedbacks und Inputs halfen mit bei der Entwicklung einer Usability, die das einfache, intuitive und schnelle Auffinden gesuchter und interessierender Contents ermöglicht: Der/die Besucherin gelangt über Navigation, Filter oder über die intelligente Suche wie selbstverständlich dorthin, wo die Schweiz für ihn attraktiv ist.

Künstliche Intelligenz

Die hoch optimierte Performance der Website basiert nicht zuletzt auf künstlicher Intelligenz: Die Integration eines Machine Learning Services ermöglicht es, die über 80.000 im System hinterlegten Bilder automatische in den richtigen Formaten für alle Ausgabegeräte und Verbindungsgeschwindigkeiten aufzubereiten. Und zwar so, dass stets das für die visuelle Aussage relevante Bildelement erkannt und dargestellt wird.

myswiss 3

Ein Virtual-Reality-Erlebnis der Extraklasse

MySwitzerland.com beeindruckt mit bildgewaltigen Drohnenvideos. Jede Sequenz zeigt eine außergewöhnliche Ansicht der Schweiz. Und noch mehr: Die in die Welt der Virtual Reality transformierten Filme erweitern die visuellen Entdeckungsreisen mit 3D-Effekten, Rundumsicht und weiterführenden Informationen, wenn der/die User:in mit einer VR-Brille auf MySwitzerland.com schaut.

Flache Videos in den VR-Modus umwandeln

VR-Geräte ermöglichen eine 360-Grad Rundumsicht. In unserem Fall wurde das Drohnenmaterial allerdings nicht in 360 Grad, sondern flach aufgenommen. Um einen VR-Modus für diese Clips zu ermöglichen, mussten wir uns eine Lösung einfallen lassen. Also haben wir benutzerdefinierte 3D-Geometrien erstellt, um das Video darauf abzubilden. Diese Geometrien müssen mehrere Kriterien erfüllen. Das Hauptkriterium: Verzerrungen so weit wie möglich vermeiden – gleichzeitig wollen wir den Benutzer:innen ein immersives Gefühl vermitteln, indem wir ihnen erlauben, sich umzusehen und Landschaften zu erkunden. Wir implementierten dafür eine grundlegende Kugelformgeometrie. Darauf aufbauend passten wir diese manuell so lange an, bis wir ein Raster gefunden hatten, das unseren Bedürfnissen entsprach und ein Seitenverhältnis von 16:9 erlaubt.

In Verbindung mit einer geeigneten Geometrie, spielte außerdem die Position der Kamera eine entscheidende Rolle. Abhängig von dieser und der Entfernung eines Objekts im Video passten wir die Menge der überlagernden Informationen an. Um echte Sweet Spots zu erhalten haben wir während des gesamten Prozesses ständig Tests mit VR-Headsets durchgeführt. 

Ohne Ecken und Kanten: Die ästhetische Herausforderung

Nachdem wir nun den Videos einen besseren Look verpasst hatten, standen wir vor der nächsten ästhetischen Herausforderung. Das Video sah aus wie gerahmt, wenn man den Blick auf den Rand des Videos richtete, erzeugte der Übergang vom Video zum Hintergrund einen harten Schnitt. Um dies zu vermeiden, haben wir eine subtile Alphamaske hinzugefügt, die so die Ecken der Videogeometrie ausblendet. Durch die Erstellung eines dynamischen Farbverlaufs, der auf dem Farbwert vom oberen und unteren Rand des Videos basiert, erreichten wir einen schönen, weichen Übergang vom Video zum Hintergrund.

Als wir also die erste Herausforderung – ein einfaches Video in ein VR-fähiges Video zu verwandeln – gemeistert hatten, ging es als nächstes darum, den Benutzern zu ermöglichen, durch 48 Clips zu navigieren. Dabei sollen die User zusätzlich Fakten und Zahlen über die Sehenswürdigkeiten erhalten. Dafür haben wir drei verschiedene Navigationsoptionen geschaffen. Einen “Skipper”, um vorwärts und rückwärts zu gehen, eine Karte, auf der man den gewünschten Ort auswählen kann und einen Kalender, durch den man blättern kann. Die entsprechenden UI-Elemente erscheinen im Vordergrund des Videos. Um Vorder- und Hintergrund deutlicher zu trennen haben wir außerdem Abstände eingefügt. Für die optimale Positionierung der UI-Elemente haben wir die gleiche Technik wie bei der Anpassung der Kameraposition verwendet.

Gespannt auf das Ergebnis? Lassen Sie sich jetzt inspirieren und gehen Sie auf  Entdeckungstour in der Schweiz – ganz einfach, von Zuhause aus.

Fragen?

Management

Yann Wanner

Mehr erfahren

Personalisieren Sie Ihre Experience

Wir verwenden funktionale Cookies, damit die Website richtig läuft, analytische Cookies, um Ihr Verhalten zu messen, und Marketing-Cookies für die Personalisierung von Anzeigen und Inhalten. Wir sammeln Daten darüber, wie Sie unsere Website nutzen, um die Nutzung unserer Website zu vereinfachen, sowie um die Kommunikation in der Werbung, auf unserer Website oder in den Apps anzupassen oder zu personalisieren. Die durch Marketing-Cookies gesammelten Daten werden auch an Dritte weitergegeben. Wenn Sie auf "OK" klicken, stimmen Sie dem zu. Möchten Sie weitere Informationen? Lesen Sie unsere Cookie-Richtlinie.