Delaflevering Webdesign og webkommunikation, hold2 E-2011 Af gruppen Blind Spot: Ditte Holst Nielsen, dhon@itu.dk Ole Krabbe-Poulsen, okrp@itu.dk Sidsel Latsch Jespersen, slje@itu.dk 0
Indhold Oplæg til vejledning Beskrivelse af problemfeltet og foreløbig problemformulering Beskrivelse af metodisk tilgang Målgrupper og brugerinddragelse i projektet Litteratur Projektorganisering Tilgængelige ressourcer og tidsplan Foreløbig disposition Motiverende design Informationsarkitektur Bilag Konceptdiagram Roughboard Wireframes Interview med Birgit Christensen, IBOS Interviewguide 1
Oplæg til vejledning Gorm: Brian: 1. På den hjemmeside vi vil redesigne, ser produktkategorierne sådan her ud: http://synsnerven.dk/kats/hus.htm. Når vi vælger Vis sidens kildekode, ser det helt gaks ud. Kan du regne ud hvad det er de har gang i, og hvorfor det er kodet sådan? 2. Har du nogle idéer eller ressourcer ift. hvordan vi kan tage højde for tilgængeligheden for skærmlæsere? 1. Vi har regnet med at lave fire målgruppeinterviews og et par brugertest af den nuværende hjemmeside til at hjælpe os til at definere målgruppens behov er det for meget i forhold til hvad der kræves? Eller omformuleret: Hvad vurderes som vigtigst at have med i opgaven? 2. Hjemmesidens hovedmålgruppe er de pårørende, men den skal også være tilgængelig for synshandicappede. Synshandicappede er imidlertid både blinde og svagsynede, og de har forskellige behov i forhold til tilgængelighed. Kan vi tillade os at sige, at vi for at begrænse opgavens omfang har valgt kun at fokusere på blinde (dvs. skærmlæsere)? 3. Bør vi lave webshop i redesignet, eller skal vi holde os til de oprindelige produktlister? 2
Beskrivelse af problemfeltet og foreløbig problemformulering På Instituttet for blinde og svagsynede (forkortet IBOS) er der en hjælpemiddeludstilling, der fremviser en bred vifte af hjælpemidler til blinde og svagsynede. Oprindeligt var det også en butik, men på grund af sin karakter af offentlig institution blev det lidt mudret både at skulle rådgive neutralt og skulle sælge noget. På nuværende tidspunkt holder udstillingen sig til at fremvise og rådgive om hjælpemidler og henviser så videre til dem, der sælger produkterne, hvis folk er interesserede. Hjælpemidler for Handicappede (forkortet HFH) er en af dem. Ud over den fysiske butik i Aalborg har HFH en hjemmeside (www.synsnerven.dk), som lederen af hjælpemiddeludstillingen tit har besværet sig over. Hun synes ikke siden er til at finde rundt på, når hun skal finde ud af, om et hjælpemiddel kan fås hos HFH og hvad det koster. Hun ender tit med at gribe telefonen i stedet for at lede. Hun har rettet henvendelse til ejeren angående problemet, men tilsyneladende er hun den eneste, der har klaget over problemet. Ejeren er selv blind og bekymrer sig af den grund ikke om det visuelle udtryk på hjemmesiden, men om at den er tilgængelig og brugbar for synshandicappede, der benytter skærmlæsere ligesom ham selv. Kigger man imidlertid på statistikkerne om synshandicap i Danmark, kan det konstateres at antallet af synshandicappede er ca. 65.000 i alt, og at 50.000 af disse er over 70 år (Øjenforeningen, 2005). It- og telestyrelsens rapport Det digitale samfund 2010 beskriver, at alder spiller en stor rolle for brugen af internettet: I 2010 er de 75-89-årige for første gang inkluderet i undersøgelsen, og en betydelig lavere andel af denne gruppe anvender internettet end den øvrige befolkning. (It- og telestyrelsen, 2010: 28). Samme rapport beskriver, at 56 % af de 65-74-årige bruger internettet. Så selvom hovedparten af hjælpemidler sælges eller bevilges til denne gruppe, benytter en stor del af den ikke internettet. De benytter derfor heller ikke skærmlæser, og vil aldrig selv komme i kontakt med HFH s hjemmeside. Vores hypotese er derfor, at den største målgruppe for hjemmesiden er de ældres normaltseende pårørende. Hvorfor disse mennesker ikke har henvendt sig for at få en bedre hjemmeside kan undre, men en plausibel forklaring er, at de er mere optaget af at få de oplysninger, de kom efter, end i at give konstruktiv kritik af hjemmesiden. De vil derfor ligesom lederen af hjælpemiddeludstillingen kontakte HFH pr. telefon eller søge deres oplysninger og dermed muligvis foretage deres køb et andet sted. Ud over HFH er der kun en håndfuld forhandlere der sælger det samme i Danmark, fordi markedet er så lille. Køberne har derfor ikke så mange muligheder for at tage deres penge med et andet sted hen. Det er muligvis derfor, at tilgængeligheden og brugbarheden af hjemmesiden for normaltseende ikke er højt prioriteret hos HFH. Et andet bud kunne være det, som lederen af hjælpemiddeludstillingen nævner i et interview med hende; at HFH har ry for at yde en bedre service i den fysiske butik og i den direkte kontakt med kunderne end konkurrenten Butik Kik. En hypotese kunne derfor være, at HFH tjener nok penge på de kunder som kender dem i forvejen (se konceptdiagram over problemstilling i bilag). Det må alligevel formodes, at et redesign af hjemmesiden med fokus på de normaltseendes behov ville øge salget i sidste ende. Det er vores hypotese, at dette vil kunne gøres uden at kompromittere de synshandicappedes brug af siden, og måske endda forbedre deres opfattelse af brugbarheden af siden. På den baggrund lyder vores problemstilling: Hvordan kan vi redesigne HFH s hjemmeside, så det tilgodeser behovet hos de normaltseende brugere, mere specifikt de pårørende til de synshandicappede, uden at kompromittere brugen af hjemmesiden for blinde brugere, der benytter skærmlæsere? 3
Beskrivelse af metodisk tilgang Den metodiske tilgang vi vil anvende bygger på idéerne om en brugercentreret designproces (UCD, Donald Norman; The Design of Everyday Things), dvs. at vi i hele processen vil fokusere på brugerens behov, ønsker og begrænsninger for at opnå en optimal kommunikation i slutproduktet. Vi ser Bill Buxtons tanker om overlapping funnels (Sketching user experiences) som et godt udtryk for processen, altså fra et givet problem at udvide designteamets forståelse og idérigdom, til derefter at fokusere på en endelig løsning. I researchfasen vil vi udvide vores forståelse og generere idéer ud fra den initielle problemstilling gennem deskresearch, brug af gruppemedlemmers erfaring med området og vigtigst brugerinterviews og tests, for at kunne skabe personas der kan repræsentere de mål vores endelige design skal kunne opfylde - til dette vil vi benytte idéer fra A. Cooper About face 3, og være bevidste om at vores tidshorisont skaber visse begrænsninger. Vi vil også benytte os af værktøjer som skitsetegning (igen med henvisning til Bill Buxton) og storytelling for at kunne generere idéer og opstille scenarier til løsning af opgaven. Derved vil researchfasen glide over i den egentlige designfase, hvor vi vil udforme mere strukturerede løsninger til interaktionen. Disse skal testes undervejs efter principperne i Experience Prototyping (Marion Buchenau og Jane Fulton Suri), hvor vi præsenterer brugere for prototyper at interagere med, for at kunne iagttage funktionaliteten af løsningerne. Vi vil her anvende lowfi-prototyper for at teste struktur og 4
navigation, og mere højopløste når det kommer til det visuelle design. I denne proces vil der være løbende evaluering og tilretning af løsninger, dvs. at der her kan opstå turbulens og at designprocessen kan kastes tilbage til tidligere stadier for at udvikle mere brugbare tiltag. Designfasens kulmination nås når resultaterne udkrystaliseres i den endelig programmering af det færdige site. 5
Målgrupper og brugerinddragelse i projektet Ud fra vores problemformulering kan der defineres to primære målgrupper for vores redesign af HFH s hjemmeside: - Synshandicappede, både blinde og svagsynede to grupper med nogle sammenfaldende men også forskellige behov hvad angår tilgængelighed. - Pårørende/bekendte til målgruppen. Denne gruppe udgøres af ægtefæller, børn, øvrig familie og bekendte til ældre mennesker (den største gruppe ifølge demografien), og derudover forældre til børn med synshandicap (den mindste gruppe ifølge demografien). En tredje målgruppe udgøres af folk der beskæftiger sig med synshandicappede i forbindelse med lønnet eller ulønnet arbejde (herefter kaldet synsprofessionelle). Det er for eksempel sagsbehandlere i kommunen, folk der arbejder i interesseorganisationer, folk ansat inden for diverse institutioner der har med syn at gøre (Instituttet for blinde og svagsynede, Dansk blindesamfund (DBS), diverse synscentraler og jobcentre, hvor blinde og svagsynede søger om at få bevilget hjælpemidler). Ud fra vores baggrundsviden regner vi med at denne målgruppes behov bortset fra enkelte ubetydelige elementer er sammenfaldende med de pårørendes, og vi ser derfor bort fra denne i vores opgave. Vores primære målgruppe er de seende pårørende, men sigtet er todelt, således at synshandicappede skal kunne bruge siden det er altså tilgængeligheden der er i fokus, snarere end indhold på indholdssiden regner vi med at pårørende og synshandicappedes behov er sammenfaldende. Research hvad er målgruppens behov? Vi har defineret et problem, som går ud på, at den nuværende hjemmeside ikke tilgodeser en stor del af dens målgruppes behov. For at komme med bud på løsninger på dette problem er der flere ting vi bliver nødt til at vide mere om, for at forstå det område, vi arbejder med og vores målgrupper: 1. Hvad er de pårørendes behov bliver de dækket af den nuværende hjemmeside? 2. Hvad er dem, der benytter skærmlæsers behov bliver de dækket af den nuværende hjemmeside? 3. Hvordan ser markedet for at sælge hjælpemidler på nettet ud? 4. Hvordan er det felt, vi opererer i synsverdenen? Spørgsmål 1 For at svare på det første spørgsmål vil vi foretage 4 semistrukturerede interviews af pårørende til synshandicappede; to med og to uden erfaring med synsverdenen. På den måde håber vi at afdække både konkrete og forestillede behov og problemer, som vores hjemmeside kan tage højde for og dermed være med til at løse. Spørgsmål 2 Det er vores hypotese at det, de to primære målgrupper vil på hjemmesiden, er det samme, altså at deres mål er de samme, men at måden at nå frem til dem (med øjnene henholdsvis med skærmlæser) er forskellige. Implikationen hvis dette er rigtigt er, at indholdssiden af hjemmesiden er den samme for begge målgrupper. Det er de pårørende vi primært har fokus på i vores opgave, og det vi har brug for at vide i forhold til folk der benytter skærmlæsere, handler om tilgængelighed. For at svare på spørgsmål 2 vil vi derfor lade 1-2 blinde personer teste HFH s hjemmeside, for at fortælle os hvordan de synes den virker, og 6
om den er tilgængelig på nuværende tidspunkt. Dette kan evt. suppleres med et semistruktureret interview baseret på den samme interviewguide, men med tilpasninger. Interviews og tests af hjemmesiden skal suppleres med skrivebordsresearch, der skal afdække hvordan seende navigerer på hjemmesider, samt hvordan man sikrer tilgængelighed på hjemmesider for folk der bruger skærmlæsere. Spørgsmål 3 For at svare på spørgsmål tre vil vi analysere nogle af de hjemmesider der forhandler hjælpemidler på nettet, med særligt fokus på HFH s nærmeste konkurrent Butik Kik. Spørgsmål 4 Spørgsmål 4 besvares via den viden som det gruppemedlem, der arbejder på IBOS, har. Der er desuden foretaget et interview med hjælpemiddeludstillingens leder (se bilag). I det videre forløb tænker vi, at det vil være relevant at inddrage brugere til at teste vores idéer til en ny hjemmeside helt fra de tidligste stadier og til vores endelige koncept. Vi vil satse på low-fi prototyper, bl.a. forestiller vi os at lade testpersoner prøve vores designidé af vha. papirmodeller. 7
Litteratur Buchenau, Marion and Suri, Jane Fulton: Experience Prototyping Buxton, Bill : Sketching User Experiences Cooper, A. et al. (2007): About Face 3 - The Essentials of Interaction Design Wiley Publishing, Indianapolis. Fogg, B. J. (2003): Persuasive Technologi - Using Computers to Change What We Think and Do, Morgan Kaufmann Publishers Gregersen, Ole & Wisler-Poulsen, Ian (2009): Usability, Forlaget Grafisk Litteratur Hansen Jens H. (2005): Motiverende design, Frydenlund It- og telestyrelsen (2010), Det digitale samfund 2010, http://www.itst.dk/statistik/publikationer/detdigitale-samfund/2010/det%20digitale%20samfund%202010.pdf Jacobsen, Jan Krag (1997): 25 spørgsmål - en moderne retorik til planlægning af kommunikation, Roskilde Universitetsforlag Krug, Steve (2006): Don 't Make Me Think, 2. ed., New Riders, Indianapolis Morville, Peter & Rosenfeld, Louis (2007): Information Architecture for the World Wide Web. O'Reilly. Nielsen, Jacob (2001): Godt webdesign, IDG Forlag Rasmussen, Christian V. & Fischer, Louise H. (2008): Målgruppeanalyse - lær din målgruppe at kende, Nyt Teknisk Forlag. Sharp, H., Rogers, Y. og Preece, J. (2007): Interaction Design - beyond human-computer-interaction, 2. ed., John Wiley V & Sons Øjenforeningen (2005), Synshandicappede i Danmark antal og årlig tilgang, http://vos.dk/vos2_2005/synshandicappede.pdf Brown, Daniel M. (2007): Communicating Design - Developing Web Site Documentation for Design and Planning, s. 265-310. New Riders, California. ISBN: 978-0-321-39235-0. Engholm, Ida & Salamon, Lisa (2005): Webgenres and -styles as socio-cultural indicators- an experimental, interdisciplinary dialogue, i proceedings In the making, s. 1-6. Engholm, Ida (2008): Design history of the WWW: Website development from the s. 49 perspective og genre and style theory, i Artifact, s. 217-231. Fagerjord, Anders (2006): Web-Medier: Introduksjon til sjangre og uttryksformer på V s. 64 nettet, s. 148-174. Universitetsforlager, Oslo. 8
Garret, Jesse J. (2003): Meet the Elements, i The Elements of User Experiences: User- s. 93 Centered Design for the web, 21-36. New Riders. Gauntlett, David & Horsley, Ross (2004): Web Studies - What 's New, 2. ed., s. 3-22. s. 109 Hodder Arnold. ISBN: 0-340-81472-1. Jensen, U. et al. (2001): Tekstens disposition og byggeklodser, i Skrivgodt.dk - sådan s. 150 skriver du gode tekster til internettet, s. 62-78. ISBN 87-7887-065-8. Thorlacius, L. (2005): Æstetikkens rolle i webdesign i Medie- og s. 260 kommunikationsforskning i Norden. Nordicom - nformation 27(1), 3-15. 9
Projektorganisering I vores projektorganisering tager vi udgangspunkt i denne prototype-figur (Louise Harder Fischer. Digital Media Management): 1. etape: målgruppeundersøgelse informationssøgning analyse interviews 2. etape: designprocessen konceptudvikling udvikling af prototyper 3. etape: evaluering af prototype brugertest 4. etape: endelige udformning af redesignet 5. etape: rapportskrivning 10
Tilgængelige ressourcer og tidsplan Tilgængelige ressourcer WWW pensum samt anden litteratur Ditte, arbejder til daglig hos Instituttet for Blinde og Svagsynede, har viden om emneområdet samt adgang til yderligere information og kilder Brian og Gorm (vejledning) Tidsplan 10. nov.: Gennemgå roughboard og wireframes 17. nov.: 1. etape: Afslutning af researchfasen med færdiggørelsen af målgruppeundersøgelsen. 24. nov: 2. etape: Udvikling af prototype. 1. dec.: 3. etape: Evaluering af prototype + brugertest. 8. dec.: 4. etape: Endelige udformning af redesignet. 8.-19. dec.: 5. etape: Færdiggørelse af rapport og projekt. 11
Foreløbig disposition 1. Indledning a. Problemstilling b. Problemformulering 2. Strategi a. Skrivebordsresearch i. Hvad er det for noget med skærmlæsere? b. Interviews af målgruppen i. Blinde ii. Seende pårørende c. Udvikling af personas d. Test/analyse af det nuværende synsnerven.dk tilgængelighed/usability e. Delkonklusion - Rammer for krav til redesign 3. Det nye synsnerven.dk udvikling af prototype a. Visuelt udtryk/design fx: i. Roughboard b. Struktur fx i. Informationsarkitektur ii. Wireframes c. Skelet fx i. Indholdet 4. Brugertests a. Forberedelse b. Resultater c. Implikationer i forhold til prototypen 5. Endeligt koncept 6. Konklusion 7. Diskussion a. Videreudvikling b. Refleksion over processen 12
Motiverende design Vigtige træk ved motiverende design Motiverende design (persuasive design) skal ikke være manipulerende, men en måde at hjælpe brugeren til yderligere handling som brugeren ønsker eller kunne ønske at udføre, som fx at klikke sig frem til mere information på et site eller at færdiggøre betaling for en vare i en webshop. Motiverende design kan også være at gøre brugeren opmærksom på handlinger som brugeren evt. kunne være interesseret i at udføre, men ikke har tænkt over før han bliver promptet, som fx at få forevist "andre som har købt xxx, har også købt xxx" i en webshop. Grundlæggende motiverer designet brugeren til at træffe beslutninger om handlinger og udføre disse handlinger. (Chak 2003 (Brians slide "persuasive forms", 13/10)) Hvordan kan vi gøre brug af motiverende design i vores redesign af synsnerven.dk Synsnerven.dk er ikke visuelt tiltrækkende, og det er samtidigt besværligt at klikke sig rundt på sitet efter information. Motiverende design kan i dette tilfælde være et redesign, hvor såvel informationstilgængeligheden som det visuelle udtryk forbedres. Dvs. en pænere opstilling af navigationsmenuen, og en mindre kringlet rute rundt i menupunkterne. Det vil i højere grad motivere brugere af sitet til at klikke sig videre via menupunkterne. Samtidig vil et pænere visuelt udtryk gøre brugerens oplevelse af firmaet mere positiv: Et mere professionelt udseende site giver brugeren indtryk af et mere professionelt firma, som man har større tiltro til, og derfor med større sandsynlighed vil handle hos. 13
Informationsarkitektur Informationsarkitektur handler om strukturering af indhold på websites, herunder organisering og mærkning af data, navigation, søgning og metadata. (www.digitalweb.com/articles/information_architecture_for_the_world_wide_web_3rd_edition/) En god informationsarkitektur gør det lettere for brugere at navigere rundt på et site og finde den information han har brug for. Ift. dette har websitet synsnerven.dk tydelige problemer, så sitets informationsarkitektur bør forbedres. Først og fremmest er struktureringen af indholdet på sitet ikke tilfredsstillende. Sitets vigtigste indhold, produktkataloget, er gemt væk i en anonym menu, der endda ikke figurerer særligt tydeligt på indexsiden. Derudover henviser flere links til sider under opbygning. Der er problemer med et link, der ikke fører til en ny side på sitet, men til en download af sideindholdet. Produktkatalogerne åbner i nyt browservindue. Og der er indsat Worddokumenter samt styling i html'en til produktkatalogerne. Vi skal derfor fokusere på en forbedring af informationsarkitekturen ift.: indholdet på siderne skal være i html, og styling skal foregå i seperat stylesheet navigation og links skal simplificeres struktureringen af indholdet på siderne skal forbedres 14