Go to content
Gourmetmenu 3 Retter

Skagenfood

Nytt gränssnitt och fokus på måltidslådor resulterar i ökad trafik och ökade intäkter.

Samarbetet

Skagenfood har länge varit känt som Danmarks ledande leverantör av nyfångad fisk levererad till ens ytterdörr. Men nu har de också gett sig in i jakten på den växande marknaden för måltidslådor. Dessa levereras i samma höga kvalitet som fisken, med enkla och goda recept gjorda av Skagenfoods egna duktiga kockar. Med målet att lyckas ville Skagenfood ha mer trafik och ökad konverteringate, framför allt på måltidslådor, och för det fick man bygga en ny frontend med förbättringar i UX. För uppdraget valde Skagenfood att arbeta tillsammans med Novicell.

Det var uppgiften

  • pen inside the setting image icon

    Design

    Visuell, modern och dynamisk design för målgruppen.

  • light ball inside the folder icon

    Frontend

    Ny frontend med fokus på prestanda och användarupplevelse.

  • head with a heart icon

    UX

    Användaren i fokus med ny menystruktur och sticky filter.

  • a magnifying glass diving into three sections icon

    Splittest av köpsflow

    Splittest och heatmaps som optimerar webbplatsen utifrån användarbeteende.

Ny design

För Skagenfood skapade Novicell en visuell och modern design med gott om plats för berättande och implementering av video. Uttrycket är dynamiskt och levande, och riktar sig till målgruppen som uppskattar kvalitet i uttrycket. Med stora aptitretande bilder vrids matens tilltal helt upp i den nya designen. Samtidigt säkerställer den helt nya menystrukturen och ett smart sticky filter en förbättrad användarupplevelse över hela hemsidan.

Framgång i samspelet mellan element

Den nya hemsidan för Skagenfood byggdes headless ovanpå en befintlig Umbraco-plattform, och fronten är gjord som ett SPA (Single Page Application) i de två ramverken Vue.js och Nuxt.js. Detta innebär maximalt fokus på prestanda och användarupplevelsen på hemsidan.

På innehållssidan har Skagenfoods starka önskan om tydliga USP:er nu uppfyllts. Dessutom har CTAerna nu blivit tydliga och optimerade och ett helt nytt kassaflöde har skapats. UX-optimerad design och front-end följdes av en massiv SEO-insats, och tillsammans har detta haft stor effekt på både trafik och konverteringar.

80 0 %

flera sessioner

125 0 %

fler nya användare

24 0 %

ökad omsättning

Måltidslådor

Ett av önskemålen från start var att stärka Skagenfoods position på marknaden för måltidslådor. Därför har denna del fått extra fokus, och universum har utökats med nya filtreringsmöjligheter, snygga bilder och ett tydligt galleri, där alla boxar presenteras med de viktigaste USP:erna. I måltidslådans universum hittar du både den klassiska med fisk, en ny vegetarisk låda och en heat & cook för den som gillar det.

Se det nya universum för måltidslådor

Skagenfood Appen 2.0 - från hybrid till native

Skagenfood har under många år levererat högkvalitativa måltidslådor och specialprodukter till danskar på prenumeration. Skagenfood har en vision att vara en levande del av danskarnas hälsosamma och goda matupplevelser, i ett koncept som är lättillgängligt, praktiskt och tidsbesparande. En viktig del av denna vision är Skagenfoods app. Härifrån kan kunderna sköta sitt abonnemang, inspireras till nya och spännande måltider, se deras kommande leveranser och läsa recepten kopplade till en given måltidslåda.

2020 lanserade Skagenfood tillsammans med Novicell sin App 2.0. En omarbetad app som inte bara är en förändring av tekniken, i en mer framtidssäker riktning. Men också en omtanke av hela användarupplevelsen. I nya App 2.0 ligger fokus på att skapa ett inspirerande universum som fortfarande är lika lätt att använda som fjärrkontrollen till en TV. Gamla Skagenfood 1.0 byggdes i en förlegad hybridteknik. Med bytet till App 2.0 har Skagenfood gått native, för att få både stabilitet, prestanda och inte minst möjligheten att i framtida versioner kunna integrera kraftfulla funktioner som använder hårdvaran på kundernas enheter.

"Novicell har varit mycket tillmötesgående och flexibla genom hela processen, vilket har krävt en del från alla parter, då moderniseringen av vår tidigare plattform krävde mycket utredningar och nyutveckling. Den förbättrade frontend som nu är i pipeline är vårt första steg tillsammans. Vi ser fram emot serien av kommande förbättringar som är precis runt hörnet som kommer att höja kundupplevelsen ytterligare."

 

Foto af Peter Bagge
Peter Bagge, Grundare & Direktör
Skagenfood

Justeringar och splittesting av inköpsflödet räknas på slutresultatet

Med hög konkurrens inom måltidslådor behövs ett starkt fokus på konverteringsoptimering: Få ut det bästa av era besökare. Genom löpande tester och analyser, samt fördjupad kunskap om affärs- och kundsegmenten, var målet att optimera köpflödet.
... Och det var så vi stoppade en potentiell årlig förlust på 2 miljoner DKK. i kundens livstidsvärde.

01

Heatmaps

Genom användningen av Mouseflow registrerades värmekartor för att få kvantitativ kunskap om användarbeteende. Den kvalitativa kunskapen kom från ett tidigare genomfört användartest. Samtidigt granskades beteendedata i Google Analytics och jämfördes med insikterna från Mouseflow. Dessa data kombinerades med en klassisk UX-genomgång av köpflödet. Och så hade vi en solid grund för optimeringsförslag som kunde öka konverteringsgraden.

02

Potentiell årlig förlust på 2 miljoner

De mindre ändringarna förbättrade konverteringsfrekvensen, men något stod fortfarande inte rätt till. Ett splittest initierades därför av de två befintliga kundingångarna: måltidslådguiden och den klassiska måltidslådöversikten. Splittestet visade vad vi fruktade: att Skagenfood tappade vinst på måltidslådguiden. Användarna av guiden genomförde i mindre utsträckning än de på måltidslådanöversikten. En prognos visade att de skulle gå miste om 2 miljoner årligen i kundlivstidsvärde om de fortsatte att driva trafik genom måltidslådguiden.

03

Optimering

Guiden stängdes därför av och från och med nu kommer fullt fokus att ligga på optimeringar för det klassiska köpflödet, där prestandan kan ökas. Så görs detta genom löpande beteendeanalyser och splittester. Det räcker därför inte att bara göra en snygg lösning. Som e-handelsföretag, B2C- eller B2B-webbplats måste man kontinuerligt följa upp prestanda, leta efter förbättringsmöjligheter och testa dessa för att säkerställa att verksamheten löper optimalt.

Exempel: heatmaps från Skagenfood.

Användarna är mycket intresserade av att se måltidsbilderna, men samtidigt också av att se alla tillgängliga måltidslådor, filtrera och utforska sig själva och inte bara se de som rekommenderas av guiden.

Skagenfood Iphone Heatmap

Vill ni veta mer om lösningen och hur en ny design kan förbättra ert resultat? Så kontakta gärna oss.