Kundenprojekt · Design & Code
Mode- und Nagelatelier Völkl-Klier
Zwei Geschäftsbereiche, ein Auftritt: Für das Atelier in Haar habe ich Konzept, Design und Umsetzung übernommen. Die Inhaberin pflegt Inhalte selbst über Tina CMS.
- Rolle
- Konzept, Design & Entwicklung
- Kunde · Zeitraum
- Martina Völkl-Klier, Haar bei München · 2026
- Tech-Stack
- Astro
- CSS ohne Framework
- Tina CMS
- GitHub
- JSON-LD
Landingpage Herbstkollektion 2026
Mode & Stilberatung
Projekt im Überblick
- 01
Aufgabe
Das Atelier besteht seit 1998 und vereint italienische Damenmode mit Stilberatung und ein Nagelstudio mit Fußpflege. Die Website sollte beide Angebote klar trennen, trotzdem als ein Unternehmen auftreten und die ruhige, persönliche Atmosphäre vor Ort spürbar machen.
- 02
Lösung
Eigene Seiten für Mode, Nägel, Team, FAQ und Kontakt, verbunden durch ein gemeinsames Designsystem. Für die Herbstkollektion 2026 kam eine eigene Landingpage mit Lookbook dazu. Inhalte pflegt die Kundin selbst über Tina CMS; Änderungen laufen über GitHub und werden auf Strato veröffentlicht.
- 03
Ergebnis
Ein Auftritt, der die Atmosphäre des Ateliers digital wiedergibt: statisch ausgeliefert, mit optimierten Bildern und wenig JavaScript. Strukturierte Daten (BeautySalon und ClothingStore inkl. Öffnungszeiten) helfen Google, das Atelier bei lokalen Suchen korrekt anzuzeigen.
Designsystem
Farben und Schriften, die ich für dieses Projekt festgelegt habe.
- Papier
#f4efe8 - Leinen
#ece4d9 - Espresso
#211d1a - Rosé
#dd8ba8 - Pflaume
#6e4a5b
- Cormorant Garamond
- Überschriften
- Hanken Grotesk
- Fließtext
- JetBrains Mono
- Labels & Details
Zwei Welten, eine Handschrift
Mode-Atelier und Nagelstudio sollten jeweils als eigene Welt erkennbar sein, ohne dass die Website wie zwei zusammengesetzte Auftritte wirkt. Gelöst habe ich das über ein gemeinsames Grundgerüst aus Farben, Schriften und Abständen. Jeder Bereich bekommt darin eigene Bilder und Schwerpunkte: bei der Mode Looks und Stilberatung, bei den Nägeln Preise, Hygiene und Kundinnenstimmen.
Inhalte selbst pflegen, ohne Risiko fürs Layout
Über Tina CMS ändert die Inhaberin Texte, Preise und Bilder selbst. Jede Änderung landet als Commit in GitHub, der Stand ist dadurch jederzeit nachvollziehbar. Veröffentlicht wird auf Strato.
Lokale Auffindbarkeit
Die Seite ist per JSON-LD als BeautySalon und ClothingStore ausgezeichnet, mit Adresse, Öffnungszeiten und Einzugsgebiet. Zusammen mit kurzen Ladezeiten zahlt das auf Suchen wie „Nagelstudio München-Ost“ oder „Damenmode Haar“ ein.
Wer hat was gemacht?
Von mir
- Konzept und Seitenstruktur
- Designsystem: Farben, Typografie, Layouts
- Bildauswahl und Bildsprache
- Umsetzung aller Seiten in Astro und CSS
- Tina-CMS-Einrichtung und GitHub-Workflow
- Lokale SEO und strukturierte Daten
Mit KI-Unterstützung programmiert
- Kontaktformular (Versand ohne Neuladen, Spamschutz)
- FAQ-Akkordeon
- Bildergalerien und Kundinnen-Slider
- Animierte Unterschrift der Inhaberin
- Herbstkollektion: Siegel, Karten-Collage im Hero, Laufband
Gestaltung und Verhalten habe ich vorgegeben, den Code geprüft, angepasst und in allen gängigen Browsern inklusive Firefox getestet.