Lead Your Health.

Was kam rein.

Die Kundin: eine etablierte Coach mit langjähriger Praxis. Klienten sind Vorstände und Führungspersonen aus dem deutschsprachigen Raum. Themen: Stress, Leistung, Gesundheit unter Druck.

Ihr alter Auftritt war nicht falsch. Er war austauschbar. Standard-Theme, beliebige Bilder, "Über mich"-Geschichte ohne Profil. Die Website signalisierte nicht, was die Coach in der Praxis tatsächlich liefert.

Mein Auftrag in einem Satz: ein Auftritt, der vom ersten Eindruck an die Qualitätsdifferenz zeigt — ohne dabei laut zu werden.

Die Bedingungen.

• Tonalität. Premium ohne Glanz. Vertrauen ohne Floskeln. Keine "deine beste Version"-Sprache.
• Mobile-First. Klienten sitzen oft in Bahnen und Flugzeugen. Schwache Netze, kleine Bildschirme. Aber kein Look, der nach Mobile-Compromise aussieht.
• Privacy-Compliance. Deutsche Datenschutz-Standards. Keine Tracker. Keine externen Analytics. Klient-Tools speichern nichts auf Server-Seite.
• Future-Proof. Die Coach plant zwei Bücher in den nächsten drei Jahren. Das Designsystem muss erweiterbar sein — ohne Re-Design.

Wie das entstand.

1. I

   Discovery

   Drei Gespräche mit der Coach. Eine Tonalitäts-Analyse: was ist ihre Sprache, wie redet sie über Klienten, was sagt sie nicht. Eine Wettbewerbs-Sichtung — nicht um zu kopieren, sondern um zu verstehen, womit ihre Klienten ständig vergleichen werden. Ergebnis: ein einseitiges Brief-Dokument mit drei Sätzen, die das Projekt bestimmen.

2. II

   Brand-Foundation

   Eigenes Designsystem statt Theme. Cormorant Garamond als Display-Schrift — präzise, ein Hauch klassisch, ohne ins Manieriert-Editorial zu kippen. Inter als Body. Die Farbpalette: Off-Black, Cream, Burgundy als Akzent, ein warmer Sand-Ton. Kein Stock-Foto-Look, sondern reduzierte Bildsprache mit echten Praxis-Aufnahmen.

3. III

   Designsystem & Komposition

   Sechs Wochen Designsystem-Bau im Browser. Tokens für Typografie, Abstand, Farbe, Easing. Kompositionen im echten Code, nicht im Figma — weil der echte Browser anders rendert als ein Mockup. Drei Reviews mit der Coach: jede Review hat etwas vereinfacht, nicht hinzugefügt.

4. IV

   Custom Tools

   Zwei Tools entstanden zusammen mit der Coach. Ein interaktiver Selbstcheck, der ihre Klienten vor dem ersten Gespräch durchgehen — keine Standard-Quiz-Logik, sondern eine ruhige Befragung in ihrer Sprache. Ein Termin-Buchungs-Flow, der nicht wie Calendly aussieht, sondern wie ein Teil ihrer Marke.

5. V

   QA & Launch

   Drei Tage Pre-Launch QA: Screen-Reader-Pass, Reduced-Motion-Pass, Print-Stylesheet, 404-Page mit eigener Atmosphäre. Lighthouse-Optimierung bis 98 Performance trotz WebGL-Detail. PWA-Setup mit Offline-Modus für die Klienten-Tools. Launch leise, ohne Ankündigung — die Coach wollte erst sehen wie es sich anfühlt.

Fünf Punkte, an denen sich das Projekt entschieden hat.

1. — Typografie

   Cormorant Garamond als Display-Schrift — kein Sans-Serif.

   Die Coach arbeitet mit reflektiven Themen. Ein Serif gibt der Typografie den Atem, der zur Tonalität passt. Ein Sans-Serif hätte sie effizienter wirken lassen — aber genau das war nicht der Punkt.

2. — Akzent-Farbe

   Burgundy als einziger Akzent — keine zweite Farbe.

   Premium signalisiert sich über Disziplin, nicht über Auswahl. Eine einzige präzise gesetzte Farbe sagt mehr als drei austauschbare Töne. Burgundy passt zur Erwachsenheit der Klienten-Schicht.

3. — Slider

   Kein Slider, kein Karussell — nirgendwo.

   Slider verstecken Inhalt. Wenn etwas wichtig ist, muss es sichtbar sein. Wenn es nicht wichtig genug ist um sichtbar zu sein, gehört es nicht auf die Seite.

4. — Selbstcheck-Tool

   Eigene Komponente, kein Typeform-Embed.

   Drittanbieter-Tools haben ihre eigene Brand. In dem Moment wo der Klient den Flow startet, ist er nicht mehr in der Marke der Coach — er ist in Typeform. Das ist der falsche Eindruck im falschen Moment.

5. — PWA

   Offline-fähig, installierbar als App.

   Die Klienten der Coach reisen viel, sitzen oft in Flugzeugen oder Bahnen ohne stabiles Netz. Wenn der Selbstcheck-Tool offline funktioniert, kann er auch dort genutzt werden. Kleines Detail, großer Unterschied im Alltag.

Was nach dem Launch passierte.

Erste Reaktionen: höhere Anfrage-Qualität — weniger "passt das für mich?"-Nachrichten, mehr direkte Buchungs-Anfragen. Längere Verweildauer auf Detail-Seiten. Positive Resonanz bei den Empfehlern aus dem Coach-Netzwerk.

Performance-Window für 90 Tage läuft noch. Die finalen Zahlen ergänze ich, sobald sie da sind. Vorläufige Daten sehen gut aus — gut genug, dass die Coach mir bereits zwei Empfehlungen geschickt hat.

Final-Daten ergänzt nach 90-Tage-Performance-Window.