Unfold lager julekalender for Spenn

Design
Produktutvikling
Hampus Borgos
CTO
Fredrik Brudeseth
Product Lead
09. desember 2024
Strawberry og Norwegian sin nye lojalitetsvaluta er live og vi har designet og utviklet årets julekalender i Spenn-appen, på kun 50 dager.
Julekalenderen bygger videre på fjorårets suksess, og er et betydelig fremskritt både visuelt, funksjonelt og teknologisk. Kalenderen er designet med utgangspunkt i Spenns merkevareprofil og -konsept for å støtte lanseringen og aktivere brukere over hele Norden. Plattformen inneholder seks unike og egenutviklede spill, som alle er tilpasset temaet for hver enkelt luke.

Egenutviklede spill

Den største endringen i årets kalender er at vi har valgt å utvikle alle spillene selv, fremfor å bruke en tredjepartsløsning som f.eks. Playable. Fjorårets erfaring viste oss begrensningene med dette, som manglende fleksibilitet til å tilpasse assets og utfordringer med kommunikasjon via iframes. Dette førte til unødvendig merarbeid uten å levere tilsvarende verdi for brukerne.
I år har produktteamet derfor skapt en rekke unike spill fra bunnen av. Prosessen startet med å utvikle ulike prototyper til spill, som vi så valgte ut for ferdigstillelse. Det vil si at vi fokuserte på å få ett spill klart til lansering i løpet av en uke, og gikk videre til neste spill uken etter.
a phone screen shows a screenshot of a spent app
Spillene er integrert i Spenn-appen
Spillene er konfigurert ved hjelp av en enkel JSON-struktur, som gjør det mulig å styre poenggrenser, bildebruk, copy og andre spesifikke funksjoner for hvert enkelt spill. Denne strukturen gjør det mulig å gjenbruke mange funksjoner på tvers av spill, men likevel skape helt forskjellige opplevelser på toppen.
Samlet gjorde dette oss i stand til i løpet av kort tid å utvikle en julekalender med 24 forskjellige spill, på fem ulike språk, helt uten hjelp av tredjepartsløsninger.
a bunch of phone screens with the number 24 on them

Enkel backoffice

For å støtte julekalenderen har vi utviklet en ny backoffice-løsning. Denne gjør det mulig for Spenn å trekke vinnere daglig, og gir oversikt over hvor mange poeng hver spiller har samlet gjennom hele perioden.
Spenn har også tilgang til omfattende analyser for å kunne tracke alt som foregår i julekalenderen. I stedet for å sette opp dette fra scratch, har vi integrert Posthog som en del av backoffice for løsningen, som har spart oss for mye tid.

Teknologi og stabilitet

Techstacken for løsningen består av Next.js 15 og React 19, som vi har brukt både for spillene (“playfront”) og backoffice-løsningen.
En graf som viser belasting på databasen
Selv med hundretusenvis av spillere er det langt å gå på databasene i Neon. Det er tydelig at morgenrushet er tiden for å spille mobilspill!
Spillplattformen hostes på Vercel, med en Postgres-database driftet på Neon. Det redaksjonelle innholdet styres fra Contentful, som vi henter lynraskt ved å bruke caching fra plattformen.
Resultatet er en svært stabil løsning som er klar for belastningen fra hundretusenvis av brukere uten problemer. Den moderne, serverless-plattformen gir store fordeler her når det gjelder skalerbarhet og pålitelighet.
Som en helt ny merkevare er det viktig for oss å skape opplevelser som engasjerer og bygger relasjoner til brukerne våre. Årets julekalender er et godt eksempel på hvordan vi kan kombinere kreativitet og teknologi for å levere noe unikt som styrker Spenns posisjon i markedet samtidig som vi løfter frem partnerne våre. Vi er stolte over resultatet og det gode samarbeidet med Unfold.
Ida Louise Kristiansen - Markedssjef i Spenn

Konsept og design

Spenn ønsket seg en kalender som kombinerte Strawberrys hotellfasader med Norwegians flydestinasjoner. Vår oppgave var å designe alle spillene, navigasjon og flyt for hele kalenderen. Innenfor Spenn sin design profil hadde vi fritt spillerom til å lage et eget univers for kalenderen.
Sammen med Spenn kom vi tidlig opp med flere alternative forslag til design for å kunne ta raske beslutninger for den visuelle retningen. Deretter ble alle elementer tegnet opp og systematisert i et visuelt bibliotek i Figma ved hjelp av tokens og variables.

a display large display medium display small display icons and the number 24

Folk og prosess

Teknologi- og designvalgene vi har tatt har selvfølgelig vært avgjørende for å lykkes, men viktigst av alt er folka som har jobbet med julekalenderen.
Et dyktig produktteam med erfarne fagpersoner som forstår oppgaven og jobber raskt og effektivt sammen. Og et godt samarbeid mellom teamet og Spenn som har vært avgjørende for å ta raske beslutninger og holde på fremdriften.
Vi gleder oss allerede til neste år!

Want to know more?

Get in touch with
Hampus
or
Fredrik