Jassmin's Garden

De uitdaging

Een product online verkopen is iets anders dan het in een fysieke winkel presenteren: een bezoeker kan niets vasthouden, ruiken of iemand om advies vragen. Voor Jassmin's Garden, een merk rondom Marokkaanse bodycare, moest de webshop daarom een deel van die ervaring digitaal overbrengen -- niet alleen producten tonen, maar het merk voelbaar maken.

• Producten duidelijk en aantrekkelijk presenteren
• Het verhaal achter het merk zichtbaar maken
• Vertrouwen opbouwen vóór de aankoopbeslissing
• Een structuur die kan meegroeien met het assortiment

Aanpak

1. 01

   Eén doorlopende bezoekersroute, niet losse pagina's

   In plaats van elke pagina los te ontwerpen is gekeken naar de volledige route: eerste indruk, ontdekken, product bekijken, vertrouwen opbouwen, actie. Elke sectie kreeg daarbinnen een eigen, duidelijke functie.

   • · Homepage introduceert het merk en de productwereld
   • · Categorieën helpen bezoekers gericht zoeken
   • · Productpagina's geven ruimte aan informatie en presentatie
   • · Navigatie leidt zonder onnodige stappen naar het doel
2. 02

   Storytelling verweven in de structuur, niet als losse tekst

   Herkomst, ingrediënten en toepassing spelen mee in de aankoopbeslissing bij een verzorgingsmerk. Het merkverhaal is daarom in de opbouw van de webshop geïntegreerd, niet toegevoegd als losse marketingtekst -- de website vertelt het verhaal terwijl de bezoeker door de producten beweegt.

3. 03

   Rustig, verzorgd design met een duidelijke hiërarchie

   De interface is bewust niet volgestopt: geen onnodige animaties of ingewikkelde navigatie, wel duidelijke typografie en voldoende ruimte voor productpresentatie.

   • · Duidelijkheid: de bezoeker weet altijd waar hij is en wat hij kan doen
   • · Rust: producten en content krijgen voldoende ruimte
   • · Consistentie: één visueel systeem voor knoppen, kaarten en typografie
4. 04

   Getest van mobiel tot desktop

   Navigatie, productkaarten, afbeeldingen, tekstblokken, CTA's en spacing zijn per schermformaat afgestemd, zodat de ervaring op elk apparaat natuurlijk aanvoelt.

Technologie

• Next.js
• React
• TypeScript
• Tailwind CSS
• Framer Motion
• Supabase
• Vercel

Resultaat

Wat er is opgeleverd:

• Volledig maatwerk e-commerce ontwerp, opgebouwd rond de volledige bezoekersroute
• Mobile-first gebouwd en getest van mobiel tot desktop
• SEO-basis: logische URL- en heading-structuur, metadata en technische indexeerbaarheid
• Storytelling verweven in de productstructuur, niet als losse marketingtekst
• Schaalbare basis die meegroeit met een uitbreidend assortiment

Meer projecten

Wil je iets vergelijkbaars?