top of page
Screen Shot 2023-01-12 at 16.52.00.png

Prosjektarbeid: Hjult

Hjult er en app laget i et skole­prosjekt hvor jeg og en gruppe med­studenter fikk i oppgave å bruke data fra Meteorologisk institutt til å lage en app i Android ­Studio. ­Gjennom prosjektet fikk jeg erfaring med flere sentrale verktøy og metoder for design, og innsikt i hvordan det er å jobbe med en større prosess på et tverrfaglig team. ­Prosjektet gikk over 12 uker våren 2022.

Sentrale erfaringer
Screen Shot 2023-01-17 at 15.21.36.png
INNSIKT

Datainnsamling, evaluering, observasjon, intervju, brukertesting

Screen Shot 2023-01-17 at 15.22.22.png
KONSEPT

Analyser, kravhåndtering  idégenerering og konseptutvikling

Screen Shot 2023-01-17 at 15.22.30.png
VERKTØY

Smidig, Trello, Figma, Android studio, Material, Universell utforming

Prosess

Selv om man i Norge for det meste unnslipper smog, er svevestøv fra vedfyring og biltrafikk et omfattende problem også her til lands. I prosjektet designet vi en sykkelapp som viser luftkvalitet for sykkelruter. Valg av målgruppe falt på personer som bor og jobber i Oslo, og som minimum halve året sykler til og fra jobb 3 eller flere dager i uken.

 

Vi benyttet flere elementer fra smidige prosessverktøy, blant annet retrospektive møter, standups og sprinter. Å få arbeide iterativt og inkrementelt med prosess­verktøy som Scrum og Kanban har tydeliggjort for meg hvordan en smidig prosess kan hjelpe med å kartlegge fremdrift  og løse faglige utfordringer. Overordnede aktiviteter i hver iterasjon er vist i tidslinjen nedenfor.

TidslinjeKOLONFIKSA.png
Brukerundersøkelser

For å bli kjent med målgruppen og konkretisere problem­området gjennomførte vi intervjuer med brukere som sykler til og fra jobb. Hver av oss rekrutterte en person hver i nær omgangskrets som passet målgruppa som vi intervjuet, i tillegg til at gruppa rekrutterte ytterligere to brukere fra målgruppen som ble intervjuet i tillegg.

Ved oppstart lagde vi to personaer for å kartlegge kjennetegn og mønstre hos brukerne. Disse ble gjennomført som en teamøvelse der vi gjorde antakelser om brukerne med utgangspunkt i dataen vi hadde samlet inn.

Screen Shot 2022-12-12 at 17.32.35.png
Screen Shot 2022-12-12 at 17.33.21.png

Vi lagde også to scenarier som fremstilte hvordan personaene kan interagere med ­løsningen vår. Begge deler ble brukt til å inspirere oss i videre arbeid med ­funksjonaliten, for å skildre mulige problemstillinger og personlig­gjøre brukssituasjonen.

Screen Shot 2022-12-12 at 17.33.09.png
Screen Shot 2022-12-12 at 17.32.46.png
Analyse

I neste iterasjon analyserte vi brukerundersøkelsene ved å ­g­ruppere funnene i klynger, og kartlegge mulige produkt­spesifikasjoner og brukerbehov. Vi satte oss også inn i eksisterende reiseapper for å undersøke hva slags designmetaforer, oppgaveallokering og ­funksjonalitet som allerede finnes.

Screen Shot 2022-12-12 at 18.04_edited.j

Hovedfunn fra analysen

Kravhåndtering

Basert på dataene vi nå hadde for hånden, utarbeidet vi ­konkrete ­konsepter som appen skulle romme og spesifiserte krav til appen.

Screen Shot 2023-01-06 at 15.28.53.png
16. mars Kravspec-tankekart (1).png

Utforming av kravspesifikasjoner ble gjort sammen, på tavle og skjerm.

I hver iterasjon ble kravene vurdert, validert og endret i tråd med designvalg. De ikke-­funksjonelle kravene tok utgangs­punkt i vårt ønske om å lage en app som samsvarer med Web Content ­Accessibility Guidelines (WCAG).

Screen Shot 2023-01-10 at 18.25.18.png

Funksjonelle krav

Screen Shot 2023-01-10 at 18.24.58.png

Ikke-funksjonelle krav

Lavoppløselige prototyper

Fokus i de lavoppløselige prototypene lå på hva brukerne våre skal kunne oppnå med ­produktet, og hvilke ­konsepter som er nødvendig for å forstå interaksjonen. Ved bruk og kast-prototyper laget på tavla visualiserte og ­diskuterte vi tallrike alternativer for ­­konsepter og samspill.

30. mars - Standup og wireframes 2.png
25. april 3.png
14. mars.png

Bruk og kast-prototyper

Høyoppløselige prototyper
30. mars - Standup og wireframes.png

Jeg og de andre designstudentene på gruppen som prototyper i Figma

Før arbeidet med høyoppløselige prototyper ­hadde vi en gjennom­gang av Googles Material design-­manual  sammen på gruppa, hvor vi utforsket f.eks. hvilke virke­midler og symboler som kan tydeliggjøre funksjoner. Skissene ble så videreutviklet til interaktive wireframes i Figma.

Screen Shot 2022-12-19 at 15.55.05.png
Evaluering

I evalueringen inkluderte vi én bruker som var med i data­­­inn­samlingen i andre  ­iterasjon, og én som var ukjent med ­løsningen. ​Disse brukerne hjalp oss med å avdekke overflødige elementer og konflikter innad i funksjonaliteten. ­Evalueringene ble gjennomført ved ­observasjon­ ­i kontrollerte omgivelser med think aloud som teknikk, etter­fulgt av et åpent intervju. Basert på tilbakemeldingene fra brukerne endte vi med to godt synlige bokser for henholdsvis reisen til og fra jobb så bruker enkelt kan se hva slags vær det er meldt på spesifikke pendlertidspunkt. 

Kopi av 20220512_205422.jpg
20. april.png

Skisser på tavla etter evaluering med bruker

Kartet med sykkelrute opplevdes uvesentlig for brukerne ettersom de allerede kjenner veien til jobb. ­Derfor ble luftkvalitet-informasjonen flyttet over til kartfanen i appen. Dette styrket kartets verdi og snevret appen inn på svevestøv. Lokale ­variasjoner i svevestøvforekomster gjorde ­generelle varsler lite effektive, så vi inkluderte heller et heatmap for å gi oversikt over lokale forhold slik at brukeren kan avgjøre hvorvidt man ønsker å sykle en omvei for å unngå svevestøv.

Screen Shot 2023-01-10 at 13.13.33.png
Screen Shot 2023-01-10 at 13.13.41.png
Screen Shot 2023-01-11 at 13.21.31.png

Nye wireframes basert på evaluering med bruker

De viktigste funksjonene ble implementert i Android Studio først, mens vi fobedret samspillet mellom de ulike delene av appen i Figma. Siste runde med wireframes ble slik:

Ferdigstilling av applikasjon

Mot slutten oppdaterte vi flyt og utseende i appen og la inn luft­kvalitet i kartet, samt onboarding­sekvens. Vi arbeidet også med å gjøre grensesnittet ­kom­­patibelt med WCAG.

SvevestovWCAG-02.png
SvevestovWCAG-03.png
SvevestovWCAG-01.png
SvevestovWCAG-04.png

Fargevalg medutgangspunkt i WCAG-kravene, for å sikre kontrast og lesbarhet.

Sluttveis gjennom­førte vi og en ­summativ ­evaluering av Hjult med en ny bruker i målgruppen, ved bruk think aloud og observasjon, etterfulgt av et u­strukturert intervju. Selv om ingen grove feil ble oppdaget, rakk vi kun å gjennomføre evalueringen med én bruker, noe som svekket validiteten og reliabliteten ved evalueringen.

Bildet nedenfor viser skjermbilder av "Hjult"-appen vår, som kjøres på Android.

Screen Shot 2023-01-11 at 17.12.50.png
Refleksjon

Det at vi la betraktelig arbeid i å utforme høyoppløselige, inter­aktive prototyper gjorde at vi hadde en god forståelse av hva som skulle implementeres. Men å komme sent i gang med implementasjon kan også medføre betydelige kostnader, for eksempel hvis tekniske begrensninger hindrer ideer som var enkelt å sette opp i design-prototypene. Vi var derfor klar over at det kunne dukke opp utfordringer som ville påvirke tiden vi hadde til rådighet og appen i seg selv, ettersom vi brukte en del tid på prototyping først. I ­prosjektet lærte jeg at dette er en balansegang. Å validere hypoteser tidlig, og ikke hoppe rett på implementasjon, kan også føre til positive effekter ved at man kan iterere på ideer uten å bruke mye tid på implementasjon. I vårt tilfelle førte rapportskriving og små utfordringer med den tekniske implementasjonen til at vi på slutten måtte prioritere noen av kravene over andre.

bottom of page