WunderDerm — Markenrefresh und digitale Plattform

Eine bekannte Marke brauchte ein neues digitales Kapitel

WunderDerm verfügte bereits über einen funktionierenden Auftritt, lokale Bekanntheit und eine wiedererkennbare Identität. Der Relaunch sollte diese Substanz nicht ersetzen, sondern die frühere Beauty-Labor-Anmutung in die klarere Positionierung „Laser + Hautkonzepte“ überführen.

Gleichzeitig war die WordPress-Struktur über Jahre seitenweise gewachsen. Leistungen, Körperzonen, Preise, Technologieerklärungen und Buchungswege brauchten eine gemeinsame Informationsarchitektur, die ausdrucksstark bleibt und praktische Antworten schnell zugänglich macht.

Eigenständiger Markencharakter statt austauschbarer Beauty-Vorlage

Die expressive Wortmarke blieb erhalten, während Hierarchie, Farbwelt und Typografie neu geordnet wurden. Tiefblau schafft Ruhe und Vertrauen; Braun, Pink und Off-White bilden ein flexibles System für Navigation, Servicekarten und Conversion-Module.

• Überarbeitete Logo-Lockups mit „Laser + Hautkonzepte“
• Wiederverwendbare Typografie-, Farb-, Spacing- und Komponentenregeln
• Warme, selbstbewusste und bewegte Bildsprache
• Desktop und Mobile von Beginn an gemeinsam gestaltet

Komplexe Leistungen als verständliche Produktwege

Besucherinnen und Besucher kommen mit einer Körperzone, einem Budget oder einer Technologiefrage. Daraus entstanden verknüpfte Oberflächen: Zonenübersichten, strukturierte Karten, Paket- und Preismodule, kontextuelle Erklärungen und klare Übergänge zur Buchung.

Interaktiver Zonen-Explorer

Eine responsive Körperkarte wechselt zwischen Frauen- und Männeransicht, ordnet Regionen und zeigt passende Zonen, ohne eine lange Preisliste durchsuchen zu müssen. Dasselbe Informationsmodell trägt fokussierte Landingpages und mobile Karten.

WunderQuiz als geführte Orientierung

Der kurze WunderQuiz übersetzt technische Unterschiede in einen verständlichen Auswahlweg. Er ordnet Präferenzen und führt zu relevanten Informationen und Preisen — ohne Diagnose oder professionelle Beratung zu ersetzen.

Eine zweite Servicewelt im selben Designsystem

Während Laser-Haarentfernung stark strukturierte Zonen- und Preislogik benötigt, funktioniert die Microneedling-Seite redaktioneller: Produktbilder, eine ruhige Erklärung, Ablauf, Vorbereitung und Nachsorge. Typografie, Navigation, Spacing und Conversion-Komponenten bleiben dennoch konsistent.

Vom vollständigen Figma-Layout zu ausgearbeiteten Seitenmodulen

Desktop und Mobile wurden parallel komponiert. Die ausgewählten Screens zeigen den Weg vom angebotsorientierten Hero über Erklärung und Prozess bis zur fotografischen Story — als eigene Tonalität innerhalb derselben Marke.

Vom Designsystem zur wartbaren Plattform

Der neue Auftritt wurde als Next.js-Anwendung statt als weiteres Page-Builder-Theme umgesetzt. Der App Router, React und TypeScript bilden die Frontend-Basis; Sanity stellt strukturierte redaktionelle Kontrolle für Inhalte bereit, die ohne Code-Release gepflegt werden sollen.

Ergebnis

WunderDerm verfügt heute über ein zusammenhängendes digitales System für Marke, Leistungsfindung, Preise, Orientierung, Buchungswege und CMS-Betrieb. Der Auftritt bleibt erkennbar WunderDerm — wirkt aber klarer, aktueller und deutlich leichter erweiterbar.

Diese Case Study dokumentiert Marken-, Design- und Softwarearbeit. Sie trifft keine Aussagen über klinische Wirksamkeit oder individuelle Behandlungsergebnisse.

Weitere Ansichten aus dem Designsystem