AnvändbarhetDel 2

Malmö stations dörrar…Hur tänkte dem?

Föreläsningar

1. Användbarhet – Generellt

2. Användbarhet – Inriktning IT

Vad är användbarhet?

Definition av användbarhet (1)

“The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency, and satisfaction in a specified context of use” (ISO)

Definition av användbarhet (2)

Använd-barhet

Lätt att lära Effektiv

Ändamåls-enlig

Fel-tolerans

Engage-rande

Definition av användbarhet (3)

• Effektiviteto Rätt funktionaliteto Stödjer användarens

arbetsuppgiftero Lätt att lära och komma ihåg

• Produktiviteto Gör sällan felo Klarar många arbetsuppgiftero Snabb

• Nöjda användareo Kanske rent av kulo Bra till modso Ej ohälsosamto Orsakar inte stresso Orsakar inte arbetsskador

• Säkerheto Användarna kan inte ”förstöra”

av misstago Man kan ångra sig

Varför användbarhet?

Intern lönsamhet Ökar produktiviteten Ökar trivseln Minskar felen Minskar kostnader (support, utbildning m.m.) Minskar arbetsskador, vantrivselExtern Lönsamhet Ökar försäljningen Nöjda kunder Minskar support- och utvecklingskostnader

Användbarhet - IT

Samma principer som vi gick igenom förra veckan

Gränssnitt i fokus

Användbarhet för vem?

Hög användbarhet märks inte…

Return of investment

Vad tjänar vi på att investera i användbarhet?

Är det värt det?

http://www.youtube.com/embed/O94kYyzqvTc

Introduktion till användbaret för webben

Hur upplever användare en webbplats?

Vi söker aktivt efter det vi söker

Hur upplever användare en webbplats? Hur läser användare webben?

79% läser inte, de scannar

Bara 16% läser delar av sidan ord-för-ord

Under ett normalt besök, hur lite läser användaren? Som mest 28% av orden

Mer troligt 18% av orden

Varför scannar vi istället för att läsa? Det är ”jobbigt” att läsa på en skärm

Det går snabbare att scanna

Det finns många sidor som konkurrerar om användarna

https://www.youtube.com/watch?v=NsWjmQXdKao&feature=youtu.be

Vad noterade ni?

Deltagarna skrollade väldigt snabbt

De pekade ofta ut: Sidtiteln

Rubriker

Länkar

Listor

Vad läste de, och vad läste de inte?

Så vad bör vi tänka på? – När användare scannar sidor.

Markera nyckelord

Användbara rubriker och underrubriker

Använd listor

En ”idé” per paragraf (ofta läses bara de första orden i en paragraf)

Använd färre ord i bredd jämför med ”vanlig skrift”

Vi testar oss fram

Testar olika alternativ

Testar att söka

Vem läser manualer först?

Det är inte farligt att göra fel – eller rättare sagt, det ska inte vara farligt att göra fel.

Vi nöjer oss även med en icke-optimal lösning

Vi har ofta bråttom

Att gissa fel är inte ”farligt”

Otydliga sidor ger oss inte mycket val

Det är roligare att gissa

Användare använder tjänster != förståelse

Det är inte viktigt för användare hur det fungerar, utan att det fungerar

Fungerar något håller vi fast vid det, även om det är optimalt

Hierarki - Storlek

Mest ViktigtMindre viktigtMinst viktigt

Relaterade saker ska synas tillsammans

Visuellt nästlade delar visar vilka delar som tillhör vad

Konventioner

Som regel blir konventioner till endast om de fungerar

Gör det enkelt för användaren att går mellan sidor och känna igen sig

Bra för utvecklare som riktlinjer då de är utprovade metoder. Dessutom behöver man inte uppfinna hjulet igen.

Dela upp layouten i delar

Så att användaren vet1). Vad som är vad2). Vad som är ”viktigt”3). Vad som kan ”ignoreras”

Vad är klickbart?

Ser ut som en knapp

Muspekaren blir en ”hand”

Antal klick- Det gyllene måttet?

Ju färre klick, ju bättre?

Språk

Rätt språk/terminologi för målgruppen

Korrekt språk

Koncist

Extra viktigt vid navigation och informationssökning

Minimera ”störningar”

För mycket, dåligt strukturerad information

Förvirrade formgivning av webbplatsen

Less is more

Information Overflow

Problem - För mycket onödig text på webben

Gör sidor mindre förvirrande/störande

Ger mer användbart innehåll

Gör sidor kortare

Användare har inte tid för ”small talk”

Instruktioner i överflöde

Många instruktioner är onödiga

Gör självförklarande istället för ”small talk”

Använd t.ex. knappar/drop down-menyer/checkboxar för att visa användaren vad du vill ha för svar

Hitta på en webbplats

Hittar inte användarna runt på en webbplats så kommer den inte att användas.

Navigation

1. Vi letar efter något

2. Vi väljer om vi vill fråga (söka) eller leta själva.

Sök-/bläddraprocess

Oklarheter kring webbplatser

Vi vet inte hur stora/små de är från utsidan

Oklart om vilken väg vi ska ta

Oklart var vi är någonstans

Gamla vs. Nya besökare

Navigation

Fördelar med navigation

Ger oss något att ”hålla oss fast vid”

Berättar var vi är

Berättar hur vi ska använda en sida

Ger oss förtroende i de som byggt den

Global Navigation

”Don’t look now, but i think it’s following us”

Alltid tillgång till huvudsektionerna

Ger trygghet till användaren

Var är vi?

Markerade menypartier

Brödsmulor

Rubriker

Flikar som metafor

Flikar – För tydlig struktur

Självförklarande

Svåra att missa

Stilrena

Illustrerar fysik plats

Trunk test

1. Logotyp

2. Global navigation

3. Lokal navigation

4. Rubrik

5. ”Du är här”-indikator

6. Sökruta

Mer noggrannare genomgång nästa vecka.

Navigation (1)

Följ standarder

Var tydlig

Tänk på minnets begränsningar

Navigation (2)

Navigera vs. Söka

Vad är effektivast och när är det effektivast

Ena, andra eller båda?

Navigation (3)

Konventioner:- Rätt storlek på rätt element- Gruppera tydligt

Var tydligt med vad som är klickbart

Var är jag?

AnvändbarhetMer än bara grafiskt gränssnitt

The elements of userexperience

Vad är UX

En persons känsla för en produkt

En helhetsupplevelse

Subjektivt

En snygg sida är inte alltid användbar

Tydlig syfte – Vad är webbplatsens strategi?

Vad kan man göra – Vilka funktioner finns?

Struktur – Hur ska funktionerna fungera?

Skelett – Hur är sidans upplägg/layout?

Ytan – Den grafiska profilen.

Elementen

The Strategy Plane

Vad vill vi göra?

Vilka behov finns från användarna?

Vilka mål har vi?

The Scope Plane

Vilka funktioner ska finns?

Vilket innehåll ska finnas?

The Structure Plane

Hur ska webbplatsen fungera?

Hur ska webbplatsen interagera med användarna?

Hur ska användarnas behov bli besvarade?

Hur ska informationen stuktureras?

The Skeleton Plane

Webbplatsens upplägg

Informationsdesign, hur ska allt hänga ihop (wireframes)

Grundläggande layout

Navigationslayout

The Surface Plane

Visuell design, och allt vad det innebär.

Skapa en webbplats med fokus på användarnaHur går det till?

Vad ska göras? - Syfte

Vad är målet med webbplatsen

Hur ska vi kontrollera att målen uppnåtts? Skapa en lista som är mätbar.

Tänk på att målen kan komma att förändras eller blir flera. Det är naturligt i en utvecklingsprocess.

Vem är användarna?

Viktigt att förstå användarna – De är ju de som ska använda systemet sedan.

Metoder för att förstå användarna:- Intervjuer- Enkäter- Fokusgrupper- Gillar/ogillar

Användarnas röst

Det behöver inte vara samma användare som är med genom hela projektet, utan användarna kan delas in i olika grupper.

Slutanvändare

Referensgrupp

Domänexperter

Användbarhetsexperter

Iterativ utformning

Att göra ”lagom” mycket

Hur mäter man användbarhet?

5 min diskussion

Att mäta rätt sak?

Att mäta på rätt sätt?

Vem ska vi testa

Viktigt att testa relevanta personer

Akta sig för felkällor:- Val av testperoner (slumpvis valda)- Bortfall- ”Valfria” undersökningar

Viktigt för rapporten (läsarna) att veta vilka testpersonerna är

Heuristik

En metod som bygger på att man enligt:- Expertutlåtanden- Tumregler- Beprövade riktlinjer- Kvalificerade gissningar

utvärderar ett system

Om heuristisk utvärdering"Heuristic Evaluation", in Usability Inspection Methods, edited by J. Nielsen and R. Mack, John Wiley and Sons, Inc., 1994

Use a team of evaluators

One evaluator => between 20% and 51% of the problems

Two evaluators => can identify over 50 % of the problems

Three evaluators => can identify over 60 % of the problems

The curve flattens after five evaluators; it would take more then 15 evaluators to identify 90% of the usability problems

The evaluators should do their evaluations independently of each other and only compare results after each of them has looked at the design and written his/her evaluation report

Shneiderman’s 8 Golden Rules (1987):1. Strive for consistency

2. Enable frequent users to use shortcuts

3. Offer informative feedback

4. Design dialogs to yield closure

5. Offer error prevention and simple error

6. Permit easy reversal of actions

7. Support internal locus of control

8. Reduce short-term memory load

Norman’s 7 Principles (1988):

1. Use both knowledge in the world and knowledge in the head.

2. Simplify the structure of tasks.

3. Make things visible.

4. Get the mappings right.

5. Exploit the power of constraints, both natural and artificial.

6. Design for error

7. When all else fails, standardize

Nielsen’s 10 UsabilityHeuristics (1994):1. Visibility of system status2. Match between system and the real world3. User control and freedom4. Consistency and standards5. Help users recognize, diagnose and recover from errors6. Error prevention7. Recognition rather than recall8. Flexibility and efficiency of use9. Aesthetic and minimalist design10. Help and documentation

Heuristisk utvärderingtillvägagångssätt

4-5 st går igenom gränssnittet, var och en för sig.

Noterar ”brott” mot riktlinjerna

Värderar problemen, hur allvarliga de är

Resultatet sammanställs i en rapport

Viktning av problem

1. Ingen påverkan -Detta problem påverkar inte användarens arbete.

2. Väldigt liten påverkan -Kosmetiskt problem som har en mycket liten påverkan på användarens arbetemed detta program. Denne lägger ingen större tyngd vid problemet men är medveten om det.

3. Liten negativ påverkan -Mindre problem som skulle behöva korrigeras. Problemet har en liten negativpåverkan på användarens arbete. Irritation kan uppstå i arbetet i och med problemet

4. Stor negativ påverkan -Stort problem som verkligen skulle behöva korrigeras. Problemet har en stor negativ påverkan på användarens arbete och är ett hinder som gör att arbetet tar längre tid att utföra

5. Mycket stor negativ påverkan -Väldigt stort problem där det är av största vikt att det korrigeras. Problemet har en mycket stor negativ påverkan på användarens arbete. Det är ett stort hinder som gör att arbetet ej kan utföras inom rimlig tid eller överhuvudtaget.

Intressanta webbplatser• https://www.nngroup.com/topic/web-usability/• http://sensible.com/dmmt.html• https://www.usability.gov/