Redesign av Elevtjenesten-appen
Et av mine første UX prosjekter som Designer for Kopling AS, gikk ut på å redesigne Elevtjenesten-appen. Elevtjenesten er en app for elever, lærlinger og andre unge under 25 år. Her kan man chatte med helsesykepleier, rådgiver, karriereveileder og andre – alt samlet på ett sted for å sikre kort vei fra spørsmål til svar. Les mer om Elevtjenesten her.
I dette prosjektet hadde jeg hovedansvaret for designprosessen og hadde ukentlig dialog med senior designer for tilbakemeldinger og veiledning.
Rammeverk
I dette prosjektet er design rammeverket Double Diamond tatt i bruk. Fasene rammeverket baserer seg på er – oppdage, definere, utvikle og levere.
Sitemap
Tilbakemeldinger
Deskresearch
02 Definere
Videre sorterte jeg innsikten i et Affinity Diagram. Funnene ble sortert og kategorisert basert på innholdet. Dette synliggjorde hvilke hovedområder som bør fokuseres på – redusere antall klikk og undersider, forbedre navigasjonen, sørge for at ordlyd på funksjoner og kategorier er forståelig, høyere konverteringsrate gjennom onboardingen og tilrettelegge for en skalerbar landingsside fylt med innhold.
03 Utvikle
Deretter tegnet jeg enkle skisser for å eksprimentere med layout, navigasjon og designuttrykk. Dette tok jeg videre inn i Adobe XD, hvor det ble tilført farger, ikoner og typografi. Jeg lagde mange ulike varianter, testet og fikk tilbakemeldinger underveis. Vi fasiliterte en workshop hvor vi samlet hele Kopling-teamet med designere, utviklere, kunder og interessenter for å idemyldre sammen.
Resultatene av workshopen var et bredt utvalg tilbakemeldinger og ideer. Her kom vi også opp med mange ideer for fremtidig vidreutvikkling av appen, som kan være nyttig å begynne å tilrettelegge for allerede ved denne redesignen.
04 Levere
Jeg prototypet hele designforslaget av appen i Adobe XD, samt tilhørende designssystem. Prototypen ble testet i flere runder med ulike brukere – både kollegaer og brukere fra målgruppen. Testingen bestod av oppgaver brukeren skulle gjennomføre i prototypen, og ble vurdert etter hvordan de klarte å gjennomføre dem. Dette var en iterativ fase hvor designet ble justert etter tilbakemeldinger og observasjoner.
Før og etter – Navigasjon
Hambugermenyen som opprinnelig ble bruk, ble byttet ut med en navigasjonsbar nederst på skjermen. Denne er enklere å nå med tommelen og reduserer antall klikk. Før var appens landingsside "Meldinger-siden", mens nå er den byttet ut med en egen innholdsside kalt "Dine tjenester". Denne siden består av relevante artikler og kan ved videre utvikling bygges på med tjenester som kantinekort, elevkort osv.
Subnavigasjonen på siden over hjelpere, har nytt design og er flyttett til bunnen av skjermen for at den enklere kan nås med tommelen. Denne plasseringen gjør også at den tar opp mindre plass på skjermen. Listen over nasjonale tjenester måtte tilrettelegges for oppskalering (listen inneholder nå over 50 hjelpetjenester). Hver hjelpetjeneste har fått et eget kort med logo, navn, relevante tags og ikoner som viser om tjenesten har chat eller telefonlinje man kan henvende seg på.
Før og etter – Hjelpere siden
Siden over hjelpere er oppdatert med tydelige knapper tilhørende hver hjelper. I stedet for at det åpnes en ny side når man trykker på en hjelper, kommer det nå en liten overlay som er enklere å nå med tommelen. Start dialog knappene har byttet plass slik at knappen for å starte dialog anonymt, er litt vanskeligere å nå. Dette er fordi vi ønsker at de som tar kontakt, helst starter dialog med eget navn, slik at det er enklere å hjelpe dem.
Designsystemet
Designsystemet består av en rekke elementer som er utformet for Elevtjenesten-appen. Elementene er enkelt utformet og består som regel av hvit bakgrunnsfarge, typografi og litt oransje farge. Appen er fylt av mye ulikt innhold, som presenteres gjennom elementene, og det var derfor viktig å finne en balanse mellom elvetjenestens visuelle uttrykk og andre eksterne loger (feks. hjelpetjenester) som skal fremstilles.
Mockups
På bildet vises mockups av de viktigste sidene i appen og hvordan de henger sammen. Den nye landingssiden er levende og fylt med innhold som er relevant for elevene.
Klikk på videoen over for å se en gjennomgang av prototypen, eller last ned Elevtjenesten i App Store eller Google Play, og sjekk ut appen på egenhand!
05 Resultater
Redesignet av Elevtjenesten-appen har resultert i et mer brukervennlig grensesnitt med færre klikk, forbedret navigasjon og en ny, innholdsrik landingsside. Veien til dialog med en hjelper er nå kortere, med snarvei på meldinger-siden. Den oppdaterte landingssiden gjør appen mer innholdsrik og gir unge enkel tilgang til relevant innhold, samtidig som plattformen er klar for videre utvidelse med flere tjenester.
Kontakt meg!
Har du spørsmål, eller kanskje du så noe spennende vi kan prate om – kontakt meg!
E-post: emmamatheasimensen@gmail.com
Telefon: +47 900 31 603
