Utformningen av en navigerbar och användbar e-handel för uthyrning av friluftsartiklar

Linköpings universitet SE–581 83 Linköping

VT 2021 | LIU-IDA/LITH-EX-G--21/007--SE

Utformningen av en navigerbar

och användbar e-handel för

ut-hyrning av friluftsartiklar

August Karlsson

Axel Nilsson

Beatrice Forsberg

Erik Kristiansson

Erika Hansson

Isak Nordenback

Linus Bäckbro Kuusisto

Handledare : Sonia Sangari Examinator : Aseel Berglund

Upphovsrätt

Detta dokument hålls tillgängligt på Internet - eller dess framtida ersättare - under 25 år från publice-ringsdatum under förutsättning att inga extraordinära omständigheter uppstår.

Tillgång till dokumentet innebär tillstånd för var och en att läsa, ladda ner, skriva ut enstaka kopi-or för enskilt bruk och att använda det oförändrat för ickekommersiell fkopi-orskning och för undervisning. Överföring av upphovsrätten vid en senare tidpunkt kan inte upphäva detta tillstånd. All annan använd-ning av dokumentet kräver upphovsmannens medgivande. För att garantera äktheten, säkerheten och tillgängligheten finns lösningar av teknisk och administrativ art.

Upphovsmannens ideella rätt innefattar rätt att bli nämnd som upphovsman i den omfattning som god sed kräver vid användning av dokumentet på ovan beskrivna sätt samt skydd mot att dokumentet ändras eller presenteras i sådan form eller i sådant sammanhang som är kränkande för upphovsman-nens litterära eller konstnärliga anseende eller egenart.

För ytterligare information om Linköping University Electronic Press se förlagets hemsida http://www.ep.liu.se/.

Copyright

The publishers will keep this document online on the Internet - or its possible replacement - for a period of 25 years starting from the date of publication barring exceptional circumstances.

The online availability of the document implies permanent permission for anyone to read, to down-load, or to print out single copies for his/hers own use and to use it unchanged for non-commercial research and educational purpose. Subsequent transfers of copyright cannot revoke this permission. All other uses of the document are conditional upon the consent of the copyright owner. The publisher has taken technical and administrative measures to assure authenticity, security and accessibility.

According to intellectual property law the author has the right to be mentioned when his/her work is accessed as described above and to be protected against infringement.

For additional information about the Linköping University Electronic Press and its procedu-res for publication and for assurance of document integrity, please refer to its www home page: http://www.ep.liu.se/. © August Karlsson Axel Nilsson Beatrice Forsberg Erik Kristiansson Erika Hansson Isak Nordenback Linus Bäckbro Kuusisto

The purpose of this study is to investigate how a web application can be designed to appeal to the customer group young adults on the aspects navigability and usability. This is inve-stigated with the problem thesis: How can a web application with the purpose of renting outdoor equipment be designed to be experienced as usable and navigable? The report and the study rested on a theoretical foundation for the design of the service and the methods that are used during the study as well as the definitions of the concepts that are used. This includes core concepts for the study such as usability and navigability. During the pre-study a survey was sent to the target group and during the implementation phase two user tests were performed, of which the results from the first were used to improve the then unfinished web application. The result from the second user test is used as a basis for answering the problem thesis. The methods that were used in the second user test were test of lostness, a Concurrent think-aloud (CTA) test, System Usability Scale (SUS) test and questions regarding navigability. During the development of the web application tests were done to investigate the usability and navigability of it. The results from the tests were good and the problem the-sis can thereby be answered with a few important points. For good usability it is important to implement Molich’s five golden rules and put focus on creating high efficiency on the web application. For good navigability the developers should focus on Gherke et-als eight prin-ciples, put extra focus on having a consistent navigation structure and have correct and well distinguished links.

Sammanfattning

Syftet med denna studie var att undersöka hur en webbapplikation kan utformas för att tillta-la konsumentgruppen unga vuxna utifrån aspekterna navigerbarhet och användbarhet. Det-ta undersöktes med frågeställningen: Hur kan en webbapplikation med syftet att hyra ut fri-luftsutrustning utformas för att upplevas som användbar och navigerbar? Rapporten och stu-dien vilade på en teoretisk grund för utformandet av tjänsten och de metoder som användes under studien samt de definitioner av begreppen som använts. Det innefattar kärnbegrepp för studien som användbarhet och navigerbarhet. Under förstudien gjordes en enkätunder-sökning som skickades ut till målgruppen och under implementationsfasen genomfördes två användartester, varav resultatet från det första användes för att förbättra den då icke-färdiga webbapplikationen. Resultatet från det andra användartestet användes som underlag för att besvara frågeställningen. Metoder som användes i det andra användartestet var test av vil-senhet, Concurrent think-aloud (CTA) test, System Usability Scale (SUS) test samt frågor om navigerbarhet. Under utvecklingen av webbapplikationen gjordes tester för att undersöka användbarheten och navigerbarheten av denna. Resultaten från testen var goda och fråge-ställningen kan därmed besvaras med ett par viktiga punkter. För god användbarhet är det viktigt att implementera Molichs five golden rules samt lägga fokus på att skapa hög ef-fektivitet och verkningsgrad på webbapplikationen. För god navigerbarhet bör utvecklarna fokusera på Gherke et-als åtta principer, lägga extra fokus på att ha en konsekvent naviga-tionsstruktur samt ha korrekta och väl utmärkta länkar.

Vi vill ge ett stort tack till vår handledare Sonia Sangari för god vägledning och rådgivning ge-nom mail och på våra veckovis möten. Hon har gett oss feedback under rapportens gång och alltid funnits tillgänglig för eventuella frågor. Vi vill även tacka examinator Aseel Berglund som hjälpt oss med diverse frågor och tillhandahållit ett bra upplägg under rapportens gång. Ett tack riktas också till de andra kandidatgrupperna som opponerat på vår rapport och bi-dragit med kommentarer och förbättringsförslag. Till sist vill vi tacka respondenterna som genomfört våra användartester och bidragit med data för att möjliggöra att vår frågeställ-ning tillslut kunde besvaras.

Innehåll

2.2 Fördelarna med e-handel kontra fysisk butik . . . 4

2.3 Användbarhet . . . 5

2.3.1 Vad är användbarhet? . . . 5

2.3.2 Varför användbarhet behövs för en effektiv e-handel . . . 6

2.3.3 Design för en användbar webbapplikation . . . 6

2.3.4 Tre viktiga områden inom användbarhet . . . 7

2.3.5 Kopplingen mellan navigerbarhet och användbarhet . . . 8

2.4 Navigerbarhet . . . 9

2.4.1 Introduktion . . . 9

2.4.2 Navigerbarhet på en webbapplikation . . . 9

2.4.3 Navigationsstruktur på en webbapplikation . . . 9

2.4.4 Viktiga aspekter för navigerbarhet på en webbapplikation . . . 10

2.4.5 Navigerbarhet för en effektiv e-handel . . . 11

2.5 Metodteori . . . 12 2.5.1 Mått på användbarhet . . . 12 2.5.2 Mått på navigerbarhet . . . 13 2.5.3 Användartester . . . 13 2.5.4 Enkätmetodik . . . 13 2.5.5 Vilsenhet . . . 14

2.5.6 System Usability Scale . . . 14

2.5.7 Concurrent think-aloud . . . 15

2.5.8 Frågor om navigerbarhet . . . 15

3 Metod 17 3.1 Förstudie . . . 17

3.2 Implementation . . . 18

3.2.1 System . . . 18

3.2.2 Front-End . . . 18

3.2.3 Back-End . . . 19

3.2.4 Databas . . . 19

3.2.5 Kommunikation mellan nivåerna i arkitekturen . . . 19

3.3 Utvärdering . . . 19

3.3.1 Användartester . . . 19

3.3.2 Test av vilsenhet . . . 20

3.3.3 Concurrent think-aloud . . . 21

3.3.4 Frågor om navigerbarhet . . . 21

3.3.5 System Usability Scale . . . 22

3.3.6 Användartest under implementationen av webbapplikationen . . . 22

4 Resultat 24 4.1 Förstudie . . . 24

4.1.1 Enkätundersökning . . . 24

4.1.2 Prototyp . . . 25

4.2 Implementation . . . 27

4.2.1 Startsidan och navigeringsmenyer . . . 27

4.2.2 Produktsida . . . 29 4.2.3 Varukorgen . . . 31 4.2.4 Betalning . . . 32 4.2.5 Min användare . . . 33 4.3 Utvärdering . . . 34 4.3.1 Användartest 1 . . . 35 4.3.2 Användartest 2 . . . 36 5 Diskussion 40 5.1 Resultatdiskussion . . . 40 5.1.1 Förstudie . . . 40 5.1.2 Användartest . . . 40 5.2 Metoddiskussion . . . 42 5.2.1 Metodkritik . . . 42 5.2.2 Användartester . . . 44 5.2.3 Källkritik . . . 45 6 Slutsatser 47 6.1 Slutsats . . . 47

6.1.1 Faktorer som påverkat användbarhet . . . 47

6.1.2 Faktorer som påverkat navigerbarhet . . . 48

6.1.3 Svar på frågeställning . . . 48

Litteratur 50 A Användartest 53 B Marknadsföringsplan 55 B.1 Inledning . . . 55

B.2 Vision och affärsidé . . . 55

B.3 NABC . . . 55

B.3.2 Approach . . . 56

B.3.3 Benefit . . . 56

B.3.4 Competition . . . 57

B.4 Omvärldsanalys . . . 58

B.4.1 PEST-analys . . . 58

B.4.2 Porters fem krafter . . . 59

B.5 Konkurrentanalys . . . 60 B.6 SWOT . . . 61 B.6.1 Styrkor . . . 61 B.6.2 Svagheter . . . 62 B.6.3 Möjligheter . . . 62 B.6.4 Hot . . . 62 B.7 Marknadsmål . . . 62 B.8 Segmentering . . . 63 B.9 Targeting . . . 63 B.10 Positionering . . . 64 B.11 Marknadsmix . . . 64 B.11.1 Produkt . . . 64 B.11.2 Pris . . . 65 B.11.3 Påverkan . . . 65 B.12 Enkätundersökning . . . 68 B.13 Navigerbarhet frågor . . . 71

3.1 Webbapplikationens systemarkitektur . . . 18

4.1 Varukorgen för prototypen gjord på papper . . . 26

4.2 Produktsidan för prototypen gjord på papper . . . 26

4.3 Produktsidan för prototypen gjord i PowerPoint . . . 27

4.4 Startsida för prototypen gjord i PowerPoint . . . 27

4.5 Webbapplikationens startsida . . . 28

4.6 Webbapplikationens produktsida . . . 29

4.7 Webbapplikationens mer info-modal . . . 30

4.8 Webbapplikationens boka modal . . . 31

4.9 Webbapplikationens klick på boka knapp utan att vara inloggad . . . 31

4.10 Varukorgen . . . 32

4.11 Bokningsbekräftelse . . . 33

4.12 Min användare . . . 34

4.13 Modal för att ändra användar information . . . 34

4.14 Antal klick per testanvändare . . . 35

4.15 Testanvändarnas upplevda navigerbarhet . . . 36

4.16 Testanvändarnas upplevda vilsenhet . . . 37

4.17 Testanvändarnas resultat av SUS-test . . . 38

A.1 Testanvändarnas upplevda vilsenhet . . . 53

A.2 Testanvändarnas resultat av SUS-test . . . 54

A.3 Hemsidans upplevda navigerbarhet . . . 54

B.1 Figuren visar hemsidans förstasida. . . 65

B.2 Figuren visar en prototyp av webbapplikationen då användaren navigerat till ut-rustningssidan. . . 65

1

Inledning

1.1

Motivering

Vår värld är under ständig utveckling och under de senaste åren har megatrender som håll-barhet och hälsomedvetenhet genomsyrat samhället och format vårat sätt att leva 1. Inte minst Covid-19 med medföljande reserestriktioner har fått svenskarna att se sig om efter upplevelser i den svenska naturen. Då Svenska Turistföreningen (STF) år 2020 genomförde en stor undersökning där svenska folkets reseanledningar kartlades, visade det sig att vandring var den i särklass mest efterfrågade aktiviteten bland inhemska turister. Endast reseanled-ningen ”besöka vänner” slog vandringen i popularitet2. Dessutom uppmättes besöksrekord på Svenska Turistföreningens fjällanläggningar under sommaren 2020 med en total ökning på 8% jämfört med sommaren 20182_{. I syfte att möta intresset och tillgängliggöra vandring} som aktivitet runtom i Sverige har flertalet initiativ startat, exempelvis Vandringens dag och arrangerade familjefjällsveckor3.

Vandring i Sverige kan vara ett jämförelsevis miljövänligt och ekonomiskt semesteralternativ. Trots att pengar eventuellt sparats, tack vare uteblivna flygbiljetter och hotellnätter, kan kost-naderna bli stora. Investeringskostnader i exempelvis ryggsäckar, stormkök och tält skulle kunna upplevas som höga trösklar, inte minst för en person som bara vill prova på aktivi-teten eller har knappa ekonomiska resurser. Utan att hävda att kausalitet förekommer, finns det en korrelation mellan inkomstnivå och frekvens i utförandet av friluftsaktiviteter [8]. En-ligt Statistiska Centralbyråns kartläggning av svenskarnas levnadsförhållanden hade 47.6% av de tillfrågade som tillhörde den lägsta inkomsttertilen varit ute i skog och mark mer än 5 gånger under de senaste 12 månaderna[3]. Motsvarande siffra för högsta inkomsttertilen var 64.6%[3]. Andelen tillfrågade som inte alls varit ute i skog och mark under de senaste 12 månaderna var 37.7% för undersökningsdeltagare tillhörande den lägsta inkomsttertilen respektive 16.9% för högsta inkomsttertilen[3]. Det finns även stora skillnader mellan ålders-grupper när det gäller andel som varit ute i skog och mark mer än 6 gånger de senaste 12

1_{[https://www-portal-euromonitor-com.e.bibl.liu.se/portal/Analysis/Tab]}

2_{[https://www.svenskaturistforeningen.se/om-stf/aktuellt/rekord-for-svemesterfjallen]}

månaderna. Av de tillfrågade i åldern 20-29 var den siffran 50,7%, medan samma siffra för åldergrupperna 30-79 år låg mellan 56,7-69,7%4.

Unga vuxna är en målgrupp vilken rör sig med begränsade resurser. Enligt enkäten som gjordes under förstudien angav 88,8% av respondenterna att de saknade den nödvändiga utrustning som krävs för att utföra den friluftsaktivitet de skulle vilja göra. I en undersök-ning av Naturvårdsverket hävdade över en tredjedel av de tillfrågade att just avsaknaden av nödvändig utrustning hade hindrat dem från att utföra friluftsaktiviteter [8]. Då intresset för friluftsprodukter finns, men de ekonomiska resurserna är knappa, finns skäl att utforska möjligheterna att tillgodose detta behov. En möjlig lösning för att tillgodose efterfrågan är att skapa en webbapplikation för uthyrning av friluftsprodukter. Följande webbapplikation bör utformas på ett sådant sätt, med avseende på användarbarhet och navigerbarhet, att unga vuxna tilltalas.

Med utgångspunkt i ovannämnda trender och statistik undersöks därför hur en webbap-plikation kan konstrueras med avseende på navigerbarhet och användbarhet för att tilltala målgruppen unga vuxna. Det är även av intresse att undersöka vilka faktorer som påverkar en användare av webbapplikationen att genomföra en bokning av produkter. Anledningen till varför det är relevant att undersöka användbarhet och navigerbarhet är eftersom Palmer [27] hävdar att användbarhet och navigerbarhet har stor påverkan för hur en användare upp-fattar en hemsida [27]. Då målet är att ha nöjda användare blir de nödvändigt att ta hänsyn till dessa principer.

1.2

Syfte

Denna rapport syftar till att undersöka hur en webbapplikation kan utformas för att tilltala målgruppen unga vuxna i åldern 18-29 utifrån aspekterna navigerbarhet och användbarhet.

1.2.1

Frågeställning

Arbetet genomförs med syfte att besvara följande frågeställning:

Hur kan en webbapplikation med syftet att hyra ut friluftsutrustning utformas för att upplevas som användbar och navigerbar?

Upplevd navigerbarhet och användbarhet mäts med hjälp av kvantitativ samt kvalitativ re-spons från testanvändare tillhörande vald målgrupp.

1.3

Avgränsningar

Rapportens fokus är på unga vuxna som målgrupp, vilket i denna rapport definieras som personer mellan 18 och 29 års ålder. Av detta följer att det i de avsnitt där begreppet använ-dare används, avses i sådana använanvän-dare som också är unga vuxna. Märk väl att den litteratur som det hänvisas till i rapporten dock också använder begreppet användare, och då i ordets ursprungliga bemärkelse. I de fall begreppet används när det refereras till litteratur avses således ordets ursprungliga betydelse.

Enligt ovan är deltagare i enkätundersökningen såväl som användartester avgränsad till den valda målgruppen. Enkätundersökningen avgränsades till att förutom att innehålla generel-la frågor om en webbapplikations utformning och funktioner, även innehålgenerel-la frågor specifikt avseende webbapplikationer för uthyrning samt utrustning och dylika produkter. I syfte att mäta användbarheten på webbapplikationen ur en besökares synvinkel har metoderna Sy-stem Usability Scale (SUS) [2] samt Concurrent think-aloud (CTA) [22] använts. För att mäta

1.3. Avgränsningar

navigerbarhet ur samma synvinkel har vilsenhet uppmätts samt frågor om navigerbarhet har formulerats och ställts till personer ur målgruppen.

Det ska noteras att webbapplikationen i fråga behandlar uthyrning. Därför anses det att web-bapplikationen faller under marknaden för e-handel.

2.1

Uthyrning av artiklar

Den största fördelen med att hyra utrustning är flexibiliteten det ger[5]. Med flexibilitet me-nas att konsumenter kan välja när de vill ha tillgång till en viss produkt, vilket leder till en känsla av frihet. Även aspekten att inte behöva reparera och uppgradera utrustning faller under begreppet flexibilitet. Lehner [5] fortsätter att beskriva hur ekonomiska aspekter är en viktig del vid uthyrning, där fördelen med att slippa den stora kostnaden att köpa produkten direkt lyfts fram som den största ekonomiska aspekten [5]. Två andra fördelar med att hyra produkter som lyfts fram är smidigheten med att inte behöva äga produkten under en längre tid samt miljöfördelar som uthyrning erbjuder[5].

Potentiella kunder fokuserar på kvaliteten av produkten och hur trovärdig hemsidan verkar vara1. Mycket av utmaningarna för en uthyrningtjänst kopplas till dessa två faktorer där operatören måste se till att produkterna som hyrs ut är av bra kvalitet och i bra skick. Så för att hantera dessa problem bör operatören fokusera på att få förtroende från kunder genom att genomföra grundliga kvalitetskontroller innan uthyrning samt undersöka profilen som ska hyra en produkt1.

2.2

Fördelarna med e-handel kontra fysisk butik

I takt med att världen blir allt mer digitaliserad har e-handeln ökat i popularitet. 9 av 10 kun-der i Storbritannien väljer e-handel som första alternativ när de ska köpa en ny produkt[20]. Trenden är liknande i andra länder [20]. En stor anledning till e-handelns ökade popularitet på bekostnad av fysiska butiker är dess fördelar[23]. De mest centrala fördelarna listas nedan:

Kunden slipper stå i kö

Att slippa stå i kö är fördelaktigt för kunden som sparar tid. Att stå i kö länge i en fysisk butik kan orsaka frustration vilket försämrar hela köpupplevelsen.

2.3. Användbarhet

Möjligheten att handla i butiker som inte ligger geografiskt nära

Genom postombud har kunden möjlighet att köpa varor och få dem levererade till hemmet, i kontrast till en fysisk butik där detta inte är möjligt eftersom kunden måste först transportera sig till butiken. Det öppnar upp en ny marknad med kunder som inte bor i anslutning i butiken vilket ökar möjligheterna till en större kundbas som gynnar lönsamheten[23].

E-handeln är öppen dygnet runt

Genom en ökad tillgänglighet i form av öppettider har kunden större möjlighet att köpa pro-dukter när det passar den[23]. Fysiska butiker har oftast betydligt mer begränsade öppettider i jämförelse.

Fler valmöjligheter

I en fysisk butik måste det finns plats för produkten i lokalen och utöver detta ett lager[23]. Då behovet av en butikslokal elimineras vid e-handel och produkterna inte tar plats har kunden möjlighet att se fler produkter[23]. Det sparar också företaget kostnader eftersom investering i en butikslokal inte krävs[23].

Större informationstillgång

I en e-handel kan produkten presenteras på ett mer genomgripande sätt[23]. Det gör att kun-den har mer information att tillgå vid ett köp och känner sig därmed tryggare i deras val[23]. För att nå kunden och ha en större möjlighet att vara lönsamma krävs det därmed att företa-gen har etablerat sig på marknaden för e-handel[23].

2.3

Användbarhet

Nedan förklaras vad användbarhet är, varför det är viktigt, hur det mäts och hur användbar-het uppnås genom design, effektivitet, verkningsgrad och tillfredsställelse.

2.3.1

Vad är användbarhet?

International Standards Organization (ISO) definierar användbarhet som "extent to which a system, product or service can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use"[25].

Användbarhet innebär dock inte endast att ett system är enkelt att använda utan inkluderar även faktorer som vilken uppfattning användarna har av systemet samt hur användarupp-levelsen påverkar användaren [25]. Lee et al [17] beskriver att användbarhet innebär att pro-dukter är enkla att lära sig, effektiva, vilket innebär hur bra propro-dukterna är på att utföra det de är designade för, och behagliga att använda samt hjälper användarna att utföra sina upp-gifter genom produkterna [17]. Geisen et al [10] menar att användbarhet kan brytas ner i fem kategorier; produkten användarna av produkten, användarnas mål, användningens kontext samt mätvärden för att utvärdera användbarhet [10].

Vidare beskrivs att för att testa användbarheten måste vi ta reda på hur väl användarna (an-vändarna av produkten) kan använda produkten för dess utsatta ändamål (användningens kontext)[10]. För att sedan utvärdera användbarheten testar vi hur väl användarnas mål upp-nås av produkten och dessa mätvärden kan t.ex. vara effektivitet, kvalitet eller nöjdhet hos användaren [10].

2.3.2

Varför användbarhet behövs för en effektiv e-handel

Den primära anledningen till att användbarhet bör prioriteras är för att kunna stå ut i kon-kurrensen [15]. Syftet med användbarheten är att få webbapplikationen att vara enkel och tillfredsställande vilket gör att användaren fortsätter besöka den [15]. Användaren vill inte slösa tid på att lära sig webbapplikationen vilket gör att om användbarheten klassas som dålig skulle användaren istället byta webbapplikation [15].

Genom att leverera en användbar webbapplikation finns det en betydligt större chans till regelbundna besökare, något studier visar [17]. Lacey [15] betonar även att en hög använd-barhet inger en positiv känsla hos kunden [15]. Denna positiva känsla fungerar som ett sub-stitut för det intryck säljaren ger kunden och har betydelse för kundrelationen som blir mer långsiktig. En långsiktig kundrelation tillsammans med ett högre antal regelbundna besökare ökar omsättningen[17]. Det är inte bara kundrelationer och antalet besökare som ökar, utan företagets varumärke blir starkare om deras webbapplikationen har hög användbarhet [17]. Studier visar att endast mellan 10 - 40% av framgångsfaktorn hos en webbapplikation kan härledas till kodningen [15]. Att webbapplikationen ska ha ett läckert utseende är överskattat enligt designers som pekar på dessa studier [15]. Samma studier har visat att en annan viktig framgångsfaktor hos en webbapplikation är känslan den förmedlar till användaren[15]. An-vändarens upplevelse av systemet kan härledas tillbaka till användbarheten som alltså är en viktig framgångsfaktor.

2.3.3

Design för en användbar webbapplikation

Molich [21] skriver att en webbapplikation inte bara kan se bra ut för att den ska vara an-vändbar för användarna, även hur användarna tar sig runt på sidan är en viktig aspekt [21]. Problem med användbarhet på sidor kan till exempel vara att varor är svåra att hitta på si-dan, priser är gömda för användaren samt information och felmeddelande är svåra att förstå [21]. Vidare skriver Molich [21] att dessa problem är viktiga för användbarheten och att om de skulle uppstå i en vanlig fysisk butik skulle butiken uppleva negativa konsekvenser. När en programmerare designar en webbapplikation kan den kännas självklar för program-meraren själv, men missförstånd kan ändå uppstå hos användaren [21]. Molich [21] tar upp ett exempel med en informationsruta med texten “Press any button”, för programmeraren känns det självklart att användaren ska klicka på vilken knapp som helst medan användaren kan tro att den ska trycka på en viss “any”-knapp. För att undvika dessa problem måste ut-vecklarna av produkten sätta sig in i användarens ögon för att få en inblick i hur produkten bör designas, vilket kan göras genom att jobba tillsammans med användarna under utveck-ling och ta med deras åsikter och tankar om användbarheten [21].

Molich [21] skriver om “The five golden rules” när det kommer till att designa en användbar webbapplikation vilka är [21]:

1. Know your users 2. Involve your users

3. Iterate: Test and correct the design 4. Learn from others

5. Coordinate all aspects of the user interface

Den första regeln är “Know your users”, vilket innebär att identifiera vilka användarna av webbapplikationen kommer vara [21]. “Involve your users” är den andra regeln som innebär

2.3. Användbarhet

att användarna ska vara involverade genom att testa prototyper och diskutera vad som kan förbättras [21]. Den tredje regeln är “Iterate: Test and correct the design” där användarnas respons från testen implementeras i designen [21]. “Learn from others” är den fjärde regeln som beskriver hur det är viktigt att vara i alla fall lite bättre än sina konkurrenter [21]. För att lyckas med detta menar Molich [21] att konkurrenters webbapplikationer bör studeras och att lärdom tas från både bra och dåliga aspekter av deras webbsidor Molich [21]. Den sista regeln “Coordinate all aspects of the user interface” betyder att designen och användarupplevelsen ska vara konsekvent på hela webbapplikationen och att en standard bör tas fram för att detta uppfylls [21].

Molich [21] beskriver att design utifrån användbarhet är ett måste för att en webbapplikation ska vara konkurrenskraftig [21]. Fördelar som nya och lojala kunder, kostnadsbesparingar och stärkt företagsidentitet är exempel på vad en webbapplikation designad utifrån använd-barhet kan leda till [21].

Sharp et al [28] beskriver även synlighet, feedback och överkomlighet som viktiga aspekter vid design av produkter [28]. Synlighet innebär att funktioner är tydligt beskrivna så att an-vändaren av produkten med enkelhet förstår vad funktionen innebär, detta innefattar även att funktionerna bör vara placerade på naturliga ställen som användaren enkelt kan hitta funktionen [28]. Ett illustrativt exempel som ges på synlighet är hur knappar och kontroller i bilar är placerade och utformade, knapparna visar tydligt med bilder vad deras funktion är och är placerade på tydliga ställen, demsamma principerna gäller för webbapplikationer. Feedback beskrivs som information som levereras tillbaka till användaren när något utförs. Feedback kan ha formen av till exempel ljud, bilder eller genom känsel där val av rätt feed-back för en funktion spelar stor roll för feedfeed-backens betydelse [28]. Överkomlighet är ett begrepp som används när ett objekt tydligt visar hur det ska användas [28]. Överkomlighet innebär att produkter och objekt blir lätta att använda och “ger en ledtråd” om vad funk-tionen är [28]. I digital design används överkomlighet till exempel på knappar, länkar samt rullningslister för att förmedla deras funktion till användaren på ett enkelt sätt [28].

2.3.4

Tre viktiga områden inom användbarhet

Lee et al nämner [17] tre kärnvärden som är centrala för att skapa en webbapplikation med god användbarhet [17]. Dessa är effektivitet, verkningsgrad och tillfredsställelse [17].

Effektivitet

Effektivitet handlar om att användaren ska nå det mål (exempelvis att ta del av en viss in-formationskälla) de har med webbapplikationen så snabbt och felfritt som möjligt[17]. Med felfritt menas det att användaren exempelvis inte klickar på fel rubrik eller framkallar ett fel-meddelande [19]. Dessa hänger även ihop. Desto mindre fel som begås ju snabbare kan ett mål uppnås. För att förebygga fel och minimera dess konsekvenser bör en webbapplikation vara förlåtande [19]. Nedan är ett antal strategier för att designa en förlåtande webbapplika-tion [19].

• Överkomligt system - Webbapplikationen ska vara designad och influera användaren efter dess huvudsakliga syfte [19]. Om en knapp designas tre-dimensionellt kommer den påminna användaren hur knappar fungerar och på så sätt påverka denne att trycka på knappen [19].

• Möjligheten att ångra ett fel - Det gör att ett fel kan ångras och är praktiskt om använ-daren ångrar sitt beslut [19]

• Bekräftelse - Om användaren försöker begå en handling som anses kritisk bör detta bekräftas för att användarens avsikt ska verifieras [19].

• Varning - Varnar användaren om denna är på väg att begå en handling som med stor sannolikhet är ett fel, exempelvis att ta bort ett dokument [19].

• Hjälp - Bistår med information för felsökning och kring elementära operationer [19].

Överkomligt system, möjligheten att ångra ett fel och ett säkerhetsnät är de viktigaste att implementera [19]. Det beror på att om dessa är effektiva kommer bekräftelser, varningar och hjälp inte behöva användas i lika stor utsträckning [19]. Exempelvis om ett fel kan ångras är en bekräftelse inte lika viktiga [19].

Verkningsgrad

Verkningsgraden är kopplad till hur stor mängd resurser som används i relation till att uppnå ett specifikt mål. En webbapplikation som har en enklare design och har lättläst text är lättare att lära sig. På så sätt används inte lika stora kognitiva resurser för att nå målet. Verknings-graden är således kopplad till användarvänlighet [17].

Lee et al [17] nämner lättanvänd sökning, navigation och läsning som viktiga att implemen-tera [17] . När detta ska göras bör Hick’s law [19] tas i beaktning. Den lyder: “Tiden det tar att fatta ett beslut ökar om antalet alternativ för att fatta beslutet ökar” [19] .

För att minska antalet alternativ för att nå ett beslut bör bl.a. simplare menyer och en väg-ledande layout implementeras. Syftet med dessa är att ett minimalt antal klick ska leda till ett beslut [19]. Principen om Ockhams rakkniv bekräftar detta [19]. Den pekar på att om två designer har samma funktionalitet så ska den simplaste designen med det minsta antalet visuella element föredras [19].

Tillfredsställelse

Komfort och acceptans utgör två faktorer som skapar tillfredsställelse [17]. För att öka till-fredsställelsen bör webbapplikationen ha alternativ för att supporta användaren[17]. Lidwell et al [19] nämner FAQ, live-chatt med anställda och tjänster som är väl skyddade som exem-pel på saker som supportar användaren och därmed ökar tillfredsställelsen[19] .

Lee at al [17] pekar på 5 användbarhetsfaktorer ökade tillfredsställelsen. Dessa är: nedladd-ningshastighet, navigerbarhet, interaktion, innehåll och respons [17]. Begreppen associeras med både effektivitet och verkningsgrad vilket tyder på att dessa är kopplade till tillfredstäl-lesen [17].

Varje designer strävar efter att skapa en uppslukande upplevelse för användaren [19]. Denna upplevelse kännetecknas av att en lång tidsperiod känns kort, en känsla självförtroende och att det verkliga livet (såsom irritationer över vardagsproblem) försvinner [19]. Om använda-ren når detta stadium åstadkommer den en hög grad av tillfredsställelse [19]. För att uppnå stadiet krävs att designern hittar en balans när användaren utmanas [19]. Om utmaningen är för lätt blir användaren uttråkad, och en för svår utmaning gör att blir den stressad [19]. En webbapplikation som minimerar distraktioner, ger en känsla av kontroll och stimulerar för att användaren ska glömma den verkliga världen ger goda förutsättningar att skapa denna upplevelse [19].

2.3.5

Kopplingen mellan navigerbarhet och användbarhet

Navigerbarhet och användbarhet är starkt kopplade till varandra och den ena påverkar den andra [29]. Navigerbarhet kan i stora drag kopplas till många av användbarhetens koncept

2.4. Navigerbarhet

och de samspelar vid utvecklingen av design och funktionalitet för en webbapplikation [33]. Ett exempel på denna samspelan är att en dålig navigerbarhet kan leda till en dålig använd-barhet på en webbapplikation. Navigeranvänd-barhet och användanvänd-barhet samspelar och de kan inte beaktas utan någon påverkan på varandra [29].

2.4

Navigerbarhet

Nedan beskrivs vad navigerbarhet är, varför det behövs för en fungerande e-handel, hur det kan implementeras samt olika sätt att strukturera navigationen på webbapplikationen. Till att börja med definieras navigerbarhet matematiskt och sedan beskrivs hur den kan användas på en webbapplikation och till sist hur den bör användas för att skapa en effektiv e-handel.

2.4.1

Introduktion

Navigerbarhet är en viktig aspekt att ta hänsyn till vid design av webbapplikationer. Navi-gerbarhet är definierat som enkelheten för en användare att lokalisera och komma åt relevant information[27]. Navigerbarhet kan vara en svår sak att implementera i en webbapplikation eftersom den är subjektiv, dock går den att mäta. Alla har olika uppfattningar om hur en na-vigerbar sida bör se ut. Men anledningen till att implementera en god nana-vigerbarhet på en webbapplikation är att en användare snabbt ska kunna hitta informationen de letar efter [35]. Det är speciellt viktigt att implementera en god navigerbarhet på e-handelssidor. Detta då navigerbarheten på e-handelssidor är avgörande för om kunder lockas till att handla på web-bapplikationen, eller om de väljer att lämna sidan [9].

2.4.2

Navigerbarhet på en webbapplikation

Nedan beskrivs viktiga principer att tänka på för utformningen av en navigerbar webbappli-kation.

Navigerbarhet består av fyra kärnpunkter [11]:

1. Att organisera och klassificera informationen 2. Att sätta rubriker på informationen

3. Att designa navigationssystem

4. Att hjälpa användare att hitta information

Utöver dessa fyra ovannämnda punkter är det viktigt för företag som bedriver e-handel att erbjuda kunden ett sätt att kunna navigera sig på, genom en sökmotor, en navigationsfält eller genom en meny. Dessa saker gör att kunden kan upprätthålla en mental karta över var i webbapplikationen de befinner sig på och vilka steg de behöver ta för att nå önskade informationen [11].

2.4.3

Navigationsstruktur på en webbapplikation

Navigationsstruktur är viktigt att ta hänsyn till vid utformning av en webbapplikation, nedan beskrivs vad nagiationsstruktur är och hur det påverkar webbapplikationen.

Navigationsstrukturens utformning

Farkas och Farkas [7] skriver i sin artikel att navigation är en metafor för webbanvändning [7]. De hävdar att navigation på webben kan formaliseras genom att beskriva navigationen i form av att användaren förflyttar sig mellan noder via bågar [7]. Noderna definieras som olika delar av webbinnehåll, ungefär som en individuell webbssida på webbplatsen [7]. Bågar motsvarar den elektroniska vägen mellan dessa noder som gör att användaren kan förflytta sig från en nod till en annan till exempel länkar eller knappar. [7].

Rent matematiskt kan en webbplats modelleras som ett par.

ăG, S ą där G= (V, E) (2.1)

Formeln 2.1 beskriver en riktad graf som representerar webbplatsen [35]. V är mängden no-der, där varje nod representerar en enskild webbsida [35]. E är mängden bågar som represen-terar länkarna mellan webbplatsens individuella sidor. S represenrepresen-terar webbplatsens startsi-da och utgör grafens startnod [35]. En hel webbplats utgörs av ett nätverk av noder och bågar [7]. Dessa nätverk kan ordnas i särskilda konfigurationer som kallas informationsstrukturer. Några av dessa strukturer kallas för hierarki, linjär struktur (samt en flervägsvariant av den), webb (vilket är en oordnadstruktur) och matris [7]. Hierarki är den mest allmänt förekom-mande strukturen [7]. Det beror på att människor naturligt ordnar saker genom att skapa kategorier och subkategorier [7]. Hierarki ger också en användbar kombination mellan ord-ningar och frihet i navigeringen [7].

2.4.4

Viktiga aspekter för navigerbarhet på en webbapplikation

För att skapa en effektiv och navigerbar webbapplikation föreslås åtta principer att följa. De åtta principerna är att använda väl utmärkta och korrekta länkar, att undvika användningen av ramar, håll navigation konsekvent, ha en effektiv sökmotor, använda distinkta och välmar-kerade knappar, använda långa sidor med länkar, använda sidkartor och att undvika länkar som öppnar upp nya fönster och annonser [9].

Väl utmärkta och korrekta länkar

Att klicka på felaktiga länkar eller länkar som leder användaren till fel sida är både irrite-rande och tidsödande [9]. Det gör att navigerbarheten på webbapplikationen minskar och användare lägger mer tid för varje hittad information. För att motverka detta ska varje länk besvara två frågor. Den första är “Vad kommer jag få om jag klickar här?” och den andra är “Varför skulle jag ville ha det?” [9].

Undvik användningen av ramar

Ett användbart sätt att använda sig av ramar är för att låta företagsloggan synas från under-liggande webbsidor [1]. Detta är dock ett stort misstag för navigerbarhet [1]. Användningen av ramar påverkar navigerbarhet negativt eftersom det kan leda till onödig scrollning, ned-brytning av sidor i mindre fönster samt att vissa webbläsare inte stödjer ramar vilket gör att sidan kanske inte ens fungerar [1].

Håll navigationen konsekvent

Navigationen kan bestå av många olika aspekter som en sökmotor, ett navigationsfält eller en rullgardinsmeny [32]. Alla dessa kan fungera och har sin plats, men att kombinera dem och göra att användaren kan nå sidor från flera menyer och fält på olika sidor av skärmen kommer att leda till förvirring och minskad navigerbarhet [32]. Därför ska en tydlig metod väljas för navigation och den hållas konsekvent genom hela webbapplikationen, på alla sidor [32].

2.4. Navigerbarhet

Ha en effektiv sökmotor

Att ha en effektiv sökmotor på webbapplikationen gör att användare lättare kan hitta infor-mation de söker efter och därmed öka navigerbarheten [9]. Däremot är det inte alltid nöd-vändigt att ha en sökmotor. Det är oftast bra att ha en sökmotor för företag som säljer väldigt många artiklar, exempelvis Walmart [9].

Använd distinkta och välmarkerade knappar

Att använda sig av tydligt färgade och annorlunda former på knappar kan leda till enklare navigering på webbapplikationen samt en mer personlig känsla [7].

Använd långa sidor med länkar

Att använda sig av långa sidor med länkar istället för att ha nya sidor som öppnar upp och användaren går djupare i webbapplikationen kan förbättra navigerbarheten [9]. Det kan även göra att laddningstiden minskar då färre sidor behöver laddas [9].

Använd sidkartor

Stora webbapplikationer med många sidor bör ha en sidkarta där användaren kan hoppa från vilken sida som helst till vilken annan sida som helst på webbapplikationen [9].

Undvik länkar med popup-fönster och annonser

Att ha popup-fönster för nya sidor som användaren klickar på samt annonser som dyker upp gör användaren irriterad och det ökar känslan av förvirring för var på webbapplikationen användaren är [9].

2.4.5

Navigerbarhet för en effektiv e-handel

Nedan beskrivs problemen med en icke-navigerbar e-handel och vilka åtgärder som kan vid-tas för att åtgärda det.

Problem med en icke-navigerbar webbapplikation för e-handel

När en kund handlar i fysiska butiker sker en interaktion mellan kunden och säljaren. Denna interaktion kan upplevas som positiv eller negativ beroende på hur duktig säljaren är. När en kund istället besöker en e-handelssida finns inte denna säljaren som bistår med upplevelsen som kunden uppfattar. Det är istället utformningen av webbapplikationen som avgör kun-dens känsla av positivitet när den handlar, vilket har stor påverkan för kundrelationer och slutligen försäljarens omsättning [4].

Det är därför mycket viktigt att skapa en webbapplikation som gör att kunder hittar det de söker efter snabbt och enkelt [9]. Det innebär även att en avsaknad av god navigerbarhet kan leda till att användaren känner sig förvirrad, irriterad, tappar bort sig på sidan och även många gånger lämnar webbapplikationen för gott [9]. Det har visat sig att cirka 65% av alla besök på e-handelsplattformar inte leder till något köp. Detta beror på att användare inte hittar det de letar efter. Det finns även fler negativa effekter av att kunder inte hittar det de letar efter på webbapplikationen [4]. Kunder återkommer inte till webbapplikationer som de fått ett initialt dåligt intryck av, vilket till slut kan leda till för få kunder som besöker webbsidan [4].

Åtgärder att vidta för att skapa navigerbar e-handel

Som tidigare nämnts, att cirka 65% av besöken på webbapplikationer inte leder till något köp är det extra viktigt att göra det enkelt för användare att hitta till köpknappen om de

bestämmer sig för att göra det [4]. Ett sätt att göra det på är att alltid ha en knapp som leder till kassan synlig oavsett var på webbapplikationen du är. Alltså ska ett köp alltid enbart vara ett klick bort [9].

För att användaren på ett enkelt sätt ska navigera till startsidan bör alla sidor alltid ha en knapp som länkar till startsidan [7]. Denna knapp kan vara en individuell hemknapp men det som väljs av många företag är att göra logotypen till en hemknapp istället [7]. Syftet till att alltid ha en hem-knapp är att om en användare känner sig förvirrad eller ha tappat bort sig kan de enkelt hitta tillbaka till startsidan och starta om informationsletandet [7].

2.5

Metodteori

Nedan förklaras teorin bakom mätningen av webbapplikationens navigerbarhet och använd-barhet. Först förklaras det hur dessa begrepp kan mätas och med hjälp av vilka metoder. Dessa metoder som tas upp är enkätmetodik, vilsenhet, system usability scale, concurrent think-aloud, frågor om navigerbarhet samt användartester.

2.5.1

Mått på användbarhet

För att avgöra hur bra användbarheten är hos en webbapplikation måste resultaten vara mät-bara. Molich [21] listar fem punkter som är starkt kopplade till användbarheten och hur de kan mätas [21]. Dessa punkter förklaras sedan i styckena under.

Dessa är:

• Hur lätt det är att lära sig webbapplikationens utformning

• Hur lätt det är att lära sig webbapplikationens utformning efter att inte ha rört den på ett tag

• Effektivitet • Förståelse

• Användarens tillfredsställelse

De första två punkterna i listan kan summeras till användarvänlighet. Ett användarvänligt system kännetecknas av att det är behagligt och lätt att lära sig [21]. Användarvänligheten mäts genom att mäta inlärningstiden [21] vilket mäts genom att användaren utför ett gäng förutbestämda uppgifter på webbapplikationen [21].

Effektivitet beror på flertalet komponenter, bl.a frekvensen fel som begås och hur pass snabb webbapplikationen är [21]. Den mäts genom att mäta tiden det tar för användaren att utföra en specifik uppgift [21].

För att få en bild hur pass bra användaren förstår webbapplikationen kan denne svara på frågor kopplat till webbapplikationen efter att ha använt den [21]. Här måste kvaliteten hos svaren och användarens feedback tas i beaktning [21]. Hur pass tillfredsställd användaren blir beror på hur webbapplikationen presterar i punkterna nämnt ovan [21].

För att få en bild av användarens tillfredsställelse bör intervjuer och frågeformulär användas [21]. Om webbapplikationen har en specifik målgrupp bör svaren från denna grupp ha störst vikt [21]. Studier visar att inlärningstiden, och därmed enkelheten är den viktigaste faktorn för användarens tillfredsställelse om den sällan besöker webbapplikationen [21].

Om användaren besöker webbapplikationen ofta är effektiviteten den viktigaste faktorn för hög tillfredsställelse [21].

2.5. Metodteori

2.5.2

Mått på navigerbarhet

Då navigerbarhet kan upplevas som subjektivt finns det flera sätt att bryta ned problemet och mäta hur navigerbar en webbapplikation är. Ett sätt att skapa en navigerbar webbsida är att i designfasen göra en enkät där användare får svara på frågor gällande navigerbarhet på webbsidan. Frågorna kan vara “Hur enkelt kan du identifiera var på webbsidan du befinner dig?” och “Hur lika är de navigations elementen jämfört med andra webbapplikationer?” där frågorna besvaras på en skala från 1 till 5 [35].

En annan aspekt som kan bidra till den upplevda navigerbarheten är vilsenheten vid an-vändandet av en webbapplikation. Vilsenhet innebär i detta sammanhang att en användare har svårt att hitta och navigera på en webbapplikation [29]. Vilsenhet kan mätas med hjälp av en formel som Smith tagit fram. Ett praktiskt sätt att genomföra mätningar på är genom användartester. Det går ut på att användare ur den utvalda målgruppen testar webbappli-kationen. Testet kan bestå av flera olika metoder så att en helhetsbild av webbapplikationen kan fås [28].

2.5.3

Användartester

Användartester är en experimentationsform där användare från den utvalda målgruppen testar om produkten som tillverkats är användbar enligt de krav som satts upp [28]. An-vändartester kan användas för att mäta både användbarhet men också navigerbarhet på en webbapplikation. Syftet med att använda användartester är för att besvara frågeställningen. Testerna utformas på ett sätt som gör att det blir enkelt att besvara frågeställningen men också så att målen går att mäta [28]. Användartester kan även användas i början av en implementa-tionsfas för att arbeta iterativt med prototyper och andra strukturella designer som kommer att påverka webbapplikationen [28].

Användartester görs i en kontrollerad miljö där utvärderaren har kontrollen över vad testaren ska göra [28]. All data som kan mätas ska samlas in, i form av navigering på sidan, knapp-tryck, kommentarer och reaktioner. Typisk sett behövs mellan 5 och 12 personer som utför testningen av webbapplikationen för att få tillräckligt tillförlitliga resultat [28]. Testningen kan bestå av en hopslagning av många olika metoder, för att få en mer heltäckande bild av webbapplikationen. Dessa metoder kan till exempel mäta navigerbarhet och användbarhet [28].

2.5.4

Enkätmetodik

Vid utformandet av frågor till en enkätundersökning finns det några aspekter som är viktiga att tänka på. Det är viktigt att språket anpassas till målgruppen [6]. Orden som väljs mås-te förstås av respondenmås-terna [6]. En annan viktig del är att frågor och svarsalmås-ternativ måsmås-te kunna tolkas entydigt, annars kan inte svaren värderas [6]. En tredje viktig aspekt är att inte formulera ledande frågor [6]. Frågor ska formuleras så neutralt det går. I de fall det inte är möjligt bör motpolen till det ord som används också tas med, till exempel “positivt eller ne-gativt” eller “bra eller dåligt” [6]. Det kan även vara bra att inte använda sig av hypotetiska frågor i onödan [6]. Det beror på att svaren som ges på sådana frågor ofta inte överensstäm-mer med det som sedan sker om händelsen uppkomöverensstäm-mer [6].

Det finns även några viktiga aspekter att tänka på kopplat till svarsalternativen till frågorna i en enkätundersökning. En sådan är att svarsalternativen bör vara konstruerade så att de endast kan ge ett svar åt gången på en fråga [6]. Svarsalternativen bör även vara uttömmande, det vill säga att alla svarsalternativ som är tänkbara måste finnas med [6]. En tredje viktig aspekt är att det ska vara symmetri i svarsalternativen [6]. Det ska alltså finnas lika många positiva och negativa alternativ [6]. Styrkan i de positiva och negativa svaren måste också överensstämma med varandra [6].

En Likertskala är ett vanligt format för enkäter [14]. De togs fram i syfte att mäta attityd på ett vetenskapligt accepterat och validerat sätt [14]. En Likertskala består av ett antal påståenden angående det som studeras, och deltagare i studien ska ange på en skala från ‘håller inte alls med’ till ‘håller helt med’ till vilken grad de håller med påståendena [14]. Vanligen är skalan 5-gradig [12]. Det råder meningsskiljaktigheter gällande om graderna på en Likertskala kan anses vara lika långt ifrån varandra eller inte [14].

2.5.5

Vilsenhet

Hypertext är en icke-sekventiell text, med andra ord en text med förgreningar i vilken läsaren måste själv välja väg genom texten2. Webben är ett exempel på en hypertextsystem [31]. Problem relaterade till navigering i hypertexter har ofta rapporterats i litteraturen [30]. Navi-gering har blivit belyst som ett av de största problemen i designen av hypertexter. Den oftast benämnda nackdelen med hypertexter är den att bli vilse i nätverket [30]. Denna bild delas även i en artikel av Otter et al [26] där de skriver att just vilsenhet är ett av de största proble-men användare upplever när de försöker navigera i hypertextsystem. Trots att vilsenhet är ett av de mest angelägna problemen gällande hypertexter har väldigt få försök gjorts för att kvantifiera det [26]. En av de publicerade studier som presenterat ett kvantifierbart mått på vilsenhet är gjord av Smith [29] [26].

Känslan av att känna sig vilsen eller desorienterad är ett av de stora potentiella nackdelarna med hypertextsystem [29]. Smith definierar i sin artikel ett sätt att mäta vilsenhet på. Smith använder sig av en definition av vilsenhet som säger att vilsenhet bör betraktas i termer av de-gradering av användarprestanda snarare än en subjektiv känsla hos användaren [29]. Smith definierar följande formel för vilsenhet:

L= c ((N S ´1) 2_{+ (}R N´1) 2_{) (2.2)}

Förklaring av ingående variabler:

L = Mått på vilsenheten i förhållande till en perfekt sökning. N = Antal unika noder besökta under sökningens gång. S = Totalt antal noder besökta under sökningens gång. R = Antal noder som krävs för att färdigställa en viss uppgift.

En nod symboliserar i detta sammanhang ett informationsobjekt i hypertexten. Det enda som krävs för att kunna mäta vilsenhet enligt Smiths formel är att veta en användares antal besök till de olika noderna samt definiera vad ett färdigställande av en viss uppgift innebär. Enligt Smiths formel ökar L när vilsenheten ökar. Den perfekta sökningen ges alltså för L = 0 och då finns ingen vilsenhet. En perfekt sökning definieras som det exakta antalet noder som bedöms behöva besökas för att färdigställa en viss uppgift. Enligt Smith innebär ett värde på L som är mindre än 0.4 att en användare inte är vilse medan ett värde större än 0.5 betyder att användaren är klart vilse. Värden på L mellan 0.4 och 0.5 kan enligt Smith inte användas för att avgöra huruvida användaren är vilse eller inte.

2.5.6

System Usability Scale

System Usability Scale (SUS) är en metod för att mäta användbarhet. Den utvecklades med syfte att snabbt och enkelt låta utövaren bedöma användbarheten för en viss produkt eller

2.5. Metodteori

tjänst [2]. SUS-testet är den mest använda standardiserade formuläret som används i syfte att bedöma uppfattad användbarhet [18]. SUS-testet består av 10 påståenden som besvaras på en 5-gradig skala utefter hur mycket respondenten håller med påståendet [2].

Ett SUS-test resulterar i ett totalpoäng som representerar ett mått på användbarheten i sy-stemet som undersöks. Totalpoänget räknas ut genom att först räkna ut varje enskild frågas bidrag till poänget [13]. Varje fråga kan bidra mellan 0 till 4 poäng [13]. Poängen för frågorna 1, 3, 5, 7 och 9 beräknas genom att ta positionen på skalan minus 1 [13]. Poängen för frågorna 2, 4, 6, 8 och 10 beräknas genom att ta 5 minus positionen på skalan [13]. Totalpoängen fås se-dan genom att ta summan av alla frågors poäng och multiplicera den med 2.5. Denna poäng kan variera mellan 0 och 100 [13].

Enligt en studie [2] baserad på 2324 SUS-test är medelvärdet på SUS-test 70.14 och medianen 75.00 [2]. Enligt författarna till studien är ett poäng över 70 acceptabelt, och bra produkter har en poäng mellan en bra bit över 70 och en bra bit över 80 [2]. Samma författare [2] anser emellertid att en produkt som får poäng under 70 borde övervägas att fortsätta utvecklas[2].

2.5.7

Concurrent think-aloud

Concurrent think-aloud (CTA) är en metod för att testa användbarheten med syftet att få en insikt i användarens tankeprocess [22]. Detta sker genom att användaren får tänka högt, d.v.s uttrycka sina tankar när den navigerar genom systemet [22]. Genom att tänka högt blir det tydligt när användaren möter problem.

Nielsen [22] betonar vikten av att inte bara lyssna på användarens tankar utan också obser-vera dess ögonrörelser för att förstå hur problem uppstår [22]. Var det något som tog använ-darens uppmärksamhet som gjorde att den exempelvis missade en viktig textruta? Historiskt sett har CTA används i forskning inom psykologi men är ett växande fenomen för att un-dersöka människa-dator interaktion [22]. Det sägs vara den mest effektiva metoden för att mäta användbarheten enligt Nielsen [22], doktor i gränssnittsdesign och datavetenskap vid Danmarks Tekniska Universitet.

Dock finns det flertalet för- och nackdelar med metoden. Fördelen är kunna se vad använ-daren gör och varför den gör det under själva körningen [22]. Det finns ingen tid för ratio-nalisering utan det är enbart de impulsiva reaktionerna som bevittnas [22]. Att tänka högt kan te sig onaturligt för vissa och därmed påverka resultatet, vilket är en nackdel med meto-den. Exempelvis kan detta göra att användaren blir långsammare när den navigerar genom systemet eller att dess problemlösningsförmåga försämras [22]. Enligt en studie av Wright och Converse gör användare som tänker högt 20% av felen som en tyst användare gör [34]. Eftersom färre fel görs bidrar det till att förbättringsområden missas.

2.5.8

Frågor om navigerbarhet

För att skapa en uppfattning över hur navigerbar en webbapplikation är, är det bra att använ-da sig av en enkät med frågor om navigerbarhet [35]. De frågorna som utformas ska besvara frågor som ”Hur enkelt kan du identifiera var på hemsidan du befinner dig” och ”Hur lik är denna hemsidan jämfört med andra hemsidor du besökt innan” [35]. Dessa frågor ska besvaras av användare på en 5 gradig likertskala efter den har hunnit navigera på webbap-plikationen och bildat en uppfattning över hur webbapwebbap-plikationen är utformad [35]. Zhang et al [35] utförde en liknande studie för att mäta navigerbarhet på en webbapplikation där deras resultat från enkäten var 3.39 [35]. De kommenterar även vikten av att mäta resultatet i jämförelse med andra studiers resultat för att skapa en bättre uppfattning över hur bra ett resultat från enkäten faktiskt är [35] .

2.5.9

Betydelse av intresseväckande och tillförlitlighet

Studier har visat att nya lanseringar av produkter misslyckas uppemot 50% av fallen [24]. Huvudorsaken till det är enligt Ogawa et al [24] felaktig förståelse av kundernas behov. Det är alltså inte främst tekniska brister som gör att produkter inte når framgång utan att det inte finns en tillräcklig marknad. Studier har även visat att kunskap om kunders krav och preferenser är det viktigaste informationsområdet i samband med produktutveckling. Ett sätt att lösa detta på kan vara att integrera kunderna i innovationsprocessen.

Lee et al [16] skriver i sin rapport att tillförlitlighet är en betydande förutsägare av övergri-pande servicekvalitet, men även kundnöjdhet och köpavsikt inom e-handel. Därför är det viktigt för e-handelsbutiker att öka tillförlitligheten för att i sin tur öka kundnöjdheten samt kundernas köpavsikt. Det kan till exempel göras genom att öka säkerheten vid transaktioner och förse kunderna med aktuell och riktig information.

3

Metod

3.1

Förstudie

I förstudien gjordes en enkätundersökning och en prototyp. Enkätundersökningen gjordes för att undersöka intresset hos målgruppen för en webbapplikation för uthyrning av frilufts-utrustning. Prototypen gjordes för att få en visuell överblick av den slutgilitiga versionen av webbapplikationen samt att säkerställa att utvecklingen av den sker i linje med frågeställ-ningen.

3.1.1

Enkätundersökning

En enkätundersökning utvecklades i syfte att undersöka den valda målgruppens intresse och behov av en webbapplikation för uthyrning av friluftsutrustning. Enkäten skickades ut i olika Facebookgrupper för studenter. Författarna till denna rapport skickade även ut enkäten i sina egna sociala nätverk. Enkäten var tillgänglig i sex dagar och alla svar samlades in anonymt. Varken frågorna eller svarsalternativen utformades enligt något särskilt format.

Enkäten delades in i två delar. Den första delen berörde framför allt huruvida respondenten var intresserad av att utöva friluftsaktiviteter samt om denne äger all nödvändig utrustning för aktiviteterna. Enkätens del två gjordes i två varianter och svaret på huruvida responden-ten redan äger all nödvändig friluftsutrustning avgjorde vilken variant som visades. I det fall respondenten svarade att den redan äger all nödvändig utrustning utgjordes del två enbart av en förfrågan om att skicka in enkäten. I det andra fallet, då respondenten svarade att denne inte äger all nödvändig utrustning, utgjorde del två av fler frågor gällande friluftsutrustning och uthyrning av det.

3.1.2

Prototyp

En prototyp utformades intialt i pappersform där utseendet underbyggdes med teorin. Syf-tet med den var att ge en visuell överblick över den slutgiltiga versionen av webbapplikatio-nen. Tanken med prototypen var även att säkerställa att utvecklingen av webbapplikationen skedde i linje med frågeställningen. När pappersprototypen färdigställts utvärderades den av utvecklarna själva som utgick från att vara användare. Utvecklarna försökte navigera runt på prototypen och därefter gav de kritik vad som var otydligt och saker som de inte förstod.

Detta gjordes i syfte att samla in återkoppling för att vidare utveckla navigerbarheten och användbarheten av webbapplikationen.

Sedan utformades en ny prototyp i Mircrosoft Powerpoint. Med hjälp av Powerpoint kunde denna prototyp bättre avspegla den verkliga webbapplikation än vad pappersprototypen kunde. Denna prototyp baserades på kritiken från testet av pappersprototypen och teorin samt utvecklades för att uppfylla alla user stories.

3.2

Implementation

I implementation behandlas utvecklingen av webbapplikationen och vilka programmerings-språk samt verktyg som användes för att möjliggöra webbapplikationen.

3.2.1

System

Systemarkitekturen togs fram utifrån krav på webbapplikationen samt förslag från brain-writing. En flernivåarkitektur med tre nivåer användes för att beskriva webbapplikationen med de tre nivåerna front-end/client, back-end/server samt databas. Systemarkitekturen vi-sualiseras i figuren nedan.

Figur 3.1: Webbapplikationens systemarkitektur

3.2.2

Front-End

Front-end är den del av webbapplikation som syns på användarens skärm. Front-end ut-vecklades med HTML, CSS, Javascript, JQuery samt Bootstrap. HTML används för att lägga ut en grundläggande ram för webbapplikationen samt element som text, länkar och bilder. För att sedan få webbapplikation att se tilltalande ut samt implementera användbarhet och navigerbarhet användes verktygen CSS och Bootstrap. Dessa används för att ändra presenta-tionsstilen samt strukturera elementen på sidan.

3.3. Utvärdering

Bootstrap är ett verktyg med olika mallar för grafiska element med fokus på responsivitet, vilket innebär att webbapplikationen kan anpassa sig efter vilket typ av enhet som använda-ren använder webbapplikationen med.

JavaScript är ett programmeringsspråk som används för att kommunicera med servern i back-end, men även för att implementera dynamiska element i webbapplikationen. Även JQuery användes som är ett JavaScript-bibliotek vilket möjliggör enklare implementation av JavaScript med JQuerys syntax.

3.2.3

Back-End

Back-end innefattar logiken och datahanteringen för webbapplikationen och är den delen som användaren inte kan interagera med. Python användes för att skriva koden i back-end och tillsammans med python-bibliotek kunde även autentisering och databaskommunika-tion implementeras. För databashanteringen användes verktyget Flask som tillsammans med SQLAlchemy hanterade manipulation av data och kommunikation med databasen. Betalning hanterades med Stripe där back-end hanterade kommunikationen med Stripe genom deras API.

3.2.4

Databas

Under utveckling av webbapplikationen användes SQLite som databas för att lagerföra data.

3.2.5

Kommunikation mellan nivåerna i arkitekturen

För att kunna kommunicera med de olika delarna i arkitekturen används verktygen REST, Ajax och SQLAlchemy. REST är ett api för kommunikation där data skickas i JSON-format som används för kommunikation mellan front-end och back-end. Ajax är ett verktyg för att skicka data asynkront (i bakgrunden) mellan servern och klienten vilket möjliggör att ändra data i webbapplikationen utan att behöva ladda om hela sidan. För kommunikation mellan back-end och databasen användes SQLAlchemy.

3.3

Utvärdering

Utvärderingen gjordes i syfte att mäta om webbapplikationen hade utformats så att den upp-levdes som navigerbar och användbar.

3.3.1

Användartester

För att undersöka om webbapplikationen hade utformats så att den upplevdes som navi-gerbar och användbar användes användartest. Två användartester gjordes, det första gjordes under implementationsfasen av webbapplikationen och det andra gjordes då webbapplika-tionen var färdigutvecklad. Syftet med användartester är att låta utvalda användare från den utvalda målgruppen testa om webbapplikationen utformats på ett sätt som uppfyller de krav som satts upp i designfasen [28]. I både användartesterna deltog sju testpersoer.

Det första användartestet var tvunget att göras i en mindre version på grund av att web-bapplikationen var långt ifrån färdigutvecklad vid tidpunkten för testet. Se kapitel 3.3.6 för en redogörelse av det första användartestet. Nedanstående beskrivning avser det andra och slutgilitga användartestet som gjordes.

Användartestet, som återfinns i appendix A, utformades med hjälp av fyra mindre test, SUS-test, formeln för vilsenhet, CTA och åtta frågor gällande navigerbarhet. Genom att samla sju stycken användare från målgruppen unga vuxna, åldrarna 18-29, kunde navigerbarheten och användbarheten testas på webbapplikationen. Sedan samlades data in för att värdera om

webbapplikationen hade utformats på det eftertänkta sättet. Kortfattat utformades användar-testet på följande sätt.

Användarens gavs tio direktiv, vilka redogörs för i kapitel 3.3.2, om att navigera på webbap-plikationen. Dessa direktiv användes för att se om användaren kunde navigera till eftersökta sidan på minimalt antal klick, detta jämförs mot beräknade kortaste vägen och utifrån Smith’s formel för vilsenhet beräknades en siffra fram på vilsenheten som användaren upplevde. Sedan gavs användaren tio nya direktiv, vilka redogörs för i kapitel 3.3.3, om att navigera på webbapplikationen. Samtidigt som användaren försökte navigera utifrån de direktiven begärdes användaren att säga det den tänkte på, vad den såg och hur den tänkte så att en CTA också kunde genomföras.

Till slut när användaren utfört direktiven begärdes användaren gör ett SUS-test där 10 frågor besvarades om användbarheten på webbapplikationen. Till sist ombades användaren besva-ra åtta stycken frågor gällande webbappliakationens navigerbarhet. Därefter summebesva-rades poängen från frågorna om navigerbarhet samt från SUS-testet. Poängsumman tillsammans från resultaten från CTA-testet gav kvantifierbara resultat på om webbapplikationen hade utformats på ett användbart och navigerbart sätt. Specifika poäng och summering tas upp i ett senare avsnitt.

3.3.2

Test av vilsenhet

Enligt tidigare presenterad teori har det framgått att navigering är ett av de största problemen med hypertextsystem [30]. En webbplikation av det slaget som utvecklats är ett hypertextsy-stem, och ordet används i denna rapport i samma bemärkelse. Enligt tidigare presenterad teori har det framgått att vilsenhet är ett av de största problemmen användare upplever när de försöker navigera i hypertextsystem [26]. I och med att vilsenhet beskrivs som ett av de stösta problemen kopplat till navigerbarhet på en webbapplikation valdes det att mätas för att kunna analysera hur användaren upplevde navigerbarheten. Vilsenheten uppmättes ge-nom att använda Smiths’s formel för vilsenhet [29].

Vilsenhet testades som en del av användartesterna och resultatet går att finna i appendix A. Första steget i utformandet av testet var att ta fram ett antal direktiv som användarna skulle utföra på webbapplikationen. Ett direktiv innebar att användaren började på webbapplika-tionens startsida och sedan navigerade sig fram till den slutdestination på hemsidan som direktivet angav. 10 sådana direktiv togs fram och dessa var:

1. Skapa en ny användare på webbapplikationen. 2. Logga in på webbapplikationen.

3. Ta reda på vilken utrustning som webbapplikationen erbjuder. 4. Hitta en vandringsryggsäck.

5. Hitta en vattenflaska och lägg till den i varukorgen. 6. Ångra ditt val av att hyra vattenflaskan.

7. Ta reda på vad ett stormkök kostar att hyra i en vecka. 8. Hitta kontaktuppgifter till företaget.

9. Hyr ett tält för nästkommande två veckorna.

3.3. Utvärdering

Under tiden som användaren utförde ett direktiv observerades antalet unika noder som an-vändaren besökte samt det totala antalet noder som besöktes. På förhand beräknades det minsta antalet noder som måste besökas för att kunna slutföra direktivet. Till sist beräknades vilsenheten med hjälp av Smiths formel [29]. Denna procedur upprepades för alla direktiv.

3.3.3

Concurrent think-aloud

För att få en större insikt om vad användaren tycker om navigerbarheten och användbarheten gjordes ett CTA test. Eftersom det är tidigare visat i avsnittet metodteori att CTA försämrar användarens problemlösningsförmåga [22], gjordes detta test separat med testet av vilsenhet. Det minskar risken att resultat av vilsenhetstestet påverkas av den försämrade problemlös-ningsförmågan.

Användaren är redan familjär med de direktiv som gavs i testet av vilsenhet. För att säker-hetsställa att användarens impulsiva reaktioner bevittnas formulerades 10 nya direktiv. Precis som i testet av vilsenhet står användaren alltid på startsidan när ett direktiv ges, med undan-tag för direktiv 1, 5 och 10. De direktiv som gavs var:

1. Här startar användaren vid en viss produkt och ombeds sedan hitta tillbaka till startsi-dan.

2. Hitta svar på vanliga frågor.

3. Logga in på ditt konto och ta fram köphistoriken. Observera att här antas det att testet av vilsenhet görs först.

4. Visa alla artiklar under kategorin “fiske”. 5. Kategorisera artiklarna utefter pris. 6. Byt lösenord på ditt konto.

7. Ta fram produktinformation om ett godtyckligt stormkök.

8. Filtrera produkterna för att se ett tidsspann som stormköket “Stormy” är uppbokad. 9. Lägg till tre valfria produkter i varukorgen.

10. Navigera till betalningsvyn för dessa tre produkter.

De tankar som kom upp under testet skrevs ner och sammanställdes. Därefter plockades de 10 vanligaste tankarna ut och presenterades i resultatet.

3.3.4

Frågor om navigerbarhet

För att testa om webbapplikationen upplevdes som navigerbar av användarna ställdes 8 frå-gor till dem i slutet på användartestet. Syftet med dessa fråfrå-gor var att få svar på om an-vändaren hade upplevt att webbapplikationen var utformad på ett strukturerat, logiskt och navigerbart sätt. Påståendena utformades utifrån Likertskalan där påståenden om naviger-barhet betygsattes på en skala 1 till 5 där 1 betyder “håller inte alls med” och 5 betyder “håller helt med”. Påståendena utformades så att om användaren upplevde att webbapplikationen var navigerbar skulle den svara högt och om inte lågt. De 8 påståendena var:

1. Det upplevdes enkelt att navigera på webbapplikationen. 2. Det fanns en logisk struktur på webbapplikationen.