INDIVIDUELL INLÄMNINGSUPPGIFT Sofia Aronsson ANVÄNDBARHET OCH GRAFISK DESIGN MIS 13, Nackademin Yrkeshögskola Lärare: Ellinor Ihlström
Inledning... 3! Analys... 3! Hitta... 3! Förstå... 5! Använda... 6! Åtgärdsförslag... 6! Högst prioritering... 6! Mellan prioritering... 7! Låg prioritering... 7 Bilaga: Designförslag... 8! 2
. Inledning Syftet med denna rapport är att göra en användbarhetsanalys om hur och på vilket sätt CyberPhoto bör utveckla och förändra sin webbsida. Genom att förändra och förbättra webbsidan kan de bli mer effektiva och lönsamma eftersom användarna lättare kan hitta, förstå och använda innehållet. Jag valde att göra en analys på CyberPhotos webbsida www.cyberphoto.se/ eftersom det är en e-handel för kameror, jag ser flera förbättringsmöjligheter och den har mycket potential till att bli en snygg och användbar webbsida. CyberPhoto är en av Skandinaviens största och äldsta leverantörer av fotografisk utrustning placerade i Umeå, men levererar varor till hela Sverige och till Danmark. Företaget startade 1955, de började sälja postorder via internet 1995 och tre år senare ombildades företaget och riktade enbart in sig på postorder. De har en anställd webbutvecklare som ser till att webbsidan fungerar, men det finns ingen information om när den gjordes om senast. Analys Det är viktigt att veta vilka nyttor som ska styras mot och vilka användarna är. När det är definierat så går det att säga vad som är god respektive dåligt utformning av webbsidan. Av den information som finns på webbsidan så är den förväntade nyttan med webbsidan att sälja mer produkter, ge bättre service och bli ledande på marknaden. Den målgrupp som är användare är personer som är intresserade av foto och teknik, både erfarna och amatörer. Användarna förväntar sig att webbsidan är lätt att hitta på, användarvänlig, inspirerande och har tydlig information. Jag har analyserat webbsidans startsida enligt principen Hitta, Förstå och Använda och den baseras på de vanligaste och viktigaste uppgifterna som användarna förväntas göra. Den analys jag gör är en expertutvärdering, eftersom jag med mina kunskaper inom användbarhet och grafisk design går igenom och utvärderar gränssnittet. Hitta När jag som användare kommer in på webbsidan så möts jag av en startsida med flera menyer, en sökfunktion, flera kameror och en drös med kampanjer. En startsida ska vägleda användaren och berätta vad den kan göra på sidan. Som användare förstår jag ganska snabbt att denna sida handlar om kameror, men det är inte lika 3
solklart vad jag kan göra på webbsidan. Allt känns väldigt rörigt och jag kan inte urskilja vad som är det viktigaste på sidan. En positiv sak är att de mest användbara funktionerna går lätt att hitta och är positionerade inom first-scroll, som innebär ytan som användarna ser utan att behöva scrolla ner på sidan. Detta är positivt eftersom användarna kan hitta det de letar efter när de direkt kommer in på sidan. Språket som används är enkelt att förstå och innehåller få facktermer som endast insatta förstår. Det krävs knappt någon tidigare kunskap för att förstå språket på startsidan. Navigationen på sidan är inte lätt trots menyer, erbjudanden och bildlänkar. Detta beror till största del på att länkarna inte har understruken text och att det inte händer något när man håller musen över dem. Länkarna i vänstermenyn under Foto & Video är enkla att förstå, men att det finns fler menyer nedanför är svårare att hitta. Menyn går även att finna i headern, med samma färger som återfinns i sidomenyn. Det hade varit lättare att hitta och navigera på sidan om länkarna såg ut som traditionella länkar och var indelade i fler kategorier än de fyra stycken som finns i nuläget. Nuvarande vänstermeny, www.cyberphoto.se En positiv sak med webbsidan är sökfunktionen som är placerad centrerat högst upp i headern, inom first-scroll. Det gör det lätt för användarna att hitta vad de söker snabbt. Men sökfunktionen söker endast efter produkter, inte på hela sidan. Vill användaren snabbt veta returadressen för att skicka tillbaka en vara och skriver in sökordet returadress i sökrutan får den bara meddelandet att sökordet inte gav några träffar. Designen på sidan gör att det är svårt att hitta på sidan eftersom det är väldigt många kampanjer, erbjudanden och innehåll på en väldigt liten yta. Tanken är att designen ska lyfta innehållet, men istället blir det svårt att hitta det man letar efter. Allt innehåll känns väldigt rörigt och många kampanjer kan förväxlas med externa 4
annonser. En lösning på det är att använda mindre innehåll och lyfta fram det viktigaste för användarna just nu. Förstå När en användare kommer in på webbsidan för första gången ska det tydligt framgå vad som är syftet med webbsidan, vad företaget erbjuder och anledningar till varför användaren ska välja just denna webbsida. I nuläget är det lätt att förstå vad de erbjuder eftersom hela sidan är fullproppad med kameror, men inga bra argument till varför användaren ska välja att köpa sin kamerautrustning just här. Under loggan högst upp till vänster på sidan står det Personlig service på nätet och det är allt. De lyfter varken fram argument om deras enorma kunskap inom foto eller deras snabba leveranstider. Dessa argument hittar användarna om de klickar sig vidare två steg och scrollar längt ner på de sidan. CyberPhotos logga och slogan, www.cyberphoto.se CyberPhotos logga uppe i det vänstra hörnet berättar tydligt vilka som är avsändare till webbsidan. Detta anser jag räcker för att användarna ska veta var de har hamnat och vilka som står bakom innehållet. För att skapa mer förståelse om företaget hade det varit bra med en beskrivande mening under loggan. Skandinaviens största och äldsta leverantör av fotografisk utrustning skulle kunna stå under loggan för att skapa ännu bättre förståelse. I nuläget finns det ingen tydlig länk på startsidan för att läsa mer om företaget, dess historia och vad de gör för något. För att läsa mer om CyberPhoto behöver användaren klicka på Kundservice eller Kontakta oss och sedan vidare till fliken Om företaget. Detta är en lång, krånglig och ologisk väg för att hitta denna information. En tydlig länk på startsidan med länktexten Om oss hade varit att föredra eftersom det då blir logiskt och lätt att hitta informationen. En ny besökare på sidan kan få kalla fötter och lämna sidan utan att beställa något, eftersom företaget inte har någon tydlig information om sig. En ny användare behöver känna sig trygg och få bra information om att CyberPhoto är ett seriöst företag. Mycket information som går att hitta på sidan om företaget skulle vara bra att ha med på startsidan. T.ex att de är certifierade genom att leva upp till Trygg e-handels krav för e-handlare, att de alltid levererar med Posten och att de har högsta kreditvärdighet enligt Bisnode. Dessa certifieringar skulle kunna läggas som symboler med länk i en footer på startsidan. 5
Använda Eftersom syftet med webbsidan är att sälja mer produkter, ge bättre service och bli ledande på marknaden, är det viktigt att låta användarna styra och informationen på startsidan ska vara det användarna har mest nytta av. Jag anser att det som finns på startsidan i nuläget inte är anpassat efter användarna. Det känns som om företaget har försökt att få med så mycket information som möjligt på startsidan för att visa på sitt breda sortiment och låga priser. Självklart ska de visa det, men istället kan användarna uppfatta sidan som rörig. För att möta användarnas behov av information skulle startsidan visa de senaste kampanjerna, argument till varför användarna ska välja just dem, de mest populära produkterna med tydligt call-toaction i form av Köp -knappar och information om hur man kontaktar företaget. Det ska vara lätt att använda och hitta informationen på webbsidan. En positiv sak med webbsidan är att de återanvänder och använder inte endast ny information. Detta är bra eftersom det som är nytt är inte alltid aktuellt och det användarna efterfrågar. För att möta användarnas behov av att kunna använda webbsidan oavsett enhet är det viktigt att webbsidan är responsiv, som innebär att sidans proportioner och utseende anpassas efter användarens enhet. CyberPhotos webbsida är endast anpassad efter en dators webbläsare. Detta gör att webbsidan är svår att använda med en smartphone eller surfplatta och det krävs inzoomning för att kunna klicka på länkar och läsa all information. En responsiv webbsida skulle göra att webbsidan blir mer användarvänlig och anpassad efter användarna. Åtgärdsförslag Här är en sammanställning på de åtgärder som jag föreslår att CyberPhoto ska genomföra, efter att jag har analyserat webbsidan. Dessa åtgärdsförslag kan användas av webbutvecklaren för att utveckla webbsidan och är därför rankade i prioriteringsordning. Efter åtgärdsförslagen kommer även ett designförslag med mina rekommenderade förändringar. Förbättringarna skulle göra att webbsidan blir mer användarvänlig som resulterar i nöjdare kunder, fler kunder och högre lönsamhet. Webbsidan skulle bli mer anpassad efter användarnas behov och uppfylla nyttan med sidan, som är att sälja mer produkter, ge bättre service och bli ledande på marknaden. Högst prioritering - Tydligare länkar. Förtydliga att det är länkar genom att använda understruken text och att det händer något när man håller musen över en länk. 6
- Färre innehåll och kampanjer på startsidan. Endast den viktigaste informationen. Kampanjerna kan rulla i ett bildspel. - Ny meny i headern. Några få och viktiga menyer i headern: hem, om oss, köpvillkor, mina sidor och kundservice. - Responsiv webbsida så att sidan anpassas efter användarens enheter. - Info om var användaren har kommit. Mer information om vad CyberPhoto erbjuder för att användarna ska förstå var de har hamnat. - Sökfunktion på HELA sidan, inte bara för produkter. - Call to action. Tydliga knappar för att köpa en vara och lägga den i varukorgen. Smidig köpprocess. Mellan prioritering - Enhetliga färger. Använd endast enhetliga färger som används i den grafiska profilen. Förslagsvis rött, vitt, grått och svart. - Fördelar. Visa på fördelarna med att handla på CyberPhoto - Flytta bloggen till en egen sida, men länk från startsidan. - Footer. Skapa en footer längst ner på sidan med nyttiga sidlänkar, hur användarna kan följa CyberPhoto i sociala medier och logga tillsammans med organisationsnumret. - Varukorg. Skapa en snyggare och mindre symbol för varukorg uppe i det högra hörnet. - Ny slogan under loggan i headern. En slogan som förklarar vad CyberPhoto erbjuder och ett argument till varför användaren ska välja just denna e-handel. - Chattruta fastklamrad på höger sida för att användarna lätt kan ta kontakt med dem. Idag står det bara Vi är online när de har öppet. Låg prioritering - Certifikat. Tydligt att det är säkert att beställa på webbsidan. Symbol med länk som visar att de har certifikat från Trygg e-handel. - Flerspråkig sida. Genom att erbjuda webbsidan på fler språk och lättläst kan fler användare utanför Sverige använda sidan. - Byte av typsnitt. Byte till ett snyggare typsnitt, t.ex Helvetica som är både ett lättläst och snyggt typsnitt. 7