Webdesign Studio
Case Study Enterprise SaaS

LeoFlex – apaleo-natives Hotel-SaaS

Ein apaleo-natives SaaS für Hotels — von mir entwickelt und betrieben. Dashboard, API, Worker und KI: der Beweis, dass komplexe, sichere Produkte bei mir aus einer Hand entstehen.

.NET 10 Vue 3 · Vuetify 4 PostgreSQL 15 apaleo-nativ
LeoFlex-Dashboard: Kacheln für Zuweisungsverlauf, Statistik, offene Gästemeldungen und Meldestatus — von NEO Digital gestaltet und entwickelt
Die Aufgabe

Kein Prototyp — ein echtes System

Hotels auf dem PMS apaleo brauchen smarte Zusatzfunktionen — ohne ein zweites System zu lernen. Der Name sagt es: apaLeo trifft Flexibel. Der Anspruch dahinter ist aber größer als eine hübsche Oberfläche: LeoFlex ist eine ausgewachsene Business-Plattform — mit strikt getrennten Hoteldaten, EU-Hosting, KI im Kern und Sicherheit von Grund auf.

„Sauberer als sauber. Besser als gut. Sicherer als sicher."

Das Qualitätsmandat, an dem jede Zeile LeoFlex gemessen wird
Der Ansatz

Vier Bausteine, eine saubere Architektur

Dashboard, API, Worker und KI greifen nahtlos ineinander — getrennte Schichten, klare Verantwortungen, ein System statt zusammengesteckter Tools.

01

Dashboard

Die Bedienoberfläche im vertrauten apaleo-Look — übersichtlich, schnell und immer live auf dem neuesten Stand.

02

API

Das sichere Herz der Plattform — sauber aufgebaut, damit die Daten jedes Hotels strikt getrennt und langfristig wartbar bleiben.

03

Hintergrund

Aufwändige Aufgaben laufen im Hintergrund ab — so bleibt die Oberfläche jederzeit flüssig bedienbar.

04

KI-Baustein

Ein zentraler KI-Baustein für die ganze Plattform — der Anbieter dahinter lässt sich jederzeit austauschen.

Apaleo apaleo PMSReservierungen & Consent
LeoFlex API.NET 10 · Orchestrierung
DashboardVue 3 · Bedienoberfläche
DomainEntities & Enums
ApplicationWorkflows, Policies
ContractsHTTP-DTOs
Controllersdünne Endpunkte
InfrastructureEF Core, Worker, Provider

Jede Schicht kennt nur, was sie wirklich braucht. Eingehende Meldungen von apaleo werden zuerst sicher gespeichert und dann in Ruhe im Hintergrund verarbeitet — nichts geht verloren, auch bei Lastspitzen. Änderungen erscheinen trotzdem im selben Moment im Dashboard, ganz ohne ständiges Nachfragen.

Das System im Einsatz

Scrollen Sie durch die laufende Plattform

Bewusst im vertrauten apaleo-Look — wer apaleo kennt, ist sofort zu Hause.
LeoFlex-Dashboard: Kacheln für Zuweisungsverlauf, Statistik, offene Gästemeldungen und Meldestatus, jede mit eigenem Zeitraum-Filter Warteschlange der Hintergrundaufgaben in LeoFlex: eingehende Meldungen aus apaleo mit Zeitpunkt, Hotel, Modul, geprüfter Signatur und Status „Abgeschlossen“ Gästemeldungen in LeoFlex, Reiter „Reisegruppen“: eine aufgeklappte Reisegruppe mit Reiseleiter, fünf Mitgliedern, Meldeblatt-Nummer und dem Status „Meldung erfolgreich“ apaleo-Berechtigungen in LeoFlex: 23 erteilte Berechtigungen in fünf Gruppen, dazu ein roter Hinweis auf drei fehlende Berechtigungen mit der Schaltfläche „Apaleo neu autorisieren“
01 / 04

Ein System, eine Sprache

Jede Ansicht folgt derselben klaren Gestaltung. Kacheln aktualisieren sich live, und die Anordnung wird pro Nutzer und Hotel gespeichert — zentral, nicht nur im Browser.

  • Eine einheitliche Gestaltung über alle Ansichten
  • Live-Aktualisierung ohne Neuladen
  • Kachel-Anordnung pro Nutzer & Hotel gespeichert
02 / 04

Aufgaben im Hintergrund

Meldet apaleo eine neue Buchung, einen Check-in oder eine Stornierung, wird das nicht sofort verarbeitet, sondern in eine Warteschlange gelegt. Jede Aufgabe wird auf ihre Signatur geprüft, abgearbeitet und protokolliert — und automatisch wiederholt, wenn ein angebundenes System kurz nicht antwortet.

  • Jede Meldung wird auf ihre Signatur geprüft
  • Automatische Wiederholung — nichts geht stillschweigend verloren
  • Jeder Lauf bleibt nachvollziehbar, mit Zeitpunkt und Ergebnis
03 / 04

Daten mit Verantwortung

Der Meldezettel ist der Ort, an dem Gästedaten am sensibelsten sind — und der schwierigste Fall ist die Reisegruppe: ein Reiseleiter, viele Reservierungen, ein Meldeblatt. LeoFlex führt das zusammen, prüft nach den Behördenregeln und zeigt jederzeit, was noch offen ist.

  • Reisegruppen als Ganzes gemeldet — nicht Gast für Gast
  • Prüfung nach den Behördenregeln (AT/DE/CH)
  • Daten jedes Hotels strikt getrennt, nichts wird endgültig gelöscht
04 / 04

Nur so viel Zugriff wie nötig

LeoFlex greift auf apaleo nur mit den Rechten zu, die ein Modul wirklich braucht — einzeln aufgeführt, nicht als Blankoscheck. Fehlt eines, sagt das System es von sich aus, statt später still zu scheitern.

  • Jede Berechtigung einzeln erteilt und sichtbar
  • Fehlende Rechte werden gemeldet, bevor etwas schiefgeht
  • Zugangsschlüssel verschlüsselt, nie im Protokoll
Das Designsystem — live

Echte Komponenten, zum Anklicken.

Dieselben Bausteine wie im laufenden System — zum Anfassen und Ausprobieren, mit allen echten Reaktionen auf Maus und Klick.

app.leoflex.io — Designsystem Live
Logo & Bildmarke
LeoFlex Logo
Wortmarke · #565D7B Akzent · #EF9723
Auf Dunkel
Bildmarke
Buttons

Vier Button-Typen für jede Situation — Flat, Outlined, Text und runde Icon-Buttons. Einheitlich in Höhe und Form, ruhig und aufgeräumt statt verspielt.

Material-Inputs

Eingabefelder mit mitwandernder Beschriftung — beim Reinklicken hebt sich der Rahmen deutlich hervor. Einfach ausprobieren:

Select & Autocomplete

Auswahl-Felder mit aufklappendem Menü — vom Überfahren bis zur getroffenen Auswahl.

Hotel Vienna
Switches & Checkboxen

Ein oder aus — auf einen Blick, mit Häkchen und Minus. Einfach antippen:

Zahlungsverarbeitung (PCI-Worker)
Automatische Rechnungsläufe

Status-Badges

Ein Farbsystem für jeden Zustand — dasselbe über Dashboard, Tabellen und Module.

Zugewiesen In Arbeit Abgeschlossen InHouse Storniert Fehlgeschlagen Geplant
Kontextmenü

Aktionen pro Zeile — kritische Aktionen wie „Löschen" werden klar in Rot dargestellt.

Einstellungen
Tarif wechseln
Löschen
Tabs

Reiter schalten zwischen ganzen Ansichten um — hier eine Tabelle, ein Leer-Zustand und ein Datei-Upload. Der aktive ist mit einem orangen Balken markiert. Einfach anklicken:

Reservierung Anreise Status Saldo
AMTYQNUQ-1Hotel Vienna 16.05.2623:45 Bestätigt 0,00 €
IPDZRKCF-1Hotel Graz 21.05.2623:46 In-House −315,00 €
QSLQNXGM-1Hotel London 17.06.2610:00 Checked out −151,71 €
1–3 von 24 · Einträge pro Seite 10
Dashboard-Widget

Eine Kachel aus dem Dashboard: Titel, Verschiebe-Griff und Menü im Kopf, darunter der Inhalt — hier die Zimmer-Auslastung auf einen Blick.

Statistik
854Zuweisungen
VIE Double268 BER Double201 BER Single172 LND Double124 LND Family89
Alle 3 Properties · Letzten 180 Tage
Farben
Primary#E8941B
Primary c.#FFE8C7
Secondary#565D7B
On-Surface#1B1B1D
Outline#76767E
Success#479458
Warning#E8941B
Error#B4281C
Typografie

Roboto — vertraut aus apaleo. Klare Abstufungen für Titel, Text und Beschriftungen, ruhig und gut lesbar.

AaRoboto
Seitentitel 1.5rem · 500
Dialogtitel 1.125rem · 500
Widget-Titel 1rem · 500
Fließtext 1rem · 400
Sekundär 0.875rem · 400
Caption 0.75rem · 500
Iconografie

Material Design Icons — ein durchgängiger Outline-Strich über Navigation, Tabellen und Module.

Vuetify 4 · Material Design 3 Roboto · Gewichte 400 / 500 WCAG 2.1 AA · Fokus sichtbar Light-Mode, nativ
Sicherheit · EU CRA

Security by Design, nicht nachträglich

LeoFlex wird nach den Vorgaben des EU Cyber Resilience Act entwickelt. Sicherheit steckt in jedem Baustein, jeder Funktion und jeder Datenabfrage — kein Extra, das man später anschraubt.

Daten strikt getrennt

Die Zuordnung zum Hotel stammt immer aus dem sicheren Login — niemals aus manipulierbaren Anfragedaten. Die Trennung ist tief im System verankert.

Feine Zugriffsrechte

Fein abgestufte Rechte pro Bereich: Jede Funktion prüft genau, wer was darf und sehen kann — nichts ist pauschal freigegeben.

Verschlüsselte Schlüssel

Zugangsschlüssel werden verschlüsselt verwahrt. In den Protokollen landen niemals persönliche Daten, Schlüssel oder Zahlungsinfos.

Geprüfte Bausteine

Vor jeder Veröffentlichung werden alle verwendeten Bausteine automatisch auf bekannte Schwachstellen geprüft und lückenlos dokumentiert.

Abgeschotteter Betrieb

Jeder Baustein läuft streng abgeschottet und mit möglichst wenig Rechten — auf Wunsch zusätzlich hinter einer Web-Firewall.

Sicherer Browser-Teil

Die Oberfläche ist konsequent abgesichert: strenge Schutzregeln und keine Zugangsdaten, die im Browser gespeichert werden.

Nachvollziehbar & belegt

Sicherheitsrelevante Aktionen sind lückenlos protokolliert — ohne persönliche Daten. Prüfprotokolle und Testergebnisse werden als Nachweis aufbewahrt.

Klarer Meldeweg

Ein klarer Weg, um Sicherheitslücken zu melden: Bewertung nach Schweregrad und schnelle Korrektur — nichts wird veröffentlicht, bevor es behoben ist.

Drei Authentifizierungs-Ebenen
Dashboard-LoginSicherer Login direkt über apaleo — für Nutzer im Dashboard.
System-ZugangAbgesicherte Zugangs-Tokens — für angebundene Systeme und Integrationen.
Admin + Extra-CodePasswort oder Microsoft 365 — plus verpflichtender zusätzlicher Sicherheitscode.
PCI-Grenze

Kartendaten? Werden nie gespeichert.

Zahlungsdaten werden nie zu gewöhnlichen Plattformdaten. Vollständige Kartendaten liegen nur für einen kurzen Augenblick im Arbeitsspeicher eines streng isolierten Bausteins — einzig, um sie direkt an die sichere Zahlungsschnittstelle von apaleo zu übergeben. Dauerhaft gespeichert werden nur unbedenkliche Angaben: Kartenmarke und die letzten vier Ziffern. Und dieser Baustein ist eine Einbahnstraße: Nach außen tritt er mit einer eigenen Internet-Adresse auf, über die er Daten nur abholt und weitergibt — über diese Adresse ist er selbst nicht erreichbar. Es gibt kein offenes Tor, durch das jemand von außen hineinkäme.

PCI DSS Compliant
Channex SecureKartendaten nur angefragt, wenn nötig
Isolierter Baustein — nur im SpeicherKeine Datenbank, kein Protokoll
Eigene Ausgangs-Adresse — EinbahnstraßeHolt und sendet nach außen, ist selbst nicht erreichbar
apaleo ZahlungsschnittstelleÜbergabe, danach sofort verworfen
Andere Bausteine lehnen Zahlungsdaten abIm Zweifel wird blockiert
Datenschutz

Daten bleiben, wo sie hingehören

DSGVO ist kein Häkchen am Ende, sondern eine Architektur-Entscheidung — vom EU-Hosting bis zum Nachrichten-Bus, der bewusst keine Inhalte transportiert.

EU-Hosting

Betrieb und Daten bleiben in der EU — vom Datenbank-Cluster bis zur KI-Route.

Soft-Delete & Retention

Konten, Rechnungen, Zuordnungen werden nie hart gelöscht, sondern markiert und wiederherstellbar aufbewahrt.

Consent-first

apaleo ist Identitäts- und Consent-Quelle. Scope-Änderungen werden sauber und getrennt nachautorisiert.

Kein Datenabfluss

Die Live-Benachrichtigung überträgt nur kurze Hinweise „hier gibt es etwas Neues" — niemals Inhalte oder Hoteldaten.

KI-Integration

KI als Fundament, nicht als Gimmick

KI ist im ganzen System verankert — als zentrale Fähigkeit für alle Funktionen. Anbieter und Region lassen sich jederzeit austauschen, ohne dass eine einzige Funktion umgebaut werden muss.

Ein Baustein für allesAlle Funktionen nutzen denselben KI-Baustein. Die technischen Details des Anbieters bleiben sauber dahinter verborgen.
Text & klare ErgebnisseFreie Texte für Zusammenfassungen — und klar strukturierte Antworten dort, wo das System direkt weiterrechnet.
Pro Funktion einstellbarFür jede Funktion lässt sich das passende KI-Modell wählen — ohne Programmierung, nur über Einstellungen.
Serverseitig & privatDie Zugangsschlüssel bleiben serverseitig. Für sensible Aufgaben laufen ausschließlich EU-Modelle.
AI-Gateway · server-seitig
Kern & ModuleIAiService
OpenAI-kompatibel
Requesty Routerrouter.eu.requesty.ai
Regeln für Route & EU-Region
EU-ModelleDSGVO-konform
azure/gpt-5.1@swedencentral azure/gpt-4o-mini@swedencentral
Tech-Stack

Womit LeoFlex läuft

Runtime
.NET 10 · ASP.NET Core

Mandantensicheres Backend in sauberer Schichten-Architektur — typsicher, schnell und langfristig wartbar.

ORM & DB
EF Core 10 · PostgreSQL 15

Zuverlässige Datenhaltung mit strikter Mandantentrennung bis in jede einzelne Datenbank-Query.

Auth
OpenIddict · apaleo OAuth

Standardkonformer OAuth-/OIDC-Login, direkt an die apaleo-Identität jedes Hotels gekoppelt.

Frontend
Vue 3 · Vuetify 4 · TypeScript

Reaktives Dashboard im vertrauten apaleo-Look — komponentenbasiert und durchgängig typisiert.

State & Build
Pinia · Vite

Vorhersehbarer State und blitzschnelle Builds für kurze Ladezeiten im Browser.

Realtime
Server-Sent Events · LISTEN/NOTIFY

Live-Aktualisierung — Änderungen erscheinen im selben Moment im Dashboard, ohne Neuladen.

Payments
Stripe

PCI-DSS-konforme Zahlungsabwicklung; Kartendaten berühren die LeoFlex-Plattform zu keinem Zeitpunkt.

Integrationen
apaleo · Channex · WhatsApp

Tief in die Hotellerie eingebunden: PMS, Channel-Manager und Gäste-Kommunikation.

KI
Requesty (EU) · Azure OpenAI

Alle KI-Läufe über EU-gehostete Modelle (Azure, Schweden) — per Router jederzeit um weitere EU-Anbieter erweiterbar.

Plattform, Betrieb & Integrationen

apaleo PMS Channex Stripe OpenAI Anthropic Microsoft Azure Docker
Kennzahlen

Die Anwendung liegt hinter dem Login — ein öffentlicher PageSpeed-Test greift hier nicht. Die Performance messen wir mit Lighthouse direkt in der eingeloggten App; die Messwerte folgen. Was heute schon feststeht:

0
gespeicherte Kartendaten
0 %
EU-Hosting & DSGVO
0
Architektur-Schichten
90+
Lighthouse-Ziel
Ziel · Messung folgt
Ihr Projekt

Das nächste System kann Ihres sein.

Ob Website, App oder ein ganzes Produkt: Ich bringe dieselbe Sorgfalt mit, mit der ich mein eigenes System gebaut habe.