Aankomende markten krijgen prioriteit
Bezoekers moeten direct kunnen ontdekken waar Mirliefs binnenkort aanwezig is.
Projectcase · Live
Mirliefs
Een warme digitale thuisbasis voor handgemaakte creaties, actuele markten en persoonlijk contact.
Voor Mirliefs ontwierp en bouwde ik een complete introductiewebsite rond decoraties en cadeautjes van keramisch gips. Geen traditionele webshop, maar een persoonlijke plek om inspiratie te vinden, markten te bekijken en direct contact op te nemen.
Handgemaakt van keramisch gipsKleine gelukjes, met liefde gemaakt.Bekijk de marktkaart
Project in het kort
Geen webshop, maar een persoonlijke website die kan meegroeien.
Mirliefs verkoopt via persoonlijk contact en op markten. De website moest daarom niet draaien om een winkelwagen, maar om sfeer, actuele locaties en een eenvoudige volgende stap.
- Projectvorm
- Maatwerk introductiewebsite met hybride CMS
- Doelgroep
- Bezoekers die creaties en marktlocaties willen ontdekken
- Mijn rol
- Strategie, contentarchitectuur, UX/UI, development, CMS en livegang
- Techniek
- Next.js, React, TypeScript en Sanity
- Centrale functie
- Interactieve marktkaart van Nederland
- Status
- Live op www.mirliefs.nl
De beginsituatie
Een creatief merk dat vooral via sociale media werd ontdekt.
Mirliefs liet haar handgemaakte decoraties en cadeautjes voornamelijk via sociale kanalen zien. Dat paste bij het persoonlijke karakter, maar bood nog geen centrale plek waar bezoekers rustig konden kennismaken, voorbeelden konden bekijken en marktlocaties konden terugvinden.
Een volledige webshop zou onnodige complexiteit toevoegen. Daarom kozen we bewust voor een introductiewebsite die informeert en bezoekers daarna rechtstreeks met Mirliefs in contact brengt.
De analyse
Eerst bepalen hoe bezoekers Mirliefs ontmoeten, daarna pas ontwerpen.
Karakter & behoefteHandgemaaktMarktenPersoonlijkInspiratieSocial mediaZelf beheren
Nieuwe richtingMarkten als blikvangerInspiratie zonder webshopBestellen via DMWarm en overzichtelijkBeheerbare inhoud via Sanity
Inspiratie in plaats van een catalogus
Productbeelden tonen mogelijkheden, zonder te suggereren dat ieder voorbeeld direct beschikbaar is.
Persoonlijk bestellen blijft persoonlijk
Instagram en TikTok blijven de directe kanalen voor vragen, wensen en bestellingen.
Veranderlijke inhoud wordt beheerbaar
Markten, beelden en kernteksten mogen niet afhankelijk zijn van een codewijziging.
Structuur en bezoekersroutes
Vijf compacte pagina's, ieder met één duidelijke taak.
De homepage introduceert Mirliefs en maakt de eerstvolgende markt zichtbaar. Verdiepende pagina's bieden inspiratie, leggen bestellen via DM uit en brengen alle markt- en contactinformatie samen.
HomeKennismaken & eerstvolgende markt
InspiratieVoorbeelden & sfeer
BestellenPersoonlijk via DM
MarktenKaart & locaties
ContactDirecte kanalen
Belangrijkste bezoekersroutes
- 01Home → Markten → Marktinformatie of route
- 02Home → Inspiratie → Bestellen via DM
- 03Contact → Instagram of TikTok
Merk en ontwerp
Zacht en speels, zonder dat de website onrustig wordt.
De visuele stijl is gebaseerd op het vriendelijke, handgemaakte karakter van Mirliefs. Een licht palet en echte productfotografie zorgen voor herkenning, terwijl donkere lijnen en duidelijke knoppen de interface helder houden.
Helder crème#FFF8E8
Zacht perzik#F5B895
Bloemroze#EFA6B8
Zacht lila#CDBCEB
Visuele richtingSoft Handmade Joy
Ruimte, zachte kleurvlakken en echte fotografie maken het merk persoonlijk zonder een standaard webshopuitstraling.
Centrale functionaliteit
Van losse marktdata naar een plek waar bezoekers terugkomen.
De interactieve Nederlandkaart laat direct zien waar Mirliefs binnenkort staat. Iedere marker opent datum, tijden, plaats, adres, toelichting en eventuele route- of evenementlinks.
Dezelfde informatie staat ook in een gewone lijst. Zo blijft de pagina bruikbaar voor bezoekers die liever lezen dan een kaart bedienen.
Waarom native SVG-markers?Kaart en markers gebruiken hetzelfde schaalbare coördinatenstelsel en blijven daardoor ook op iPhones correct uitgelijnd.
Sanity CMS
Beheerbaar waar inhoud verandert, vast waar kwaliteit bewaakt moet blijven.
De ingebouwde Sanity Studio geeft de opdrachtgever controle over actuele inhoud. Architectuur, navigatie, vormgeving en technische SEO blijven bewust in code.
Mirliefs beheer●
⌂HomepageFoto's en verhaal
⌖MarktenData, kaartlocaties en links
✿InspiratievoorbeeldenBeelden, teksten en volgorde
⚙Website-instellingenIntroductie en contactkanalen
Zelfstandig aanpasbaar
- Marktnaam, datum, tijden en locatie
- Kaartpositie en aanvullende marktinformatie
- Inspiratiebeelden, teksten en volgorde
- Homepagefoto en focuspunt
- Verkoopkastverhaal en fotografie
- Introductie en sociale links
Wanneer Sanity tijdelijk niet bereikbaar is, blijven vaste informatie en sociale links bruikbaar en worden geen marktgegevens verzonnen.
Ontwikkeling en kwaliteit
Een stevige technische basis achter een zachte interface.
De website is gebouwd met Next.js, React en TypeScript. GitHub vormt de bron van waarheid en Vercel publiceert de productieversie. Sanity levert alleen de afgesproken beheerbare inhoud.
Responsive ontwerp, toegankelijkheid, SEO en performance zijn tijdens de bouw als vaste kwaliteitsonderdelen meegenomen.
01Next.js App Router
02React
03TypeScript
04Sanity Studio
05Schaalbare SVG-kaart
06Native SVG-markers
07Next Image
08GitHub
09Vercel
10Technische SEO
Van project naar productie
Zorgvuldig live, zonder bestaande e-mailinstellingen te verstoren.
Na de technische controles is de GitHub-repository aan Vercel gekoppeld. Voor het bestaande domein zijn alleen de benodigde webrecords gewijzigd; de aanwezige mailrecords bleven behouden.
www.mirliefs.nl is het primaire adres, de versie zonder www verwijst automatisch door en HTTPS is actief. Google Search Console is via DNS geverifieerd, de sitemap is aangemeld en Mirjam kreeg toegang tot de Sanity-beheeromgeving.
GitHub→Vercel→www.mirliefs.nl
Het resultaat
Een beheersbare digitale basis die persoonlijk contact centraal houdt.
Mirliefs heeft nu één herkenbare plek om haar verhaal, creaties en actuele marktlocaties te delen. Bezoekers kunnen inspiratie opdoen, praktische informatie bekijken en daarna rechtstreeks contact opnemen via het kanaal dat bij Mirliefs past.
De bewuste keuze tegen een webshop houdt de website overzichtelijk en sluit aan op de huidige manier van werken. Tegelijkertijd biedt de technische opzet ruimte om de inhoud bij te werken en later verder uit te breiden.
Bekijk Mirliefs live