E-handel
Lunnheim
Design og kode for lunnheim.com: en nettbutikk der produktene får ro, med Stripe og Klarna i kassen.
Skjermbilde av https://lunnheim.com, fanget 31. juli 2026. Toppen av forsiden.
Nettbutikken til Lunnheim skulle kjennes like rolig som produktene den selger. Jeg har fått forme den fra begge ender, design og kode, og målet har hele tiden vært det samme: la typografien og produktbildene bære siden, og hold teknikken ute av syne.
Du setter sammen produktet ditt med ramme, materiale og størrelse, legger det i kurven og betaler med Stripe eller Klarna. At det kjennes enkelt, er den vanskeligste delen.
Konfiguratoren er fem steg, og det morsomste å bygge var forhåndsvisningen: rektangelet tegnes i riktig forhold mens du drar i glidebryterne. Det vanskeligste var å la den være stille.
01
Steg 1
Innhold
Du starter med innholdet rammen skal bygges rundt. Teksten som forklarer det, er redaksjonens egen og hentes fra Sanity, ikke skrevet inn i koden.
02
Steg 2
Retning og størrelse
Stående eller liggende, og deretter bredde og høyde med hver sin glidebryter. Målene går i hele fem centimeter av gangen, med tjue centimeter som minste kant.
03
Steg 3
Ramme
Rammetykkelsene ligger på produktet i Sanity, hver med sitt eget bilde. Velger du en tykkere ramme, blir kantlinjen i forhåndsvisningen tykkere i samme øyeblikk.
04
Steg 4
Finish
Seks farger, hver med sin RAL-kode, fra Jet Black til Steel. Fargen flytter ikke prisen. Den endrer bare tonen i flaten du ser på mens du velger.
05
Steg 5
Oppsummering
Siste steg samler valgene og prisen på ett sted, slik at du ser hele bestillingen før den går i kurven.
Kassen
To faner, og faktura står først
Faktura
Standardvalget
Alt lages på bestilling, og frakten går bare til Norge. Kassen åpner på fakturafanen: der skjer det ingen betaling i øyeblikket. Fakturaen kommer når varen er sendt, med fjorten dagers forfall og sporing i samme melding.
Kort og Klarna
Den andre fanen
Vil du gjøre opp med en gang, ligger kort og Klarna i samme Stripe-flate. Prisen på et konfigurerbart produkt kommer av flatemålet, en fast grunnpris pluss en sats per kvadratmeter, og hverken ramme eller finish rører den.
Redaksjonen
Hva Sanity faktisk styrer
Kunden skal kunne drive butikken uten meg. Det blir tydeligere når man også sier hva de ikke kan røre.
Produkter
Varianter og priser
Nye produkter, varianter, priser, rammetykkelser med bilder og gallerier legges inn direkte. De blir kjøpbare uten at noen bygger noe på nytt.
Sider
Tre seksjonstyper
Vanlige sider settes sammen av tre seksjonstyper. Kategorier, journal og nyhetsbrev styres fra samme sted, av samme folk.
Bilder
Hotspot bestemmer utsnittet
Produktbildene kommer opp med en uskarp forhåndsvisning først. Hotspoten redaktøren setter i Sanity avgjør hva bildet holder fast i når det beskjæres.
Grensen
Det som ligger i koden
Forsiden, de seks finishfargene og prisformelen står i koden, ikke i Studio. Den avveiningen ville jeg tatt igjen: dette er tre ting med konsekvenser man ikke skal kunne endre ved et uhell.