Skip to content
← Alle Projekte
Projekt

The Cloud One

The Cloud One ist die Design-Marke der Motel One Group, mit Häusern in europäischen Städten und in New York. Die Plattform wurde von Grund auf neu gebaut — mit einem bildgeführten Auftritt und einem Design System, das ihn über alle Bereiche hinweg gleich hält.

2026HotelbuchungsplattformFrontend & DevOps
The Cloud One

Ein kompletter Neubau der Plattform. Ich habe am Design System mitgewirkt und Komponenten und Module im gesamten Frontend umgesetzt — dazu an der Infrastruktur, über die die Plattform ausgeliefert wird.

Die gemeinsame Grundlage
01Design System

Die gemeinsame Grundlage

Große Bilder, wenig drumherum: Die Startseite kommt mit einem Motiv und der Suche aus. Damit dieser Auftritt über alle Bereiche der Plattform hinweg trägt, liegt darunter ein Design System — daran habe ich mitgewirkt, an den Komponenten, Typografie-Stufen und Tokens, aus denen die Oberfläche gebaut ist.

Was The Cloud One ist
02Die Marke

Was The Cloud One ist

The Cloud One ist die Design-Marke der Motel One Group: Häuser in zentralen Lagen europäischer Städte und in New York. Die Zimmer sind kompakt geschnitten, das eigentliche Zentrum sind Lounge, Bar und oft eine Dachterrasse. Jedes Haus ist in ein bestehendes Gebäude und seine Umgebung hineingebaut — in Prag etwa mitten in die Altstadt. Ankommen, wohlfühlen, abschalten, so beschreibt die Marke sich selbst; die Plattform muss das transportieren, bevor überhaupt eine Buchung beginnt. Das Modul im Bild ist eine der Stellen, an denen das passiert: Es stellt die Häuser einzeln vor.

Düsseldorf-Kö Bogen
03Hoteldetailseite

Düsseldorf-Kö Bogen

Die Detailseite eines einzelnen Hauses, hier Düsseldorf-Kö Bogen. Unten läuft die Booker-Bar mit: Sie hält die aktuelle Suche — Termin, Personen, Preis — dauerhaft sichtbar und führt von jeder Stelle der Seite direkt in die Zimmerauswahl, ohne dass man zur Suche zurückspringen muss.

04Infrastruktur

Delivery und Betrieb

An der Infrastruktur habe ich mitgewirkt — an den automatisierten Deployments vom Commit bis in die Produktion und an der Observability, über die sich der Betrieb nachvollziehen lässt.

Ein Design System — über das ganze Frontend hinweg.

Highlights

Was wichtig war

Performance
Optimierte Ladezeiten und zuverlässige Auslieferung auf allen Geräten — Seiten, die sich vom ersten Klick an schnell anfühlen.
Design System
Komponenten, Typografie-Stufen und Tokens als gemeinsame Grundlage der gesamten Oberfläche.
UI/UX
Flüssige Übergänge und durchdachte Animationen, die dem Interface Charakter verleihen, ohne Reibung zu erzeugen.
Accessibility
Von Anfang an in die Umsetzung eingebaut — nicht nachträglich hinzugefügt.
Stack

Eingesetzte Technologien

Nuxt Vue TypeScript Tailwind CSS

Mehr Arbeiten