DDM Massage– Markenauftritt, Erstellung der Website, Fotografie, Videoschnitt & SEA

von

Titelbild DDM-Massage

Für eine Freundin, die ein eigenes Massage-Business betreibt, realisierte ich einen vollständigen digitalen Marken- und Webauftritt. Ziel des Projekts war es, einen professionellen Auftritt zu schaffen, der ihre Dienstleistungen ansprechend präsentiert und Vertrauen bei potenziellen Kund*innen aufbaut. Gleichzeitig sollte eine Online-Terminvereinbarung ermöglicht werden. Die Plattform dient als zentrale Anlaufstelle und verbindet Informationen zu den Massage-Angeboten, visuelle Eindrücke, Kontaktmöglichkeiten sowie ein integriertes Buchungssystem. Dabei habe ich auch die Fotos für den digitalen Auftritt selbst gemacht sowie die Videoaufnahmen gefilmt und geschnitten. Nach Beendigung der Webseite habe ich des Weiteren eine Google Werbekampagne aufgeschaltet.

Die Website ist erreichbar unter ddm-massage.ch.

Inspiration, Konzept & gestalterische Ausrichtung

Zu Beginn des Projekts suchte ich gezielt nach Inspirationen für professionelle Spa- und Wellness-Websites. Dafür nutzte ich unter anderem eine Übersicht von Colorlib sowie die Website von BODHI Spa (bodhispa.com). Dabei achtete ich besonders auf ruhige Farbwelten, hochwertige Bildsprache, klare Service-Strukturen und einfache Online-Terminbuchungen. Ergänzend liess ich mich von selbst generierten Mockup-Ideen aus Claude AI und ChatGPT inspirieren. Einzelne Designansätze wurden teilweise übernommen jedoch selbst gestaltet und programmiert.

Daraus entwickelte sich eigene Gestaltung, die zur Therapeutin und zum Angebot passt.

Konzept, Bildwelt & Medienproduktion

Ein wichtiger Bestandteil des Projekts war die visuelle Gestaltung der Website. Um einen authentischen und persönlichen Auftritt zu schaffen, produzierte ich einen grossen Teil des Bild- und Videomaterials selbst. Geplant war eigentlich der Einsatz eines professionellen Foto- und Videografen. Dieser fiel jedoch kurzfristig aus, weshalb ich die Verantwortung für die Produktion der Fotos und Videos selbst übernahm.

Dazu gehörten:

  • eigene Fotografie für die Website
  • Filmen eines Hero-Videos
  • Schnitt des Videomaterials
  • Colorgrading
  • Komprimierung und Optimierung für die Webnutzung

Besonders wichtig war dabei, eine ruhige, vertrauensvolle und professionelle Atmosphäre zu erzeugen, die zum Massage-Angebot passt. Die Bildsprache sollte Entspannung, Nähe und Qualität vermitteln sowie dem Auftritt durch die sichtbare Präsenz der Therapeutin eine persönliche Note geben.

Das Hero-Video wurde so aufbereitet, dass es optisch hochwertig wirkt, gleichzeitig aber technisch für die Website optimiert bleibt. Wichig auch hier, dass meine Freundin im Zentrum steht. Hier war es sehr anspruchsvoll, die Balance zwischen visueller Qualität und Dateigrösse zu finden.

Technische Umsetzung & Setup

Für die Umsetzung der Website arbeitete ich mit WordPress. Dabei erstellte ich ein Child Theme, wodurch individuelle Anpassungen möglich waren, ohne das Haupt-Theme direkt zu verändern.

Dabei konnte ich teilweise auf Erfahrungen und Ressourcen aus früheren Projekten zurückgreifen, musste die Website jedoch gezielt an die Anforderungen dieses neuen Auftritts anpassen.

Die Anpassungen erfolgten unter anderem mit:

  • HTML
  • CSS
  • JavaScript
  • PHP
  • WordPress Child Theme
  • Plugin-Modifikationen & Plugin Erweiterungen

Ziel war es, eine Website zu entwickeln, die sowohl optisch hochwertig als auch funktional und responsive ist. Besonders wichtig war dabei die mobile Darstellung, da viele Nutzer*innen die Website voraussichtlich über das Smartphone besuchen.

Auch bei diesem Projekt wurden bestehende WordPress-Funktionen und Plugins nicht einfach unverändert übernommen, sondern gezielt erweitert und angepasst.

Hero-Video und mobiles Layout

Für den Hero-Bereich wurde ein Video-Plugin eingesetzt. Dieses bot grundsätzlich die benötigte Funktionalität, war jedoch in gewissen Bereichen eingeschränkt. Insbesondere für bestimmte mobile Layout-Optionen wären kostenpflichtige Erweiterungen notwendig gewesen. Deshalb entschied ich mich, gewisse kostenpflichtige Features selbst zu programmieren, wie zum Beispiel den responsiven Videowechsel für mobile Geräte.

Terminvereinbarungssystem

Ein zentraler Bestandteil der Website war ein Terminvereinbarungstool, mit dem Kund*innen direkt online Termine buchen können. Das Tool wurde in die Website integriert und an die Bedürfnisse des Massage-Business angepasst.

Besonders wichtig war dabei die Anbindung an Google Kalender. Dadurch erscheinen neue Buchungen automatisch direkt im Kalender der Therapeutin. Gleichzeitig werden Termine, die sie selbst im Google Kalender einträgt, im Buchungssystem blockiert, sodass keine Doppelbuchungen entstehen. Die Umsetzung umfasste unter anderem:

  • Einbindung des Buchungssystems in WordPress
  • Anpassung der Einstellungen an das Massage-Angebot
  • Testen des Buchungsablaufs
  • Optimierung der Nutzerführung für Kund*innen

Child Theme und individuelle Anpassungen

Wie bei meinem früheren Projekt arbeitete ich mit einem Child Theme, um die Website flexibel und update-sicher anzupassen. Dadurch konnte ich bestehende Funktionen erweitern und gleichzeitig eigene Layout- und Designlösungen umsetzen.

Einige Anpassungen betrafen:

  • responsive Layouts
  • Abstände und Seitenstruktur
  • mobile Darstellung
  • visuelle Optimierungen
  • Einbindung und Anpassung von Plugins
  • Gestaltung einzelner Website-Bereiche

Cloudflare-Integration

Die Website wurde zusätzlich mit Cloudflare verbunden, um Sicherheit und Performance zu verbessern. Da Domain und Hosting bei einem anderen Anbieter lagen, wurden die Nameserver der Domain auf Cloudflare umgestellt und anschliessend mit dem bestehenden Hosting verknüpft.

SEA & Google Ads

Nach der Umsetzung der Website setzte ich mich zusätzlich mit dem Thema SEA auseinander. Dafür informierte ich mich mithilfe eines über zweistündigen YouTube-Tutorials über die Grundlagen und das Aufsetzen von Google Ads Kampagnen.

Anschliessend erstellte ich ein Google Ads Profil und setzte eine erste Kampagne für das Massage-Business auf. Ziel war es, die Sichtbarkeit der Website zu erhöhen und potenzielle Kund*innen gezielt auf das Angebot aufmerksam zu machen.

Zusätzlich unterstützte ich meine Freundin bei der Verifizierung des Google Ads Profils.

Fazit

Durch dieses Projekt konnte ich viele neue praktische Erfahrungen in der Umsetzung sammeln. Neben der Gestaltung und technischen Umsetzung lernte ich auch, wie wichtig Planung, Flexibilität und Problemlösung während eines Projekts sind. Ein Key Takeaway ist für mich gewesen, dass nicht immer alles nach Plan läuft und wie wichtig es ist improvisieren zu können.

(mbi)

Die grösste Herausforderung lag in der technischen Integration des Terminvereinbarungstools. Obwohl das Tool geeignet wirkte, zeigte sich während der Umsetzung, dass es fehleranfällig war und nicht alle benötigten Funktionen zuverlässig bereitstellte. Dabei musste ich auf den Customer Support zurückgreifen. Dieser erwies sich jedoch als wenig hilfreich und die unregelmässige Kommunikation mit dem Support erschwerte die Umsetzung. Viele Probleme musste ich deshalb selbst analysieren und eigene Lösungswege finden. Ein wichtiges Learning war: Bei Plugins ist das günstigste Tool nicht immer die beste Wahl. Schlussendlich habe ich mehr Zeit dafür aufgewendet, als wenn ich es selbst programmiert hätte.

Eine weitere Herausforderung war der kurzfristige Wegfall des geplanten Foto- und Videografen. Dadurch musste ich improvisieren, die Medienproduktion selbst übernehmen und den Zeitplan neu strukturieren.

Zusätzlich war die Optimierung des Hero-Videos anspruchsvoll, da eine gute Balance zwischen visueller Qualität, Dateigrösse und Ladezeit gefunden werden musste.

Auch die Anbindung von Cloudflare eine leichte Challenge, da die Umstellung der Namenserver nicht sofort übernommen wurde. Erst später wurde mir klar, dass diese Änderung bis zu 24 Stunden dauern kann. Dadurch wirkte es zuerst so, als sei etwas falsch eingerichtet worden, obwohl es sich nur um die normale Wartezeit bei der Aktualisierung handelte.

Auch die Verifizierung des Google-Ads-Profils war herausfordernd, da Google sehr selektiv mit den eingereichten Nachweisen umging. Mehrere Dokumente wurden abgelehnt, beispielsweise weil der Mietvertrag maximal zwei Monate alt sein durfte oder bestimmte Nachweise nicht akzeptiert wurden. Um die Verifizierung abschliessen zu können, war schliesslich auch ein Anruf beim Google-Support nötig.