Prosjektoppgave Interaksjonsdesign og brukervennlighet 2016

Transkript

1 Prosjektoppgave Interaksjonsdesign og brukervennlighet 2016 Eksamensnavn: Interaksjonsdesign og brukervennlighet Studieprogramkode: Interaksjon Tittel på oppgave: Parkinson Studiested: IGM, Oslo Studentnummer: , Innleveringsdato: 18.mai 2016

2 Innhold Innledning... 2 Analyse/Innsiktsfasen... 2 Målgrupper for parkinson.no... 2 Målsetting for nettstedet... 2 Brukerundersøkelser... 2 Viktigste brukeroppgaver... 3 Konsept... 3 Farger... 3 Bilde i toppen... 4 Kanaler... 4 Kjernemodellen... 4 Tidlige versjoner av interaksjonsdesignet... 5 Prototyping... 5 På papir først... 5 Design av moduler... 5 Innhold på mobil... 6 UX Designprinsipper i prototypen - Styleguide... 6 God lesbarhet... 6 Typografisk hierarki... 7 Bruk av grid... 7 Skriving av tekst... 8 Veien frem til en ferdig prototype... 8 Forside testing og forbedring... 8 Alle sidene i prototypen testing... 9 Ferdig prototype Navigasjonsstruktur Sidene i prototypen Rådgivning Oppsummering Fordeling av oppgaver Hva vi skulle gjort annerledes Studentnummer: ,

3 Innledning I denne rapporten beskriver vi hvordan vi har gått frem for å lage en prototype for nettsiden til Parkinsonforbundet. Vi beskriver prosessen vi har vært igjennom fra analysefasen med brukerintervju og hvordan vi kom frem til de viktigste brukeroppgavene. Videre hvordan vi har jobbet frem forslag til prototype ved å bruke gode UX designprinsipper, utført tester på disse og gjort forbedringer til vi til slutt endte opp med en brukervennlig prototype med god interaksjonsdesign, se link i Invisionapp.com; Analyse/Innsiktsfasen Vi har tatt utgangspunkt i Parkinsonforbundets digitale strategi, samt utført noen kvalitative brukerundersøkelser i form av dybdeintervju for å kartlegge brukerbehovene. Parkinsonsforbundets digitale strategi viser målene de ønsker å jobbe mot, og hvilke målgrupper som er viktige for dem. Dette ligger i oppgavebeskrivelsen. Målgrupper for parkinson.no Hovedmålgruppen for Parkinsonforbundet nettside er parkinsonpasienter og deres pårørende, samt helsepersonell. Sykdommen er mest vanlig i alderen 55 og oppover, men kan også ramme yngre. Mange eldre parkinsonpasienter har ikke god kjennskap til PC og smarttelefon. Det vil derfor være de parkinsonpasientene som er vant til å være aktiv på internett som er i målgruppen for nettstedet. Målsetting for nettstedet Parkinsonforbundet informerte om sin nåværende webløsning, og vi fikk en beskrivelse av deres digitale kanalstrategi. Vi har satt opp et flytkart for å presentere hvordan vi ønsker å imøtegå forbundets digitale strategi (Vedlegg 1). Brukerundersøkelser I Innsikts/Analysefasen har vi benyttet kvalitative brukerundersøkelser i form av dybdeintervju/observasjon og utført dette (Samling1_Dag3_UXResearch_Kari_2015_handout.pdf, s 12). Dette ble brukt til å avdekke potensielle problemer, samt innspill til hva som er viktig for brukerne. Vi har ikke utført egne kvantitative undersøkelser, men har sett på statistikk fra Parkinsontelefonen og statistikk på de 100 mest besøkte sidene. Studentnummer: ,

4 Ved planlegging av dybdeintervju satte vi opp spørsmål og hypoteser som vi ønsket å teste ut ift hva vi trodde var problemområder på parkinson.no og utførte intervjuene på best mulig måte (Hamnes, Kari (2012) 10 tips til gode brukerintervjuer Blogpost) Etter å ha foretatt observasjon/intervju med 2 personer utførte vi en analyse av informasjonen vi hadde funnet. Dette ga oss grunnlag til å si noe om problemområder på nettstedet, samt hva som er viktig for brukerne (Vedlegg 2). Viktigste brukeroppgaver Ut fra bedriftens strategi, dybdeintervju og statistikk vil dette være de viktigste brukeroppgavene: 1. Få kunnskap om en bedre hverdag 2. Kontakt helsepersonell og andre med parkinson eller pårørende (likepersoner) 3. Få kunnskap om Parkinson 4. Få kunnskap om rettigheter 5. Finne informasjon om arrangementer 6. Støtt oss, som inkluderer Bli medlem og Gi en gave Konsept Vi ønsker å lage et nettsted for Parkinsonforbundet som øker kunnskapen og gir brukerne trygghet og omsorg. Parkinsonforbundet har laget filmer som belyser hverdagen til pasienter med Parkinson. Forbundet spiller mye på humor i disse filmene, og vi har valgt å videreformidle dette. Vi ønsker at sidene skal være vennlige og folkelige, samtidig er det viktig å framstå som seriøse. Farger Vi har satt sammen en fargepaleet som relaterer seg til vårt møte med en godt voksen dame med Parkinson. Hun fokuserte på farger og humor i livet, og brukte farger aktivt for å holde hodet klart og hjertet varmt. Fargene vi har valgt Limegrønn er brukt på hovedmenyen og på boksen til en bedre hverdag. Limegrønn er en syrlig, men positiv som gir assosiasjoner til vår, vekst og natur. Orange er brukt i boksene «Støtt oss» for å gi en stopp effekt, slik at øyet ledes mot den. Fargen orange er forbundet med varme, glede og energi, og den har ingen negative aspekter knyttet til seg. (Teigen, 1994, s 59) Studentnummer: ,

5 Lilla er brukt på overskrifter og på bokser for valg i nedtrekksmenyer. Dette for å skape kontrast, men samtidig en treklang mellom orange, limegrønn og lilla, i Gothes fargesirkel. (Teigen, 1994, s 76-77) Lyseblå er brukt på skjema og footer. Blå er en farge som er konservativ og gir assosiasjoner om himmel og ro. Vi ønsker at «Innmeldingsskjemaet» skal fremstå som lett, luftig, enkelt og trygt, mens footern inneholder en oppsummering av meny og kontakt. (Teigen 1994, s 63) Grønt er brukt på linken ut til andre sider. Dette fordi, fargen symbolisere vekst. Grønn er en farge som i psykologien forbindes med mental og fysisk avslapning, og skal dermed være stimulerende mot anspenthet og nervøsitet. Mer kunnskap gir trygghet og et bedre liv. Konklusjon på valget av farger på nettstedet er derfor en blanding av liv og lære. Sykdommen fremstår som mørk og ganske uforutsigbar. Vi ønsker at parkinson.no skal gi inspirasjon til et godt liv, på tross av sykdommen. (Vedlegg 3) Bilde i toppen Bildet illustrerer varme, omtanke og medfølelse. Vi har valgt å bruke bare ett bilde for å redusere arbeidsmengde for webansvarlig. Kanaler Vi tenker at det er viktig å bruke flere kanaler for å nå ut til flest mulig parkinsonsyke og pårørende. Primært nettsiden, pluss Facebook og Youtube for å nå ut til flere, spesielt yngre, for å øke kunnskap om parkinson. Snap og Instagram er lite aktuelle, for de brukes mer av yngre personer enn de som er i målgruppa her. Youtube brukes som et sted å laste opp videoer. Vi har valgt å ha 2 linker på forsiden; en til en video på Youtube, samt en til aktuell sak på Facebook, disse sakene vil rullere. Kjernemodellen De viktigste brukeroppgavene som vi fant i analysefasen vil være utgangspunkt for kjernesidene på nettstedet. Vi har benyttet kjernemodellen for å finne kjerneinnhold på nettstedet og innhold på hver av kjernesidene (Aalen, Ida (2015) "The Core Model: Designing Inside Out for Better Results" Blogpost på A list apart ). Studentnummer: ,

6 Ved bruk av kjernemodellen fant vi veier inn til kjernesiden, hvilket innhold som må til for å nå bedriftens mål og løse brukerens oppgaver, samt hvor vi vil sende brukeren videre etter å ha løst oppgaven på kjernesiden. Vi har brukt Core page-ark (Samling 2-da2-kjernemodellen-ida.pdf, s 17) til å fylle ut informasjon om kjernesidene våre; Parkinsons sykdom, arrangementer, Bli medlem(skjema) og rådgivning (Vedlegg 4). Videre prioriterte vi kjerneelementer ved tenke hvor det var lurt å plassere elementene på en mobil skjerm (Samling 2-da2- kjernemodellen-ida.pdf, s 40) (Vedlegg 4 parkinson sykdom-mobil) Tidlige versjoner av interaksjonsdesignet Vår første ide var å lage en kjerneside for hvert av temaene i sykdommen, og lage en transportside med inngang til forskjellig innhold, som symptomer, sykdomsutvikling, behandling osv, samt kjerneside for symptomer (vedlegg 5). Etter hvert fant vi ut av det var bedre å lage en kjerneside som omhandler alt ved sykdommen, slik at brukerne kan finne alt på en side. I en tidlig fase tenkte vi at «Støtt oss» var viktig å ha med på forsiden, godt synlig øverst for å gi brukerne en rask mulighet til å bli medlem, gi gave og andre muligheter for å støtte Parkinsonforbundet (Vedlegg 5, transportside). Vi gikk bort fra dette fordi vi ville ha frem tydeligere hvor brukerne kan bli medlem og gi gave. La så inn valg for «Bli medlem» og «Gi gave» på forsiden, men flyttet det lenger ned. Prototyping Etter å ha bestemt innhold på forside og utvalgte kjernesider, samt tenkt over konseptet vi ønsket å frembringe, startet vi med prototyping. På papir først Vi startet med å bruke papir og gråblyant. Vi valgte å lage prototypen for desktop, og utformet derfor skisser for sidene (Vedlegg 6). Vi brukte papirskissene og la de inn i Invisionapp.com for å teste klikkbarhet og flyten mellom sidene. Design av moduler I det videre arbeidet med design av prototypen benyttet vi InDesign. Vi så på hvilke elementer som dannet rammene for resten av designet, generiske moduler som header, footer og innholdsområde (samling3-dag1-interaksjonsdesign-mdh.pdf, s 53) og videre på hvilke moduler som var unike. Vi har forsøkt å bygge opp nettstedet Studentnummer: ,

7 ved først og fremst å tenke gjennom og designe modulene som vi trenger på nettstedet, og ikke først og fremst tenkt på sidene vi skulle lage. (Frost, Brad (2013) "Atomic design". Blogpost) I denne fasen bygde vi opp et grid og satte opp en styleguide for å sikre et entydig design gjennom hele nettstedet (Vedlegg 7). Innhold på mobil Dette skal være en responsiv løsning, og lagde derfor en skisse for mobil, noe som hjalp oss å strukturere og prioritere innholdet enda bedre. Deretter lagde vi en prototype i InDesign for mobil, (Vedlegg 8, Mobil forside). Ved mobil visning vises innholdet fortløpende nedover, folk er vant til å skrolle og lete nedover for å finne det de ønsker. Menyen har vi gjemt på mobil, men ekspanderes ved å klikke på knappen MENY. Har valgt i skrive tekst på knappen i stedet for hamburgerikon ettersom ikonet ikke er kjent for alle. Har også hatt fokus på at knappene er store nok på mobil, at det er tydelig hva som kan trykkes på og at det er nok plass mellom elementene (Samling3-Dag2-Interaksjonsdesign-MDH.pdf, s 30). Har også laget en mobilversjon av kjernesiden om parkinsons sykdom, se (Vedlegg 8, Mobil kjerneside). Her vises kun overskriftene + noen få linjer tekst om hvert tema. Bruker kan klikke på overskrift for å ekspandere innhold og lese mer. Ved å klikke en gang til på overskrift der innhold er ekspandert, så kollapser innhold igjen. På denne måten får brukeren raskt oversikt over det totale innholdet på siden. UX Designprinsipper i prototypen - Styleguide For å kunne lage et bra interaksjonsdesign i prototypen har vi fulgt gode UX- og designprinsipper, (Samling2-Dag1-Brukervennlighet-Gjermund.pdf, s 57 og utover), og ut fra dette laget en styleguide som vi har brukt gjennom hele prototypen for å sikre et entydig design. God lesbarhet Kontrast For å kvalitetssikre at fargene vi har valgt, har god nok kontrast har vi brukt verktøyet Colour Contrast Analyser, Dette sikrer at vi følger kravene om universell utforming, WCAG Kontrast, Studentnummer: ,

8 Fonter Vi har valgt Verdana som font på nettstedet til Parkinson.no. Verdana er en sans-serif skrift, som er laget spesielt for dataskjermer, har god lesbarhet. Fonten er designet av Matthew Carter for Microsoft Den minste teksten på parkinson.no er brødsmulestien. Den er satt i minste anbefalte fontstørrelse, 16 px. Teksten er skrevet i 100 % sort for å gi god kontrast og god lesbarhet. (Vedlegg 7) Lenker i teksten Lenker skal være tydelige og bør markeres med mer enn bare farge (krav universell utforming, WCAG Bruk av farge, bruk-av-farge-niva). Vi har valgt å lage understrek på alle lenker, de vil da være godt synlig også for svaksynte og ute i sollys. Lenker i teksten og lenker på siden som leder ut til andre side er satt i grønn. Lenker som leder ned på siden er satt i lilla med pil. Lenker inne i teksten har ikke pil. Videre har vi beskrivende tekst på alle lenker slik at bruker vet hvor lenken fører (Samling4-dag 1-nettskriving-audun.pdf, s 60). Typografisk hierarki Vi har valgt å sette opp fontene våre i et typografisk hierarki (H1-H4) basert på overskriftsnivåer. Dette for å lage en mest mulig oversiktlig side. H1 vektes tungt, bør være unik for hver enkelt side, og har derfor valgt å bruke H1 i overskriften på siden (Vedlegg 9). God tekststruktur er viktig for lesbarhet, navigering og SEO i innholdet på artikkelnivå. Dette er også viktig for svaksynte som bruker opplesningsprogrammer. Vi har derfor bygd opp overskriftsnivåene, tekstens struktur og utseende konsekvent på alle sidene, slik at de møter krav i WCAG Overskrifter og ledetekster, Bruk av grid Nettsiden er bygd opp etter et fast grid. Siden består av 4 spalter med 17 px mellom. Venstre spalte er forbeholdt menyen. Menyen vil følge med når brukerne skroller. På denne måten vil menyen alltid være synlig. De neste to spaltene er forbeholdt innhold, mens den tredje og siste spalten til høyre, inneholder informasjonsbokser og linker. Menyen er satt opp i spaltebredden, men for å gi mer luft på siden har vi forskjøvet den, slik at det blir mer luft mellom tekst og meny. De minste boksene på siden følger gridsystemet i bredden. Høydeforskjellen på boksene er såpass store at de Studentnummer: ,

9 skiller seg ut fra hverandre. For å skape spenning på siden har vi brukt gruppering av elementene. Boksen for «Arrangement» er stor og har fått et dust bilde. Denne hører sammen med boksen «En bedre hverdag», som er satt i lime grønn og er vesentlig mindre. For å skape liv og kontrast på siden har vi satt disse inn en diagonal forskyvning, noe som gjør at øyet vandrer på siden. (Vedlegg 9) Fitts lov og å gjøre ting synlig Siden store knapper er mer synlig enn små, har vi valgt å gjøre knappene godt synlig ved bruk av farge og ramme rundt. Viktige valg skal være større enn små valg, derfor har vi for de viktigste brukeroppgavene på forsiden laget store bokser som er klikkbare og i tillegg lagt inn Pil for å vise at de er klikkbare. I den virkelige versjonen ville vi også gjort det slik at klikkeflaten hadde endret farge når musepekeren kom innenfor klikkområdet. Skriving av tekst Teksten på nettsiden er forenklet. Vi har samlet informasjon som hører sammen og fokusert på å bruke triggerord, kulepunkter og overskrifter i flere nivåer (Samling 4- dag 1-nettskriving-audun.pdf, s 46). Vi ønsker at nettsiden skal komme raskt opp på organiske søk, slik at flere kan få tilgang til informasjon om sykdommen. Veien frem til en ferdig prototype Vi var gjennom flere trinn på vei til den ferdige prototypen og løsningen som vi leverer med oppgaven. Vi har utført både kvalitative og kvantitative brukerundersøkelser underveis, i form av klikktester og brukertester, og ikke minst uformelle samtaler med ulike mennesker om våre forslag til prototyper. Dette ga et godt grunnlag for interaksjonsdesignet slik det ble i den ferdige prototypen. Forside testing og forbedring Vi testet og endret i flere trinn for å komme frem til en best mulig forside. Trinn 1 Første utkast av prototype på forsiden ligger vedlagt (Vedlegg 10, Forside). Vi fikk 3 personer til å ta en brukertest på denne med spørsmål som vi hadde forberedt til en klikktest, samt at de sa litt hva de mente om forsiden, se fullstendig resultat og endringer som ble gjort (Vedlegg 10, minibrukertest 3 personer). Studentnummer: ,

10 Trinn 2 Endringer etter dette resulterte i en ny versjon av forsiden. Ved bruk av Chalkmark i Optimal Workshop (optimalworkshop.com) lagde vi en klikktest som vi sendte ut til 10 personer, se resultater (Vedlegg 11). Vi gjennomførte også uformelle samtaler med flere personer om forsiden. Vi erfarte ut fra klikktesten og samtalene at innholdet på siden tok for stor plass. Hovedendringen ble derfor å forskyve alt innholdet lenger opp på siden slik at mere av siden kan ses uten å måtte skrolle, samt å legge inn et smalere bilde. La også inn en meny på venstre side med flere menyvalg enn tidligere. Fullstendig liste over tiltak etter testen kan ses her, (Vedlegg 12). Trinn 3 Dette resulterte i ny forside. Videre gjennomførte vi en samtale om forsiden med 2 personer. Forside, resultater og tiltak som vi gjorde etterpå kan ses her, (Vedlegg 13) Alle sidene i prototypen testing Resultatet etter endringen ble en ny forsiden (Vedlegg 14 - forside). Vi jobbet parallelt med de andre sidene samtidig som vi testet og gjorde endringer på forsiden. Når vi kom til trinn 4 ble vi ferdig med det vi syntes var bra nok til en klikktest/brukertest av disse (Vedlegg 14): Kjernesiden for parkinsons sykdom med et utdrag av informasjon om sykdommen. Arrangement som viser filtreringsmuligheter for valg av fylke, lokalforening og type aktivitet, samt en side til som viser liste med arrangementer etter at fylke, lokalforening og kategori er valgt. Skjema for å bli medlem, samt skjema for Bli medlem med feilmeldinger. Siden med rådgivningstjenestene. Vi laget en klikktest ved bruk av Chalkmark i Optimal Workshop (optimalworkshop.com) med 3 spørsmål for hver av sidene og sendte ut til 10 brukere. Samtidig foretok vi en brukertest der vi la inn alle sidene i Invisionapp.com slik at vi fikk en klikkbar versjon. Vi laget en intervjuguide og foretok en brukertest med 2 personer, 1 om gangen. Dette ble gjennomført i form av en vanlig brukertest (Toftøy-Andersen og Wold, 2011, s 128) Spørsmål og resultater er vedlagt (Vedlegg 15). Se resultater og tiltak som ble gjort etter klikktest og brukertest (Vedlegg 16). Kort fortalt så ble menyen forminsket, lenker i tekst gjort mer synlig, opprydning på Studentnummer: ,

11 Rådgivningssiden. Etter disse tiltakene hadde vi en nesten ferdig prototype, gjorde kun noen små justeringer på slutten. Ferdig prototype Navigasjonsstruktur Vi startet tidlig med å tenkte på hvordan navigasjonsstrukturen skulle være. Det er viktig å plassere de viktigste brukeroppgavene på forsiden (Samling2-Dag1- Brukervennlighet-Gjermund Alsos, s 7). Vi valgte derfor å gå bort fra den tradisjonelle menystrukturen med hovedmeny og undermenyer og heller plassere viktige brukeroppgavene i innholdsfeltet på forsiden. Samtidig har vi hatt fokus på at hver side man kommer inn på skal ha en vei videre, dvs link til annen side, som er relevant for det innholdet som er på denne siden. Samtidig la vi inn noen menyvalg i toppen uten undermenyer ettersom flat struktur er lettere å navigere i enn dyp struktur. Det viste seg etter hvert at disse valgene ikke var helt gjennomtenkte i en tidlig versjon av prototypen. Senere tester viste imidlertid at mange av brukerne foretrekker en meny som de kan ha tilgang til fra alle sidene, spesielt eldre brukere fra 60 år og oppover. Vi endret derfor til en meny på venstre side for å ha plass til flere valg. Vi har lagt inn Forside som et valg i menyen slik at de alltid kan gå tilbake til Forsiden, ettersom det ikke er nok med logo for å komme tilbake til forsiden, dette er ikke kjent for alle (Samling2-Dag1-Brukervennlighet-Gjermund Alsos, s 39). Samtidig har vi lagt en brødsmulesti øverst som viser hvor brukeren er og gi mulighet til å gå tilbake til tidligere sider. Vi har ikke tatt med felt for Søk pga av at søkefunksjonalitet ofte er vanskelig å få til bra på en nettside. Vi mener at navigasjonsstrukturen skal være så god at det likevel skal være enkelt å finne frem på nettsiden. Sidene i prototypen Forside Gjennom de ulike trinnene i prototypingen har innholdet på forsiden vært stabil, bare endret litt plassering. Helt i sluttfasen valgte vi å legge inn link til en aktuell sak på Facebook for å knytte nettsiden nærmere Facebook, samt link til en Youtube-film for å formidle litt humor og folkelighet på nettsidene. Studentnummer: ,

12 Parkinsons sykdom Vi har valgt å legge inn alt innhold om sykdommen på kjernesiden Parkinsons sykdom slik at brukeren kan finne alt på et sted. I tillegg har vi valgt å legge inn menypunkter til høyre for at brukeren skal komme raskt til innhold lenger nedover på denne siden. Vi har ikke tatt med alt innhold som står på den opprinnelige siden parkinson.no, men valgt å ta med et utdrag fra symptomer og diagnostisering for å få med noen hovedoverskrifter og dermed vise at alt innhold om sykdommen kommer fortløpende nedover på siden. Derfor har vi skrevet litt om symptomer, diagnostisering og videre har vi tenkt at det skal komme mer om Sykdomsutvikling, Behandling, Parkinson + og Arvelighet. Helt mot slutten vurderte vi å legge inn bare overskriftene med mulighet for å ekspandere det bruker ønsket å se og deretter kollapse etter ferdig lest. Dette ville vi vært noe vi ville jobbet videre med og testet ut hvis det hadde vært mer tid. Vi har omskrevet teksten en del og forsøkt å gjøre den mer lettlest, samt at vi har lagt inn lenker i teksten der det er naturlig at bruker kan gå videre til annet innhold. Lengden på tekstlinje har vi holdt til under 70 tegn. Vi har tenkt at når bruker er på denne siden så vil interessante utganger være å kontakte rådgivningstjenestene hvis de ikke finner svar på siden, få tips til en bedre hverdag og ofte stilte spørsmål, samt finne ut av rettigheter og laste ned brosjyrer. I tillegg har vi lagt inn link til Bli medlem, som også kan være aktuelt her. Bli medlem Vi har valgt å lage skjema for Bli medlem. På parkinson.no er det et langt skjema med mange felt å fylle ut. Vi har valgt å redusere antall felt ettersom færre felt øker sjansen for at skjema blir fylt ut og at konverteringsraten øker (Samling2-Dag1- Brukervennlighet-Gjermund.pdf, s 143). Annen informasjon som etterspørres senere. Vi har også tatt bort mulighet for å melde inn nærmeste pårørende i skjema for å korte ned antall felt. Da kan de fylle ut skjema to ganger i stedet. Vi har laget feltlengden tilpasset til innhold som skal fylles inn, for å hjelpe bruker til å skjønne hva som skal fylles inn i feltet (Wroblewski, 2008, s 73). Videre har vi gruppert felt som hører sammen og gir beskjed om hvilke felter som er valgfrie ved å skrive «valgfritt» ved siden av ledeteksten til feltet. Vi har valgt å sette inn Studentnummer: ,

13 ledeteksten over innholdsfeltet. Eyetrackingstudier vises at dette er det raskeste og da er det også lettere med forskjellige lengder på ledeteksten (Samling2-Dag1- Brukervennlighet-Gjermund.pdf, s 135). Når postnummer skrives inn, vil automatisk poststed hentes opp og også lokalforeningen. Hvis den innmeldte ønsker annet lokallag må han/hun kontakte parkinsonforbundet. Ved avkrysning for type medlemskap, betalingsmåte og informasjonsmottak er både avkrysningsboks og teksten klikkbar, slik at vi ivaretar prinsippet om store klikkeflater. Til betaling har vi lagt som en stor og tydelig knapp slik at denne vises tydelig (Samling2-Dag1-Brukervennlighet-Gjermund.pdf. s 121) Hvis bruker klikker på Betaling før obligatoriske felt er fylt ut vil det komme feilmelding utenfor aktuelt felt som viser hva som er problemet, og samme vil vises også på toppen av skjema (Samling2-Dag1-Brukervennlighet-Gjermund.pdf, s 134) På en mobil løsning av nettstedet ville vi ha tenkt på å få opp riktig tastatur ut i fra hvilket innhold som skal i feltet, f.eks numerisk tastatur når siffer skal legges inn, når epost skal legges inn osv (Samling2-Dag1-Brukervennlighet- Gjermund.pdf, s ). Ut gang fra «Bli medlem» rådgivningssiden for å få evt hjelp til spørsmål. Etter at skjema er utfylt og betaling utført bruker ledes til lokalforeningens nettside. Arrangementer Ved valg av Arrangementer på forsiden kommer bruker inn på en side for lokale arrangementer over hele landet. Denne siden kan også bruker komme til via valget Fylkes- og lokallag som ligger i hovedmenyen, som også gir mulighet for en side med sentrale arrangementer. For å gjøre det enklere å finne arrangementer for en bestemt lokalforening eller for en type aktivitet, så har vi utformet en filtrering på fylke, lokallag og type aktivitet. Hvis vi skulle jobbet videre med denne løsningen ville vi vurdert å ta med en tidsangivelse, f.eks En dag, Uke, Måned. På mobilversjon vil nedtrekkslistene plassere seg under hverandre. Rådgivning På denne siden har vi samlet rådgivningstjenestene som Parkinsonforbundet har for pasienter og pårørende. Det er Helsetelefonen som gir medisinsk rådgivning, Studentnummer: ,

14 Parkinsontelefonen som betjenes av likepersoner, samt Råd fra helsepersonell. For begge telefontjenestene vises et telefonnummer som er klikkbart. Fra mobiltelefon vil klikk på telefonnummer vil gjøre en vanlig oppringning, og på PC vil Skype kobles opp, noe som vil gjøre det veldig enkelt å foreta en oppringning fra disse sidene. Ut fra informasjonen vi har fått fra Parkinsonforbundet forsto vi at de har en Spørsmål- og svartjeneste hvor spørsmål må rutes manuelt til rette fagperson ut fra hva innholdet gjelder. For å spare manuell behandling av hvert spørsmål, så har vi lagt inn mulighet for bruker å velge riktig fagperson (så godt det lar seg gjøre) slik at spørsmålet kan rutes direkte til riktig fagperson. Bruker kan skrive inn epost for å få direkte svar. Spørsmål og svar blir lagret og kan søkes opp på siden med Ofte stilte spørsmål. Det er link til denne siden fra Rådgivning. Oppsummering Med denne prototypen mener vi å ha ivaretatt Parkinsonforbundets strategi og brukernes behov ettersom vi har løst 4 av de viktigste brukeroppgavene. I løsningen finnes mulighet for å: Få oversiktlig informasjon om kontaktmuligheter til helsepersonell og likepersoner (andre med parkinson eller pårørende) på en og samme side. Få kunnskap om Parkinsons sykdom, all informasjon på en kjerneside. Enkelt å melde seg inn i Parkinsonforbundet ved at skjema for innmelding er forenklet og mer brukervennlig. Filtrere på fylkes- og lokalforening og type aktivitet slik at det er lettere å finne de arrangementer man er ute etter. Fordeling av oppgaver Vi har samarbeidet om det meste, men en har jobbet litt mer med å sette opp intervjuguide, tester og gjennomført testene, mens den andre har jobbet mer med å sette opp prototypen i InDesign. Hva vi skulle gjort annerledes I arbeidet med å lage forslag til prototyper burde vi ikke jobbet så lenge på skissene før testing. Innspillene kom raskt og vi kunne endret tidligere hvis testingen hadde blitt gjennomført før. Vi har også hatt begrenset tilgang til testverktøy, kun prøveversjoner med begrensede muligheter. Vi kunne lagd flere spørreundersøkelser som kunne vært sendt til flere hvis vi hadde hatt bedre verktøy. Studentnummer: ,

15 Litteraturliste: Wroblewski, Luke (2008), Web Form Design: Rosenfeld Media, LLC Toftøy-Andersen, Eli og Wold, Jon Gunnar (2011), Praktisk brukertesting. 1.utg. Cappelen Damm AS IGM Ida Aalen, Samling 2-da2-kjernemodellen-ida.pdf IGM Martha og Dag Helge, Samling3-Dag1-interaksjonsdesign-MDH.pdf IGM Martha og Dag Helge, Samling3-Dag2-Interaksjonsdesign-MDH.pdf IGM Gjermund Alsos, Samling2-Dag1-Brukervennlighet-Gjermund Alsos IGM, Audun, Samling 4-dag 1-nettskriving-audun.pdf Aalen, Ida (2015) "The Core Model: Designing Inside Out for Better Results" Blogpost på A list apart Frost, Brad (2013) "Atomic design". Blogpost Hamnes, Kari (2012) 10 tips til gode brukerintervjuer Blogpost. Studentnummer: ,