Eine erfolgreiche internationale Zusammenarbeit braucht mehr als eine gemeinsame Sprache. Sie braucht ein Verständnis dafür, wie Menschen in unterschiedlichen Märkten denken, kommunizieren und geschäftliche Entscheidungen treffen.
Als deutsch-chinesische Digitalagentur ist genau das Teil unserer Identität.
Unsere Gründerin Chao ist in China aufgewachsen und lebt seit 16 Jahren in Deutschland. Sie kennt beide Kulturen, ihre unterschiedlichen Perspektiven und die Besonderheiten der jeweiligen Geschäftswelt. Gemeinsam verbinden wir dieses interkulturelle Verständnis mit unserer Erfahrung in Markenentwicklung, digitaler Kommunikation und Webentwicklung.
“ Dadurch können wir deutsche Unternehmen bei ihrem Auftritt im chinesischen Markt begleiten und chinesische Unternehmen dabei unterstützen, ihre Angebote für deutsche Zielgruppen zugänglich zu machen.
Ein Beispiel dafür ist unsere Zusammenarbeit mit GoFindOrient.
Der chinesische Reisedienstleister bietet Reisen auf dem deutschen Markt an. Für den digitalen Vertrieb haben wir eine individuelle Buchungsplattform entwickelt, die weit über die Funktionen eines gewöhnlichen Onlineshops hinausgeht.
Zwischen Shanghai und Hamburg entstand eine technische Lösung, die unterschiedliche Anforderungen zusammenführt: die Verwaltung komplexer Reiseangebote, eine verständliche Benutzerführung für deutsche Kunden und die Integration bestehender Buchungsprozesse.
Das Projekt zeigt damit nicht nur, was moderne Webentwicklung leisten kann. Es zeigt auch, warum ein gemeinsames Verständnis beider Märkte bereits bei der Konzeption einer digitalen Plattform einen Unterschied macht.
Wenn Shanghai und Hamburg gemeinsam digital entwickeln Internationale Zusammenarbeit bedeutet mehr, als Informationen über Zeitzonen hinweg auszutauschen.
Ein digitales Produkt muss Anforderungen aus unterschiedlichen Perspektiven zusammenbringen. Dazu gehören Vorstellungen von Gestaltung, die Struktur bestehender Unternehmensprozesse und die Erwartungen der Menschen, die das Produkt später nutzen.
Bei GoFindOrient treffen die internationale Perspektive eines chinesischen Reiseunternehmens und die Anforderungen an eine Buchungsplattform für den deutschen Markt aufeinander.
Unsere Aufgabe bestand darin, daraus ein einheitliches digitales Angebot zu entwickeln.
Im Mittelpunkt stand die Frage, wie sich umfangreiche Reiseprogramme, verschiedene Termine und unterschiedliche Buchungsmöglichkeiten so darstellen lassen, dass Interessenten ihre Reise nachvollziehen und eigenständig auswählen können.
Dafür braucht es eine gemeinsame Vorstellung davon, welche Informationen für Kunden relevant sind, wie diese redaktionell gepflegt werden und welche Prozesse nach einer Buchungsentscheidung im Hintergrund stattfinden müssen.
Die eigentliche Entwicklungsarbeit beginnt deshalb nicht erst mit dem Programmieren. Sie beginnt damit, geschäftliche Anforderungen in eine verständliche technische Struktur zu übersetzen.
Ein Reiseshop ist kein gewöhnlicher Onlineshop In einem klassischen Onlineshop wird ein Produkt ausgewählt, in den Warenkorb gelegt und bezahlt.
Bei einer Reise ist dieser Vorgang deutlich komplexer.
Ein Reiseangebot besteht aus verschiedenen miteinander verbundenen Informationen: Reisezielen, Tagesprogrammen, Hotels, Leistungen, Abfahrtsterminen und verfügbaren Plätzen.
Hinzu kommen individuelle Entscheidungen der Kunden.
Wie viele Personen reisen gemeinsam? Werden Doppelzimmer oder Einzelzimmer benötigt? Welche Termine sind verfügbar? Wie verändert sich der Gesamtpreis durch die gewählte Zimmeraufteilung?
Diese Fragen müssen bereits vor dem eigentlichen Checkout beantwortet werden.
Für GoFindOrient haben wir deshalb eine eigene Buchungsoberfläche entwickelt, die diese Informationen zusammenführt.
Besucher können Reisen entdecken, nach unterschiedlichen Kriterien sortieren und sich detailliert über den Reiseverlauf informieren. Die einzelnen Stationen lassen sich auf einer interaktiven Karte nachvollziehen.
Für die Buchung wählen sie anschließend einen verfügbaren Termin, die Personenzahl und eine passende Zimmerkombination.
Die Anwendung berechnet daraus den Gesamtpreis und bereitet die Übergabe an den Checkout vor.
Damit wird aus einer gewöhnlichen Reisebeschreibung ein interaktives, buchbares Angebot.
Eine individuelle Architektur statt eines überladenen Shopsystems Übersicht des Tech Stacks bei gofindorient.de Bei der technischen Konzeption haben wir uns bewusst dafür entschieden, die unterschiedlichen Aufgaben der Plattform auf mehrere spezialisierte Systeme zu verteilen.
Das öffentliche Frontend haben wir mit Nuxt 4, Vue 3 und TypeScript entwickelt. Für die Verwaltung der Reiseinhalte verwenden wir Directus mit PostgreSQL als Datenbank. Den kaufmännischen Teil des Bestellprozesses übernimmt WooCommerce.
Diese Architektur verbindet drei unterschiedliche Anforderungen.
Nuxt ermöglicht eine individuell gestaltete Website mit dynamischen Reiseinformationen, interaktiven Auswahlmöglichkeiten und serverseitig gerenderten Inhalten.
Directus bildet die zentrale Verwaltung für Reisen, Termine, Preise und weitere strukturierte Daten.
WooCommerce übernimmt Warenkorb, Checkout, Bestellungen und deren Zahlungsstatus.
Die Systeme arbeiten dabei nicht unabhängig voneinander. Wir haben eigene Schnittstellen entwickelt, über die relevante Daten kontrolliert übertragen und verarbeitet werden.
Der Vorteil dieser Trennung liegt darin, dass nicht ein einzelnes System sämtliche Aufgaben übernehmen muss.
Die öffentliche Website kann unabhängig von den gestalterischen Einschränkungen eines klassischen Shoptemplates entwickelt werden. Gleichzeitig werden bestehende Funktionen für die Bestellabwicklung genutzt, statt sie vollständig neu programmieren zu müssen.
Ein Headless CMS für komplexe Reiseprogramme Die redaktionelle Verwaltung ist ein wesentlicher Bestandteil der Plattform.
Reiseangebote verändern sich. Neue Termine werden veröffentlicht, Hotelinformationen aktualisiert und bestehende Programme ergänzt.
Damit diese Inhalte strukturiert gepflegt werden können, haben wir in Directus ein umfangreiches Datenmodell aufgebaut.
Die Redaktion kann Reisen mit unterschiedlichen Zielen, Städten, Tagesprogrammen, Hotels, Leistungen und Bildern verwalten.
Diese Informationen sind über Beziehungen miteinander verbunden.
Eine Stadt muss beispielsweise nicht für jede Reise vollständig neu angelegt werden. Stattdessen kann sie zentral gepflegt und in unterschiedlichen Routen verwendet werden.
Auch Reisetermine und Preisvarianten sind mit den jeweiligen Angeboten verknüpft.
Für die tägliche Arbeit haben wir Directus zusätzlich um eigene Funktionen erweitert.
Dazu gehören eine tabellarische Terminverwaltung, Hilfen zur Zuordnung von Städten und Hotels sowie Funktionen zur Normalisierung und Überprüfung von Inhalten.
Eine weitere Erweiterung ermöglicht den Import von Reiseterminen und Preisen aus einer externen Reise-API.
So übernimmt das Content Management System nicht nur die Verwaltung redaktioneller Texte, sondern bildet zugleich einen wichtigen Bestandteil der operativen Datenpflege.
Preisberechnung, die unterschiedliche Reisegruppen berücksichtigt Ein besonderer Teil der Entwicklung war die individuelle Preisberechnung.
Während bei gewöhnlichen Produkten häufig ein fester Einzelpreis ausreicht, hängt der Gesamtpreis einer Reise von verschiedenen Faktoren ab.
Für GoFindOrient haben wir deshalb eine eigene Berechnungslogik entwickelt, die unterschiedliche Kombinationen aus Doppelzimmern und Einzelzimmern berücksichtigt.
Bei vier Reisenden können beispielsweise zwei Doppelzimmer, ein Doppelzimmer mit zwei Einzelzimmern oder vier Einzelzimmer ausgewählt werden.
Die Anwendung ermittelt die unterstützten Zimmerkombinationen und berechnet die jeweiligen Gesamtkosten auf Grundlage der hinterlegten Preise und Einzelzimmerzuschläge.
Damit die Berechnung nachvollziehbar und präzise bleibt, werden Geldbeträge intern in Cent verarbeitet.
Besonders wichtig ist dabei, dass angezeigte Preise nicht ungeprüft in den Bestellprozess übernommen werden.
Vor dem Checkout ruft der Server die aktuellen Preisdaten erneut ab und berechnet die ausgewählte Kombination eigenständig.
Sollte sich ein Preis zwischenzeitlich verändert haben, muss die Auswahl erneut bestätigt werden.
So bleibt die eigentliche Preisermittlung unter serverseitiger Kontrolle.
Die Verbindung zwischen Nuxt und WooCommerce Eine der technisch anspruchsvollsten Aufgaben war die Übergabe einer individuell zusammengestellten Reise an WooCommerce.
Ein gewöhnliches Shopprodukt reicht dafür nicht aus. Die Bestellung muss zusätzlich Informationen wie Reisetermin, Teilnehmerzahl, Zimmeraufteilung und berechneten Gesamtpreis enthalten.
Dafür haben wir eine eigene Checkout Integration entwickelt.
Nachdem der Kunde seine Auswahl getroffen hat, erstellt der Nuxt Server ein zeitlich begrenztes, kryptografisch signiertes Angebot.
Dieses enthält die relevanten Buchungsinformationen und wird an WooCommerce übergeben.
Die Signatur ermöglicht es, nachträgliche Veränderungen an den übermittelten Daten zu erkennen.
Auf der WooCommerce Seite verarbeitet ein eigens entwickeltes Plugin die Reiseauswahl, überprüft das Angebot und übernimmt die Informationen in den Warenkorb.
Die ausgewählte Reise wird anschließend mit ihren individuellen Buchungsdaten in der Bestellung hinterlegt.
Damit verbinden wir die Freiheit eines vollständig individuell entwickelten Frontends mit den etablierten Bestellfunktionen von WooCommerce.
Verfügbarkeiten und Reservierungen zuverlässig verwalten Ein weiterer Unterschied zum klassischen Onlinehandel liegt in der begrenzten Verfügbarkeit von Reiseterminen.
Wenn mehrere Kunden gleichzeitig dieselbe Reise buchen möchten, darf die Plattform nicht mehr Plätze vergeben, als tatsächlich angeboten werden.
Dafür haben wir eine eigene Reservierungslogik entwickelt.
Sie berücksichtigt die hinterlegten Kapazitäten eines Reisetermins und unterscheidet zwischen verfügbaren, eingeschränkt verfügbaren und ausgebuchten Angeboten.
Während eines Buchungsvorgangs können Plätze vorübergehend reserviert werden.
Die technische Umsetzung verwendet PostgreSQL Transaktionen und Datenbanksperren, um konkurrierende Reservierungsversuche koordiniert zu verarbeiten.
Anschließend wird die Reservierung mit der entsprechenden WooCommerce Bestellung verknüpft.
Je nach Bestellstatus können die Plätze weiter reserviert, als bezahlt markiert oder wieder freigegeben werden.
Diese Logik bildet einen wesentlichen Bestandteil der Plattform, weil die Benutzeroberfläche nur dann zuverlässig funktionieren kann, wenn auch die zugrunde liegenden Buchungsdaten konsistent bleiben.
Interaktive Reisekarten statt reiner Ortslisten Neben der Buchungslogik spielte auch die Darstellung der Reiseangebote eine wichtige Rolle.
Eine Reise besteht nicht nur aus einem Ziel. Gerade bei Rundreisen ist die Abfolge der einzelnen Stationen ein wesentlicher Bestandteil des Angebots.
Deshalb haben wir eine interaktive Kartenansicht mit MapLibre GL JS integriert.
Die Anwendung übernimmt die geografischen Koordinaten der in Directus gepflegten Städte und stellt daraus den Reiseverlauf zusammen.
Die einzelnen Stationen werden nummeriert und miteinander verbunden. Der Kartenausschnitt passt sich automatisch an die jeweilige Reiseroute an.
Dadurch erhalten Besucher eine zusätzliche visuelle Orientierung und können den geografischen Verlauf einer Reise unmittelbar nachvollziehen.
Die Kartenfunktion ist gleichzeitig ein Beispiel dafür, wie strukturiert gepflegte Inhalte mehrfach genutzt werden können.
Dieselben Daten, die im CMS den Reiseverlauf beschreiben, bilden auch die Grundlage der interaktiven Darstellung im Frontend.
Suchmaschinenfreundliche Architektur für einen internationalen Reiseanbieter Für eine Reiseplattform ist die Auffindbarkeit einzelner Angebote besonders relevant.
Interessenten suchen häufig nicht nach einem bestimmten Anbieter, sondern nach Reisezielen, Reisearten oder konkreten Rundreisen.
Deshalb haben wir die Plattform auf einer Architektur aufgebaut, die eigenständige Reiseseiten mit individuellen URLs ermöglicht.
Nuxt übernimmt dabei das serverseitige Rendering.
Wichtige Seiteninhalte können dadurch bereits mit der ersten HTML Antwort bereitgestellt werden, statt ausschließlich nachträglich im Browser zu entstehen.
Auch individuelle Seitentitel und Meta Beschreibungen sind Teil der technischen Umsetzung.
Ein weiterer Schwerpunkt liegt auf der strukturierten Inhaltsverwaltung.
Reiseziele, Städte, Hotels, Termine und Leistungen werden nicht nur als unstrukturierte Texte abgelegt, sondern in einem relationalen Datenmodell organisiert.
Das ermöglicht es, Inhalte künftig für unterschiedliche Seiten und redaktionelle Formate wiederzuverwenden.
Die Architektur schafft damit eine Grundlage für den weiteren Ausbau der Suchmaschinenoptimierung und zusätzliche Inhalte rund um Destinationen und Reiseinformationen.
Eine gute technische Struktur ersetzt dabei keine redaktionelle SEO Strategie. Sie erleichtert jedoch die Entwicklung und Pflege entsprechender Inhalte.
Mehr als eine Buchungsbestätigung Mit der eigentlichen Bestellung ist ein digitaler Reisebuchungsprozess noch nicht abgeschlossen.
Kunden benötigen anschließend nachvollziehbare Informationen darüber, welche Reise sie gebucht haben und welche Leistungen Bestandteil ihrer Auswahl sind.
Dafür haben wir den WooCommerce Prozess um eine eigene Funktion zur Erstellung von Buchungsunterlagen erweitert.
Ein zusätzliches WordPress Plugin erzeugt PDF Reiseübersichten mit den relevanten Buchungsinformationen.
Dazu gehören unter anderem die gewählte Reise, der Termin, die Teilnehmerzahl, die Zimmeraufteilung und der Gesamtbetrag.
Die Dokumente werden über eine geschützte Downloadfunktion bereitgestellt, die unter anderem den Bestell- und Zahlungsstatus berücksichtigt.
Für die Bestellkommunikation ist außerdem Resend über SMTP integriert.
Die technische Umsetzung berücksichtigt damit nicht nur die Entscheidung für eine Reise, sondern auch die anschließende Bereitstellung wichtiger Buchungsinformationen.
Eine Plattform, die sich weiterentwickeln kann Für den Betrieb der Anwendung setzen wir auf eine containerbasierte Architektur mit Docker.
Nuxt, Directus und PostgreSQL werden als getrennte Dienste betrieben. Die Verbindung zwischen den Systemen erfolgt über definierte Schnittstellen und interne Netzwerke.
Der Produktionsbuild wird in einem eigenen Container erzeugt und anschließend mit den benötigten Laufzeitdateien betrieben.
Für die Veröffentlichung haben wir einen Deploymentprozess mit GitHub Actions und serverseitigen Skripten eingerichtet.
Auch die Qualitätssicherung ist Teil der Entwicklung. Eigene Tests prüfen unter anderem verschiedene Zimmerkombinationen und Preisberechnungen. Zusätzliche Prüfungen unterstützen die Konsistenz des Designsystems und der Checkout Integration.
Die Architektur ist auf Erweiterbarkeit ausgelegt.
Das Datenmodell enthält bereits Strukturen für zusätzliche Reiseinformationen, Destinationen und redaktionelle Inhalte, die über die derzeitigen Shopansichten hinausgehen.
Dadurch können weitere Funktionen auf den bestehenden Datenstrukturen aufbauen.
Zwischen Shanghai und Hamburg entsteht mehr als ein Onlineshop GoFindOrient steht beispielhaft für eine Stärke, die unsere Arbeit bei TWENTYFYVE besonders prägt: Wir verbinden technisches Know-how mit dem Verständnis zweier unterschiedlicher Geschäftswelten.
Unsere deutsch-chinesische Identität ermöglicht uns, Projekte nicht nur aus einer Perspektive zu betrachten. Wir verstehen die Anforderungen chinesischer Auftraggeber ebenso wie die Erwartungen deutscher Zielgruppen und können beide Seiten im Entwicklungsprozess zusammenbringen.
Für GoFindOrient entstand daraus eine individuelle Reiseplattform, die komplexe Angebotsdaten, dynamische Preisberechnungen und Buchungsprozesse in einer gemeinsamen Anwendung vereint.
Die technische Umsetzung mit Nuxt, Directus und WooCommerce ist dabei das sichtbare Ergebnis einer Zusammenarbeit, bei der Kommunikation, Marktverständnis und Entwicklung ineinandergreifen.
Denn internationale Digitalisierung bedeutet nicht einfach, eine Website in einem anderen Land zu veröffentlichen. Sie bedeutet, unterschiedliche Märkte zu verstehen und daraus digitale Lösungen zu entwickeln, die Menschen miteinander verbinden.
