LG Beauty: skalierbares Design-System für E-Commerce, 120.000 Besuche pro Monat
E-Commerce-Konzept für eine Multi-Brand Beauty-Plattform: Storefront, Produktseiten und ein durchgängiges Komponenten-System.
Website ansehen · lgbeauty.comWorum es ging
Es war der erste Markteintritt des Unternehmens in den USA unter der Marke LG Beauty, dem Dach für acht eigenständige Marken (darunter Physiogel, OHUI, Euthymol und Dr. Groot). Gefragt war ein Storefront, der jede Marke zur Geltung bringt und zugleich als ein zusammenhängendes, ruhiges Einkaufserlebnis funktioniert.
UX/UI-Design über alle Templates hinweg – Storefront, Produktseite, Homepage und Responsive – sowie die Arbeit am durchgängigen Komponenten-System.
Acht Marken, ein Auftritt
Die zentrale Frage: Wie bekommt jede der acht Marken ihren eigenen Charakter, ohne dass der Shop in acht verschiedene Welten zerfällt? Der Charakter kommt bewusst nicht aus dem UI, sondern aus den Inhalten: Markenfotografie, ein wechselndes Raster und ein präsentes Logo tragen die Identität der jeweiligen Marke, während die Oberfläche ruhig und neutral bleibt.
Ein klarer, minimalistischer Look ohne starken Eigencharakter hält das System für jede Marke, jede Kampagne und neue Inhalte voll flexibel und anpassbar. Die Bildwelt und der Charakter der Marke führen, das Interface tritt zurück.
Kategorie- und Filterseite
Die Kategorieseite führt durch das Sortiment: eine Filter-Sidebar (Kategorie, Marke, Preis, Größe, Farbe, Bewertung, Verfügbarkeit), klare Produktkarten mit Badges für Best Seller, Sale und Popular sowie ein Sortiermenü. Ruhiges Raster, Produkt im Fokus.
Alles Wichtige auf einen Blick
Die Produktseite verbindet eine großzügige Bildergalerie mit Varianten (Farbe, Größe), Bewertungen, Mengenwahl, Add to Bag und Shop Pay. Details, Ingredients, Results und How to use liegen in Accordions, darunter passende Sets als Cross-Sell.
Marken editorial erzählt
Die Startseite inszeniert die Marken redaktionell: Hero-Kacheln (Super Greens, Natural Beauty), Key Ingredients, Aktions-Banner wie das Free Gift, dazu Journal und Featured Articles. Serifenbetonte Typografie, viel Weißraum, große Bildwelten.
Mobile-first gedacht
Dieselbe Bildsprache und dieselben Komponenten auf dem Smartphone: angepasste Galerie, Varianten-Auswahl per Swatches und ein klarer Weg zum Checkout.
Ein System, kein Einzelscreen
Grundlage ist ein Komponenten-System: Buttons in mehreren Größen und Zuständen, Formularfelder (Focused, Typing, Filled, Error, Disabled), Produktkarten und eine serifenbetonte Typo-Skala von small bis x-large. So bleiben alle Seiten konsistent und schnell erweiterbar.
Live und weiter im Einsatz
Aus dem Konzept wurde der reale US-Storefront der Marke. Das Komponenten-System hat sich als tragfähig erwiesen: Das Team nutzt dieselben Templates bis heute für Aktionen, Kampagnen und neue Seiten.
Ein System, das acht Marken trägt und seit dem Launch 2023 ohne Redesign weiterläuft.