Ud fra nedenstående delaflevering ønsker vi at få vejledning om følgende punkter:

Transkript

1 Oplæg til vejledning Ud fra nedenstående delaflevering ønsker vi at få vejledning om følgende punkter: Da afsenderne af websitet ikke kan medvirke, vil vi bl.a. gerne have feedback på hvordan vi tager stilling til vores målgrupper. Derudover er vi i tvivl om det er anbefalelsesværdigt at gå i dybden med én streng under ét menupunkt eller om det er bedre at lave forsider til flere menupunkter. Da vi nu er i web 2.0 æraen og nærmer os web 3.0, kan det så anbefales at inddrage en blog? Er der mere litteratur som er passende for vores projekt? Skal vi vedlægge bilag af vores test-resultater? Generelt i forhold til vores projekt Vores case er et re-design af websitet Grunden til at vi har valgt denne case er at vi ser mange forbedringsmuligheder ved netop dette website. Der er flere problemstillinger i forbindelse med casen. For det første er det nuværende website meget uoverskueligt, det er svært at navigere rundt på de forskellige undersider og finde frem til de informationer man søger. Som besøgende på websitet bliver man desuden ført til det der minder om tre forskellige websites selvom det er det samme (se bilag). Der er altså et stort usability problem. For det andet er selve designet af websitet heller ikke brugervenligt eller nutidigt. Det afspejler ikke afsenderne på en hensigtsmæssig måde. For det tredje er det svært at identificere målgruppen for websitet. Der mangler derfor fokus. Ud fra ovenstående har vi valgt at indsnævre vores problemfelt til følgende to punker: 1. Data på siderne skal organiseres: informationsarkitektur og navigation. 2. Der skal være relevans for brugerne og der skal fremgå gennem teksten og den visuelle formidling. Indholdet skal serveres så det bliver let fordøjeligt for brugerne (det går f.eks. ikke at have en halv sides tekst, en bedre løsning er at skrive fire linier og at man så kan klikke videre til en anden side.) Kort sagt er der fokus på forenkling og navigation i dette projekt. Vores fokus ud fra faget og pensum bliver hermed usability, brugercentreret design, informationsarkitektur og navigation. Problemformulering Vores problemformulering er: Hvordan får vi forbedret tilgangen til indholdet på sitet og samtidig organiseret det så der er sammenhæng mellem relevans og tilgængelighed? Metode Den metode vi tager udgangspunkt i er meget brugercentreret. Vi ville gerne have Camilla Plum og Per Kølster 1 inddraget som afsendere af websitet, men de har desværre ikke tid til at medvirke i projektet. Vi har derfor valgt at samarbejde løbende med målgruppen for i fællesskab at nå frem til den bedste informationsarkitektur, navigation og usability. Vi inddrager omkring tre brugere af websitet i forskellige aldersgrupper da målgruppen for 1 De ejer og driver Fuglebjerggaard.

2 websitet er meget bred. Dette vil blive uddybet i afsnittet om resultater og refleksioner. Vi har allerede i den indledende fase af projektet inddraget brugerne vha. kortsortering og senere vil vi teste wireframes for at inspireres samt teste opsætningen af sitet i forbindelse med navigation og struktur. Det vil vi gøre ved at give brugerne små opgaver de skal løse. Den sidste test af designet vil vi formentlig gennemføre med en fokusgruppe. Litteratur Da projektet tager udgangspunkt i ovenstående områder, vil den bærende litteratur ligeledes ligge inden for disse. Derfor antager vi at vi vil inddrage Steve Krugs bog Don t make me think, Rasmussen og Fischers bog Målgruppeanalyse, Morville og Rosenfelds bog Information Architecture for the World Wide Web, Munk og Bisgaards bog Brugervenlighed på nettet samt supplerende materiale fra Web Style Guiden og andre tekster fra pensum, muligvis omkring motiverende design. Desuden vil vi analysere vores interviewresultater fra fokusgruppen ud fra Steinar Kvales bog Interview En introduktion til det kvalitative forskningsinterview da de resultater vi vil opnå primært er kvalitative. Tilgang og ressourcer Projektet er organiseret ud fra ovenstående tilgange. De ressourcer vi har til rådighed er websitet Fuglebjerggaard, omkring tre brugere som vi vil inddrage løbende i redesignprocessen, ovenstående litteratur og vores individuelle kompetencer. Tidsplan Se bilag Foreløbig disposition af projektrapporten Indledning med præsentation af case og problemformulering Metode Webgenre - madkonglomerater (Nikolai Kirk, Meyer, Jamie Oliver, Nigella Lawson osv.) Målgrupper for Fuglebjerggaard Empiri (kortsortering, interviews med brugere, wireframing/design med brugere, evt. præsentere brugere for designs vi synes er gode; få feedback) Usability Kommunikation - designmanual - vi laver en designmanual ud fra brugernes feedback og vores egne analyser og derudfra laver vi designet af siden. Informationsarkitektur - sitets opbygning - hvad har vi ændret og hvorfor? (navigation bl.a.) Kodning - browsertype, sidestørrelse osv. Konklusion og videreudviklingsmuligheder - herunder muligvis blog Litteraturliste Bilag Vi har endnu ikke sat cirka antal sider på hvert afsnit, men den bærende del af rapporten kommer højst sandsynligt til at ligge inden for punkterne usability, kommunikation og informationsarkitektur.

3 Vores første resultater og refleksioner Genren Sitet hører under den webgenre som vi har valgt at kalde madkonglomerater. Det der kendetegner denne webgenre er at et website både fungerer som en personlig hjemmeside og dermed ligger vægt på et branding-perspektiv og som en reklame for de(t) produkt(er) personen kan tilbyde. Ud fra de forskellige webgenrer Fagerjord (2006) stiller op kan webgenren madkonglomerater ses som en hybrid mellem den personlige hjemmeside og en firmahjemmeside. Denne hybrid kan også være medvirkende til at netop sitet Fuglebjerggaard fremstår så uoverskueligt som det gør fordi blandingen af genrerne ikke er gennemført optimalt. Vi har kigget på følgende sites i genren: samt sider der hører til Claus Meyers madkonglomerat hvilket drejer sig om fire: og Fælles for disse fem madguruer er at deres sider er utroligt informations-tunge. Fælles for dem er dog også at deres sider bærer præg af en anden professionalisme og et mere gennemtænkt og brugervenligt design end Kille Ennas side er den mest enkle. På forsiden er der fire kategorier i højre side, designet er stramt med sort baggrund og enkle billeder. Det fungerer dog ikke, alle undersider har et andet layout. Nigella Lawsons og Jamie Olivers sites minder meget om hinanden. Der er nogle topkategorier, 8 hos Nigella, 9 hos Jamie Oliver. Derudover er der hos Jamie Oliver også kategorier i venstre side. Jamie Oliver har desuden gjort sig den ulejlighed at lave underkategorier til de øverste, ruller man fx. over recipies (opskrifter) får man underkategorier såsom chicken, vegetarian osv. Dette er en stor hjælp for brugeren. Nikolaj Kirks site er den mindst professionelle af de ovennævnte. Siden fremstår rodet, kategorier ligger i højre side og øverst ruller en tekst med nyheder - men man kan ikke komme ind på disse nyheder, det er ikke links hvilket er med til at forstyrre billedet af et professionelt site. Som bruger forstår man ikke hvad den rullende tekst skal gøre godt for. Claus Meyer har som den eneste valgt at tage konsekvensen af al den information han gerne vil give sine brugere da han har valgt at have fire hjemmesider. En god ting ved de fire sider er at de er holdt i samme layout med samme logo og næsten samme opbygning. Det fungerer godt. Hvad der ikke fungerer optimalt er at man som bruger simpelthen bliver forvirret omkring hvilket site man skal kigge på. F.eks. er opskrifterne på meyersmadhus.dk og clausmeyer.dk næsten identiske. Det kan altså være forvirrende at huske hvilken side man så hvilken opskrift på. Det er svært for alle madkonglomerater at få al den information de gerne vil give videre ud på en lettilgængelig måde. En god idé er f.eks. at indexside og undersider ligner hinanden og er bygget op efter samme informationsarkitektur/wireframe/skabelon så brugeren hurtigt ved hvor han/hun skal lede efter information. Derudover er det essentielt for så informations-tunge sider at deres søgefunktion fungerer optimalt. En sidste ting er at jo enklere sidens design er (farver, billeder osv.) jo mere overskuelig er den også for brugeren. Vi er i øjeblikket i gang med at teste hvilke ting der fungerer på forskellige madkonglomeraters websites. Genretesten gennemføres vha. af en online undersøgelse som forskellige testpersoner svarer på. De bliver bl.a. bedt om at udføre nogle opgaver så vi kan teste navigationen på de forskellige sites. Vi vil anvende svarene til inspiration for redesignet af Fuglebjerggaard. Målgrupper Vi har fulgt øvelserne som er lagt ud på bloggen hver gang. Da vi har valgt at fokusere meget på brugerne, har vi fundet frem til de målgrupper sitet henvender sig til gennem Louise

4 Haarder Fischers faseinddelte aktivitetsrækkefølge 2. Gennem aktivitet 0 er vores kommunikationsudfordring at få organiseret data på siderne ud fra informationsarkitektur og navigation. Derudover skal brugerne kunne relatere til websitet, vi skal fokusere på tekst og den visuelle formidling og dermed skal indholdet serveres så det bliver let fordøjeligt for læseren. Da vi desværre ikke kan inddrage sitets afsendere, bygger aktivitet 1 på vores egen analyse af websitets målgrupper. Idet sitet Fuglebjerggaard har mange undersider og emner, vil brugergruppen automatisk blive meget bred. Den segmentering vi har fundet frem til er: 1. De der interesserer sig for Camilla Plum som brand (DR, opskrifter, hendes person etc.) 2. Gården (butikken, åbningstider, sortiment, historie, kurser, planteskole, bryggeriet osv.) 3. Netbutikken (som ovenstående) 4. Per Kølster (blog/ refleksioner, alle hans arrangementer/ansvarsområder - som i øvrigt er præsenteret mange andre steder på sitet) Det vil sige: 1. De der ser Camilla Plum som brand ( fans ) fordelt ud over hele landet i en aldersgruppe svarende til tv-seriernes seere. Vi vil gisne om primært kvinder i alderen Primært folk fra Nordsjælland (lokalområde) dog måske også besøgt af målgruppen ovenfor. Et andet segment er fagnørder (øl, æbler) 3. Målgruppen fra segment 1 dog afgrænset til typiske brugere af netbutikker 4. Fagnørder (øl, æbler, dyr, korn) vi gætter på primært mænd Ud fra aktivitet 2 har vi stillet nogle hypoteser op som vedrører en potentiel bruger og hvordan denne vil reagere ved at besøge sitet. Hvis man som bruger kommer ind på siden med f.eks. ét formål, kan alt findes, men det kræver energi. Enten er emnerne ikke eksisterende på forsiden eller også er de der flere gange. Begge dele skaber mere forvirring end ro. Det føles som en labyrint uden kort, og der er ingen hjælp at hente da søgefunktionen heller ikke fungerer. Et eksempel er hvis man skal søge efter et kursus. Fra forsiden har man nemlig to muligheder ved enten at vælge kurser eller et specifikt kursus. Man tænker måske om man går glip af noget ved at vælge det ene frem for det andet. Derudover kan brugere have en forventning til sitet. Idet mange kender til Camilla Plum gennem hendes bøger og madprogrammer, vil mange også have en forventning til hende som brand og dermed også hendes hjemmeside. De vil nok forvente at der eksisterer en hjemmeside og at den har et bestemt look som stemmer overens med det de ellers ser af og med hende. Vi tror at der opstår et credability problem. Sitets visuelle profil (farver, opstilling, font, sidernes forskellighed) og nybegynder-looket gør at det umiddelbart virker uopdateret. Dermed mister man evt. troen på at det kan give en noget relevant. Ud fra aktivitet 3 inddrager vi som tidligere nævnt brugere som vil kunne hjælpe os med relevansproblemet samt ønsker og behov for sitets struktur og navigation. Vi tænker at brugerne senere i processen skal sidde fysisk med f.eks. sketches (skabt ud fra deres/vores tanker og ideer) af fiktivt site for at lave usability-tests af vores design. Gennem aktivitet 4 er vi kommet frem til at vi vil bruge vores resultater til at fokusere vores design ud fra brugernes behov og ønsker. Det vil være kvalitativ data som vi bl.a. vil analysere ud fra Steinar Kvales principper. 2 Aktivitet 0: den nuværende kommunikationsudfordring Aktivitet 1: segmentering Aktivitet 2: spørgsmål og hypoteser Aktivitet 3: dataindsamling Aktivitet 4: analyse og afrapportering

5 Informationsarkitektur The beginning of all understanding is classification. - Hayden White (Morville, Peter & Rosenfeld, Louis, 2007) Ovenstående citat er et godt eksempel på at informationsarkitekturen på sitet ikke fungerer optimalt. Vi tror at der er tænkt en del over informationsarkitekturen. Sitet er for eksempel delt ind i kategorier - et af problemerne er bare at der er for mange kategorier til at sitet er overskueligt - i alt 12 topbjælker. Med så mange kategorier, havde det f.eks. været en god idé at sortere dem alfabetisk for at give brugerne en smule hjælp til at finde rundt. En anden ting der ikke fungerer mht. informationsarkitekturen er søgefunktionen. Finder brugeren endelig søgeknappen der er gemt i højre hjørne, møder denne følgende meddelelse: Søgning kan være en hjælp til hurtigt at finde det du leder efter (f.eks. rundvisning) Søgningen kan også være en hjælp til at finde det du leder efter i Camillas opskrifter. Du kan søge på ord (f.eks. lam) eller tekst (f.eks. grillet lam) Vi skal straks indrømme, at søgeværktøjet også henviser til steder, hvor der ikke er noget at hente eller hvor der af mystiske årsager ikke er adgang til den pågældende side, vi arbejder på at forbedre værktøjet, og hav tålmodighed med IT-afdelingen (det er også mig) Hilsen Per Prøver brugeren derefter at søge på f.eks. tomat, dukker følgende besked op: Side med kørselskomponent i FrontPage Du har sendt en formular eller fulgt et hyperlink til en side, som kræver en webserver og FrontPage-serverudvidelser for at fungere korrekt. Denne formular eller en anden FrontPage-komponent virker korrekt, hvis du udgiver webstedet på en webserver med FrontPage-serverudvidelser. Klik på pilen <Tilbage> for at vende tilbage til den forrige side. Hele websitet er et godt eksempel på informations overload der bliver endnu mere uoverskuelig fordi informationsarkitekturen ikke virker så gennemtænkt og bestemt ikke tager brugeren i hånden. En af vores store udfordringer med dette website er at designe en informationsarkitektur der kan hjælpe brugeren til at få det optimale ud af sitet og på en nem og overskuelig måde få adgang til den utrolige mængde information og viden som sitet rummer. Kortsortering Vi har gennemført kortsortering af det nuværende indhold på sitet. Det indhold som det nuværende site (se bilag) er bygget op omkring har vi vurderet at vi ikke vil ændre bemærkelsesværdigt på da vi ikke har mulighed for at inddrage afsenderen af sitet. Derfor er vores primære fokus at få sitet til at fungere vha. informationsarkitektur samt navigation og det kan derefter blive nødvendigt at få afsenderen til at bedømme om alt indhold stadig skal være tilgængeligt. Vi har selv udført kortsorteringen samt fået tre personer til at gøre det samme. Desuden har vi lavet et sitemap over den struktur vi ønsker for det fremtidige site som er opstået ud fra vores kortsorteringsproces (se bilag). Ud fra vores egen emnesortering og de tre testpersoner danner der sig et billede af hvilke menupunkter der kunne være på forsiden.

6 TITLER Kurser og Oplevelser Om Os (evt. Om Gården) Gårdbutikken Opskrifter Have (-dyrkning) Artikler, Bøger og Presse Bryggeriet TANKER Optrådte direkte som kategori hos to af testpersonerne. Vores eget bud var oprindeligt at dele det op i Kurser (information/uddannelse) og så Oplevelser (noget man kan opleve på gården). Den tredje testperson foreslår at alle de forskellige aktiviteter står i en menu på forsiden. To testpersoner foreslår en kategori indeholdende: Profil af gården, historie, grundlæggende værdier, informationer, kontakt, Camilla og Per. Vi tror på at denne kategori er stærk nok til at stå alene. Selvom det er en underkategori så er det Camillas primære produkt som hun er mest kendt for, derfor mener alle testpersoner at det hører hjemme på forsiden. Overskriften kunne være en kombination af Opskrifter & Mad, Opskrifter & Bagning, Opskrifter & Bøger. Denne side kunne indeholde en søgefunktion (kun til opskrifter). - Alfabetisk råvareoversigt med information (hendes artikler) - Årstidens mad (mad i februar, advent osv.) - Alfabetisk opskrifts oversigt To af testpersonerne mener at havebrug er en stor del af Camillas virke. Alle 3 testpersoner placerer Artikler som noget centralt på forsiden. Indeholder artikler samt oversigt over egne bøger og diverse presseomtale. Presse-billedbase (billeder, logos osv.) Alle tre testpersoner og os selv placerer ølbrygning som et af hovedprodukterne fra Fuglebjerggaard. Derudover vil på alle undersider og på forsiden være muligt at navigere ind på: Kontaktinfo (både som link, men på alle sider skal kontaktinfo også gå igen nederst på siden). Søgning Links Netbutik Camilla Plum (Velkommen, om hende, om hendes arbejde, vidensdeling, billeder/videoklip (ikke billedbase/-video), links til DR, opskrifter, bøger, havedyrkning). Per Kølster (Velkommen, om ham, om hans arbejde (øl, æbler, bøger osv., links (men ikke faner), vidensdeling, billeder (ikke billedbase). Til sidst skal der altid være dette på forsiden: Aktuelt/nyheder. To af testpersonerne og os selv mener at det er vigtigt med en del af forsiden der er nyhedsorienteret. Aktuelle events, nye udgivelser, tilbud, næste besøgsdag, nyhedsbrev osv. Wireframe-skitser Vores kortsorteringsproces har ledt os frem til nogle simple wireframe-skitser som vi har udført på papir. Vi har skitseret forsiden samt en underside (se bilag). Det er meningen at alle undersider skal have den samme opbygning og struktur. Vores idé med selve siden er at gøre den så simpel som muligt i denne sammenhæng.

7 Vi ønsker en simpel arkiv-lignende menu-linie foroven. Når man så først har valgt sig ind på en underside vil der komme en tilsvarende simpel menu-linie frem i venstre side. Vi håber på at kunne ungå nogle/for mange dropdownmenuer ved at forsimple indholdet. Vi ved også at (ud fra deres nuværende site), at der er et stort billede materiale, og det vil vi udnytte på en måde så gården kommer til sin ret. Når vi har analyseret den data vi får fra genretesten, vil resultaterne også blive inkorporeret i vores wireframes. Desuden vil vi bede vores testbrugere om feedback på vores wireframes jævnfør tidsplanen. BILAG:

8 Delaflevering, DWDK1-E2010,

9 Delaflevering, DWDK1-E2010,

10 "vigtige" datoer torsdage Rapport skrivning Gruppedannelse Udkast til delrapport Site map Finpuds aflevering AFL Delaflevering Prototype på parpir Prototype Photoshop Kodning AFL Final Aflevering 28/10 13/11 16/11 17/11 18/11 21/11 25/11 2/12 9/12 15/12 Marie og Louise Trille og Stefan Analyser af testperso n-data og Emne opdeling Louise og Marie laver videre på del rapporten Vi skal blive enige om et design Userbillity og navigations spørgsmål

11 FUGLEBJERGGAARD som den er nu Gårdbutikken Bøger Korn/mel Øl Malt Honning Okse/kalvekød Pølser Lammekød Svinekød Gæs og ænder til jul Æg Syltevarer Brød Krydderiblandinger Frø Tomater Chili Krydderurter/tørrede urter Bageudstyr Pluk selv (æbler, kartofler, jordbær) Fødevarekontrollen Åbningstider/info Kurser Æbletur (mange slags) Lav din egen cider (mange slags) Ølturen (mange slags) Maltning (mange slags) Brygning (mange slags) Humledyrkning (mange slags) Netbutikken ALT kan købes her (som også kan købes i gårdbutikken) Mad Opskrifter Artikler Haver Bagning Krydderier Bøger Links til programmer (DR) Link til Kogeskolen Krydderier Plums egne økologiske krydderier Planteskolen/Frø Planteskolen Havedyrkning Havedyrkning Links til forskellige grøntsager Ølbryggeri/malt Diverse øllinks (kurser, salg, maleriet, historier etc.) Diverse æblelinks (plantager, sorter, kurser, cider, bøger etc.) Diverse mellinks (korn, mølleri etc.) Diverse dyrelinks (okse, grise, gæs, lam, hø, bier etc.) Andet (foredrag, artikler GMO, Pers kurser, netbutik, reflektioner etc.) Æbler/Cider/Frugttræer Så ryger man bare til forsiden men med anden sidemenu (venstre) Dyr og kød/korn og mel/landbrug Samme som Ølbryggeri/malt Om os Adresse, info, søgning (!), nyhedsbrev, betaling (bankoplysninger) Camilla Plum Samme som Mad Per Kølster Samme som Ølbryggeri/malt Sidemenu på forsiden: Gavekort Teambuilding Rundvisning Foredrag Økologikurser (madkursus) Høstmarked (HELT ny side åbner i nyt vindue og INGEN vej tilbage) Kørevejledning (med kort) Bøger (billeder af bøger men ikke indkig) Referencer (gæster, kunder og samarbejdspartnere) Links Litteratur (ikke deres egen) Nyhedsbrev (alle nyhedsbreve ligger derinde og henviser til en ny side pr. brev) Søgning

12 Camilla Plum Velkommen. Om hende. Om hendes arbejde. Vidensdeling. Billeder/videoklip (ikke billedbase/- video). Link til DR, opskrifter, bøger, havedyrkning FUGLEBJERGGAARD.DK Per Kølster Velkommen. Om ham. Om hans arbejde (øl, æbler, bøger osv - tekst (links, men ikke faner). Vidensdeling. Billeder (ikke billedbase). Om Os Gårdbutikken Kurser og oplevelser Bryggeriet Opskrifter Have / Havedyrkning Artikler, Bøger og Presse Profil af gården. Historie. Grundlæggende. Værdier. Dyr Plantagen Mel/Korn Kalender Info. Kontakt. Gårdbutikkens sortiment og info (åbningstider osv.) Æbler. Øl. Teambuilding. Om bryggeriet. Historie. Om øl. Kurser (link til kurser). Opskrifter. Mad. Bagning. Bøger. Evt. klip fra programmer (?) Alfabetisk råvareoversigt. Årstidsmad. Alfabetisk opskriftsoversigt. Gåde råd. Evt. klip fra programmer (?) Planteskolen Havekurser (link til kurser) Indeholdende artikler. Oversigt over egne udgivede bøger. Diverse presse omtale. Pressebilledbase (billeder, logos osv.) Praktisk Kontakt(praktisk), Søgning, Links(eksterne) Forside: Nyheder Aktuelle events, nye udgivelser, tilbud, næste besøgsdag, (nyhedsbrev) osv. Netbutik ("Indkøbsvogn")

13 Delaflevering, DWDK1-E2010, Wireframes