Laadsnelheid
97 / 100
De webshop laadt razendsnel op elke smartphone — geen wachttijd die bezoekers doet afhaken voor ze een product zien.
Volledig op maat
0 templates
Geen Shopify, geen WooCommerce. Elke component is gebouwd op de visuele filosofie van het merk.
Time-to-launch
3 weken
Van eerste briefing tot livegang, inclusief designsysteem, frontend en checkout-integratie.
De opgeleverde website
sobr.be
SŌBR — desktop view van de galerie-overzichtspagina
Uitdaging
Premium producten, generieke retail-template
SŌBR positioneert zich als een curated lifestyle-merk: beperkte oplages, producten met een verhaal, fotografie als primaire taal. Bestaande e-commerce platformen zijn ontworpen voor retail-volume — ze leggen structuurkeuzes op die lijnrecht ingaan tegen die filosofie.
Templatewebshops concurreren visueel met het product zelf: promotiebanners, generieke knoppen, smalle productfoto's naast een prijslabel. SŌBR had het tegenovergestelde nodig: rust, ruimte en context.
Knelpunten
- Generieke platformen (Shopify, Etsy) ondermijnen het premium karakter van de producten.
- Template-themes laten geen ruimte voor curatoriale teksten, maker-verhalen of edition-metadata.
- Productpagina's concurreren visueel met navigatiebars en promotiebanners.
- Checkout-flows voelen als retail — in plaats van een zorgvuldige galerie-aankoop.
Analyse
Waarom galerie-als-winkel werkt
Galerieën verkopen kunst zonder productpagina's, zonder promotiebanners en zonder urgency-tickers. Ze verkopen door context, verhaal en presentatie. Dat vertrouwen — en die perceptie van waarde — is overdraagbaar op producten die bewust gelimiteerd en zorgvuldig gecureerd zijn.
Kernprincipe
De UI is de tentoonstelling. Elk element dat niet de aandacht trekt naar het product is te veel. Witruimte is geen leegte — het is de muur waarop het product hangt.
Technologiekeuze
Next.js voor statische productpagina's met snelle first-load, gecombineerd met een beheerpaneel voor editions, teksten en afbeeldingen. Volledige controle over elke visuele beslissing.
Aanpak
Van designfilosofie naar werkende webshop in vier stappen
We startten vanuit de merkfilosofie — niet vanuit een template — en bouwden van tokens naar componenten naar een volledig e-commerce platform dat de gallery-ervaring centraal stelt.
01
Merkidentiteit & designfilosofie
We vertaalden de positionering "curation-as-gallery" naar concrete designprincipes: ivory achtergrond, maximale witruimte, één product centraal per pagina en typografische minimaliteit.
02
Designsysteem & tokens
CSS-variabelen voor kleurpalet (--bg, --surface, --text, --accent), typografietokens (Playfair Display voor koppen, Inter voor body) en een ruimtelijke grid die het galerie-ritme bewaakt.
03
Component-architectuur
Galerie-overzichtspagina, productdetailpagina met edition-metadata, maker-tekst en detailfoto's, frosted-glass overlay voor aankondigingen en een checkout die de galerie-ervaring niet doorbreekt.
04
Performance & oplevering
Statische generatie, WebP-afbeeldingen, lazy loading en prefers-reduced-motion support. Opgeleverd binnen drie weken na briefing — Lighthouse score 97/100 op mobile.
Designsysteem in beeld
Tokens die het merk bewaken op elke pagina
Het designsysteem van SŌBR is gebouwd als een set CSS-variabelen en typografietokens. Kleurpalet, spacing en typografie zijn gedocumenteerd als merkstandaard — elk toekomstig component valt automatisch in lijn.
--bg
#F7F4F0 Ivory
--surface
#D9C9B8 Warm Sand
--text
#0F172A Charcoal
--accent
#C75B3B Terracotta
Typografie: Playfair Display voor editorial koppen, Inter voor body-tekst en UI-labels. De combinatie geeft het merk een gevoel van een high-end tijdschrift.
Resultaat
Wat de galerie-aanpak oplevert
Producten worden gepresenteerd als kunstwerken: één centraal beeld, edition-nummer en maker-verhaal.
Curatoriale teksten geven context en provenance — het verhaal achter elk product rechtvaardigt de prijs.
Minimale UI-chrome laat de fotografie domineren op elke schermgrootte.
Checkout integreert naadloos in de galerie-ervaring zonder stijlbreuk of generieke retailknoppen.
prefers-reduced-motion gerespecteerd voor alle fade/scale micro-interacties.
Takeaway
Een webshop hoeft geen winkel te zijn. Als uw product verhaal verdient, verdient het ook een tentoonstelling.
SŌBR bewijst dat e-commerce en galerie-ervaring geen tegenpolen zijn. De UI is de tentoonstelling, de fotografie is het werk, het verhaal is de catalogustekst. Samen rechtvaardigen ze de waarde van wat er verkocht wordt.
Veelgestelde vragen
Waarom geen Shopify of WooCommerce voor dit project?
Bestaande platformen zijn ontworpen voor retail-volume, niet voor curated gallery-ervaringen. Templates leggen
structuurkeuzes op die botsen met de filosofie "curation-as-gallery". Een custom frontend geeft volledige controle
over elk visueel detail — van de witruimte rond een productfoto tot de typografische hiërarchie op de detailpagina.
Hoe wordt de checkout verwerkt in een custom webshop?
We integreren een betaalprovider (zoals Mollie of Stripe) via API. De checkout-UI wordt volledig in huisstijl
gebouwd zodat de galerie-ervaring naadloos doorloopt tot na de betaling — zonder generieke pay-schermen.
Kunnen producten eenvoudig worden toegevoegd of aangepast?
Ja. We bouwen een beheerpaneel of koppelen aan een headless CMS zodat de klant zelf editions, teksten en
afbeeldingen kan beheren zonder technische kennis.
Hoe lang duurt het bouwen van een vergelijkbaar custom e-commerce project?
Voor een project met vergelijkbare scope — designsysteem, productpagina's, galerie-overzicht en checkout —
rekenen we 3 tot 6 weken afhankelijk van de complexiteit van de betalings- en voorraadintegratie.
