Ungfritid.no
Redesign av nettside for mobil og desktop
Redesign av nettsiden ungfritid.no, som driftes av Tietoevry Create. Hovedmålet med oppgaven var å forbedre brukervennligheten av nettsiden, vi har gjennom en designprosess utarbeidet potensielle skisser for forbedringer av nettsiden, med utgangspunkt i mobilbrukere.
Disse skissene ble videreutviklet og testet i samarbeid med brukere for å sikre optimal brukeropplevelse.
Mine ansvarsområder
-
Brukertesting
-
Intervjuer
-
Prototyping
-
Tilgjengelighetsansvarlig
Prosess
Forskningsspørsmålene våre gikk i hovedsak ut på å gjøre informasjon tydeligere, skape et mer intuitivt navigasjonssystem, og gjøre siden mer spennende og engasjerende for brukerne.
Vår løsning svarer i stor grad på dette. Hierarkiet av informasjon er mer logisk, og vi har lagt opp til at brukerne skal kunne finne fram til de de leter etter med færre trykk enn dagens løsning har.
Valgene våre av farger, fonter og generell visuell utforming er gjort med tanke på primærbrukerne som er barn og unge i målgruppen, og deres foresatte som melder dem på aktivitetene. Det visuelle skal gjenspeile brukergruppen, inspirere til bruk og vekke interesse hos brukeren.
Vi har også tatt i bruk GOV.UK sine accessibility posters i prosessen for å guide oss når vi har vært usikre eller stått ovenfor designvalg. Posterne ble mye tatt i bruk, spesielt siden vi hadde personas som kan ha noen ekstra behov.
Personas
Personas ble utviklet utifra innsikt fra intervjuer med foreldre.
Vi valgte å gi personaene ekstra tilgjengelightesbehov slik at vi kan sikre
at løsningen vil bli tiljengelig for alle brukere.
Vi gikk ut fra mobile-first-prinsippet og testet ut mange forskjellige versjoner av potensiell layout.
Vi jobbet særlig med hvordan filterfunksjonen skulle se ut.
Filterfunksjonen på den gamle løsningen var et stort problemområde. Filterknappen hadde kontrastproblemer, det var litt rotete og manglet visse funksjoner.
Vi jobbet mye med hvordan filterknappen skulle fungere og prøvde tidlig ut en løsning hvor knappen er nederst på siden slik at den er i rekkevidde for tommelen.
Dette var noe vi fikk svært god tilbakemelding på, og dermed tok videre med i løsningen.
Metode
Bildet over viser hele designprosessen.
Noen metoder som er verdt å nevne er at vi brukte innsikten fra intervjuene til å lage How Might We spørsmål som tydeliggjorde hva problemstillingen vår i dybden gikk ut på.
MoSCoW metoden ble brukt til å lage ett nytt sitemap. Vi gjorde flere runder med MoSCoW før vi endte opp med ett ferdig sitemap. Denne metoden fungerte veldig bra siden et av hovedproblemene med det gamle sitemapet var flere sider ble gjemt bak mange klikk.
Affinity mapping ble gjort i flere steg av prosessen, både til resultater av intervju, resultater av brukertestinger og for å finne ut hvilke kategorier vi ønsket å ha med i filtermenyen.
Det ble tatt høyde for vedlikeholdbarhet ved å holde nettsiden enkel, den ble tilrettelagt for funksjonsnedsettelser ved å studere WCAG-retningslinjene for offentlige instanser.
Oppgaven viser en betydelig forbedring av brukervennligheten på nettsiden, med bedre navigasjon, raskere innlastingstid og et mer intuitivt design. Videre har fokus på universelt design ført til økt tilgjengelighet for alle brukere.
Resultat
Resultatet
Over har jeg valgt å vise fire mockups av resultatet. Den første viser hovedsiden, nummer to viser filtermenyen, nummer tre viser søkeresultatet scrollet litt ned og den siste viser søkeresultat på mulige støtteordninger.
Under kan du se et utvalg av sidene og funksjonene i sin helhet.
Jeg har valgt å vise dette slik at du kan få se alle funksjonene.
Vi har også laget en versjon som er optimalisert for laptop. her har vi valgt å bruke en navigasjonsbar isteden for en hamburgermeny og flyttet litt rundt på ting slik at det passer bedre til formatet.
Vi ble veldig fornøyde med resultatet og dette var et veldig lærerikt og gøy prosjekt for min del
Scenario mobile:
Randi
Scenario desktop:
Eik
