Universell utforming møter gamification

Oppdragsgiver

Fagskolen Kristiania

Ansvarsområder

Research, wireframing og prototyping av progresjonsskjerm, hjemskjerm, onboarding og login/signup

Team

Emily Tvervåg (UX-designer)

Fanny Andrine Ingram (UX-designer)

Tone Kristin Langaunet (UX-designer)

Kim Bui (UX-designer)

Selma Johnsen (UX-designer)

Verktøy

Figma, FigJam, Scrum, Trello, Kanban, Google Docs

Prosjektet ble gjennomført over fire uker som en del av temaet Designsystem, prosess og prosjektledelse ved Fagskolen Kristiania. Oppgaven gikk ut på å utvikle en hi-fi prototype for et digitalt produkt med fokus på universell utforming, designrammeverk og bruk av arbeidsbesparende verktøy.

I tillegg til selve løsningen skulle vi utarbeide et komplett designsystem og designe både lys og mørk versjon av grensesnittet. Vi jobbet etter Scrum-metodikk i korte sprinter, med definerte roller, standups og leveranser, slik at vi fikk praktisk erfaring med smidig prosjektarbeid samtidig som vi utviklet et læringsverktøy om nettopp Scrum-prosessen.

Hvordan en Scrum-prosess kan se ut. Kilde:  Nimblework - Scrum Methodology

ScrumSnake ble utviklet som en del av emnet Designsystem, prosess og prosjektledelse ved Fagskolen Kristiania. I et team på seks interaksjonsdesignstudenter jobbet vi med å designe en universelt utformet læringsplattform som introduserer studenter for agile metoder gjennom spill og visuell progresjon.

Prosjektet kombinerte elementer fra gamification med prinsipper for universell utforming, og hadde som mål å gjøre læring om Scrum og Kanban mer engasjerende, forståelig og tilgjengelig for alle.

Første planleggingsmøte for ScrumSnake, der vi diskuterte roller, retning og hvordan vi kunne kombinere læring og spillmekanismer.

Utgangspunktet for oppgaven var å utforske hvordan spillmekanismer og designprinsipper kan bidra til økt læring og motivasjon. Vi ønsket å finne en balanse mellom lek og faglighet, der progresjon og belønning støtter forståelse fremfor konkurranse.

Gjennom prosjektet lærte vi hvordan universell utforming og gamification kan fungere sammen for å skape inkluderende og engasjerende læringsopplevelser.

Vi startet prosjektet med å kartlegge litteratur og praksis knyttet til agile metoder og læringsdesign. Målet var å forstå hvordan prinsipper fra Scrum og Kanban kunne oversettes til et digitalt læringsformat.

Parallelt undersøkte vi forskning på gamification for å vurdere både potensialet og fallgruvene, spesielt risikoen for at spillmekanismer kan overskygge læringsmål.

Vi gjennomførte også en konkurranseanalyse av eksisterende plattformer som kombinerer læring og spill, og identifiserte manglende fokus på universell utforming.

Til slutt definerte vi en målgruppe bestående av studenter og nybegynnere i agile prosesser, med behov for en mer intuitiv og motiverende inngang til metodikken. Vi brukte FigJam aktivt, og etter hvert ble tavlen omfattende med mange ideer, prosesskart og notater.

Inspirasjonen til ScrumSnake oppsto fra en illustrasjon som viste en buktende løype for å forklare Scrum-prosessen. Formen minnet om bevegelsen i det klassiske spillet Snake, og idéen kom om å bruke dette som et kart for læringsprogresjon.

Som i Snake øker slangen i lengde når brukeren gjør progresjon. Hvert “eple” er knyttet til et tema innen Scrum, Kanban eller Waterfall, og visualiserer fremdriften i læringen.

Denne metaforen skapte både en følelse av nostalgi og et mer engasjerende visuelt rammeverk for læring, der fremdrift blir noe brukeren faktisk ser og føler.

Denne illustrasjonen inspirerte idéen om en nedadgående progresjonsskjerm i ScrumSnake.

Den ferdige progresjonskomponenten visualiserer hvordan spilleren nærmer seg mål, og gjør fremdriften mer konkret og motiverende for brukeren.

Jeg hadde hovedansvar for designet av hjemskjermen og flere andre sider. Dette inkluderte wireframing, layout-oppbygging og high-fidelity prototyping basert på prosjektets komponentbibliotek.

Arbeidet krevde tett samarbeid med gruppemedlemmene som utviklet designsystemet, slik at vi kunne justere komponenter og layout parallelt. Dette gjorde at vi raskt kunne teste og justere helheten, og samtidig sikre at de visuelle prinsippene for universell utforming ble ivaretatt gjennom hele grensesnittet.

Hjem-skjermen til ScrumSnake føles leken med en tydelig CTA-knapp, og slangen hinter til spillets utforming.

Login-skjermen i lys og mørk modus. Fargene er testet for å sørge for god nok kontrast i begge moduser

Sign-up-skjermen i lys og mørk modus. Passordfeltet har tydelig feilhåndtering som viser hva som må være med for å bli godkjent.

Onboarding-skjermene i spillet bruker tydelige illustrasjoner og forklarende tekst som hjelper brukeren å komme i gang.

Progresjonen i spillet måles i hvor lang slangen er. Når alle moduler er fullført, er slangen fullt utvokst og spillet gjennomført.

Prosjektet resulterte i et helhetlig konsept for et universelt utformet læringsspill som formidler agile metoder på en engasjerende måte.

ScrumSnake demonstrerte hvordan prinsipper fra spilldesign kan brukes til å visualisere progresjon og fremme motivasjon, uten at det går på bekostning av læringsfokus eller tilgjengelighet.

Gjennom utviklingen av både designsystem, hi-fi prototype og to fargetemaer fikk jeg erfare hvordan universell utforming må integreres i hvert ledd, i alt fra typografi og kontrast til interaksjon og navigasjon.

Arbeidet ga meg også verdifull erfaring med Scrum-metodikk i praksis. Jeg opplevde hvordan korte sprinter, tydelige roller og kontinuerlige leveranser skaper fremdrift, men også hvor krevende det kan være å balansere struktur og kreativitet i en designprosess.

Prosjektet styrket min forståelse av hvordan tilgjengelighet, spillmekanismer og læring kan møtes i samme løsning, og hvor viktig det er å teste og justere slik at brukeropplevelsen alltid forblir både inkluderende og meningsfull.