DA156A - HT15 - Användbarhet 2

Transcript

1. Användbarhet Del 2
2. Malmö stations dörrar… Hur tänkte dem?
3. Föreläsningar 1. Användbarhet – Generellt 2. Användbarhet – Inriktning IT
4. Vad är användbarhet?
5. 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)
6. Definition av användbarhet (2) Använd- barhet Lätt att lära Effektiv Ändamåls -enlig Fel- tolerans Engage- rande
7. Definition av användbarhet (3) • Effektivitet o Rätt funktionalitet o Stödjer användarens arbetsuppgifter o Lätt att lära och komma ihåg • Produktivitet o Gör sällan fel o Klarar många arbetsuppgifter o Snabb • Nöjda användare o Kanske rent av kul o Bra till mods o Ej ohälsosamt o Orsakar inte stress o Orsakar inte arbetsskador • Säkerhet o Användarna kan inte ”förstöra” av misstag o Man kan ångra sig
8. Varför användbarhet? Intern lönsamhet  Ökar produktiviteten  Ökar trivseln  Minskar felen  Minskar kostnader (support, utbildning m.m.)  Minskar arbetsskador, vantrivsel Extern Lönsamhet  Ökar försäljningen  Nöjda kunder  Minskar support- och utvecklingskostnader
9. Användbarhet - IT  Samma principer som vi gick igenom förra veckan  Gränssnitt i fokus
10. Användbarhet för vem?
11. Hög användbarhet märks inte…
12. ROI  Return of investment  Vad tjänar vi på att investera i användbarhet?  Är det värt det?  http://www.youtube.com/embed/O94kYyzqvTc
13. Introduktion till användbaret för webben
14. Hur upplever användare en webbplats?
15. Vi söker aktivt efter det vi söker
16. 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.
17. 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
18. 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
19. Hierarki - Storlek Mest Viktigt Mindre viktigt Minst viktigt
20. Relaterade saker ska synas tillsammans
21. Visuellt nästlade delar visar vilka delar som tillhör vad
22. 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.
23. Dela upp layouten i delar  Så att användaren vet 1). Vad som är vad 2). Vad som är ”viktigt” 3). Vad som kan ”ignoreras”
24. Vad är klickbart?  Ser ut som en knapp  Muspekaren blir en ”hand”
25. Minimera ”störningar”  För mycket, dåligt strukturerad information  Förvirrade formgivning av webbplatsen  Less is more
26. Antal klick - Det gyllene måttet?  Ju färre klick, ju bättre?
27. Språk  Rätt språk/terminologi för målgruppen  Korrekt språk  Koncist  Extra viktigt vid navigation och informationssökning
28. 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”
29. 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
30. Hitta på en webbplats  Hittar inte användarna runt på en webbplats så kommer den inte att användas.
31. Navigation 1. Vi letar efter något 2. Vi väljer om vi vill fråga (söka) eller leta själva.
32. Sök-/bläddraprocess
33. 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
34. Gamla vs. Nya besökare
35. 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
36. Konventioner för navigering
37. Global Navigation  ”Don’t look now, but i think it’s following us”  Alltid tillgång till huvudsektionerna  Ger trygghet till användaren
38. Var är vi?  Markerade menypartier  Brödsmulor  Rubriker
39. Flikar – För tydlig struktur  Självförklarande  Svåra att missa  Stilrena  Illustrerar fysik plats
40. 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.
41. Navigation (1)  Följ standarder  Var tydlig  Tänk på minnets begränsningar
42. Navigation (2)  Navigera vs. Söka  Vad är effektivast och när är det effektivast  Ena, andra eller båda?
43. Navigation (3)  Konventioner: - Rätt storlek på rätt element - Gruppera tydligt  Var tydligt med vad som är klickbart  Var är jag?
44. Användbarhet Mer än bara grafiskt gränssnitt
45. The elements of user experience
46. Vad är UX  En persons känsla för en produkt  En helhetsupplevelse  Subjektivt
47. 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.
48. Elementen
49. The Strategy Plane  Vad vill vi göra?  Vilka behov finns från användarna?  Vilka mål har vi?
50. The Scope Plane  Vilka funktioner ska finns?  Vilket innehåll ska finnas?
51. 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?
52. The Skeleton Plane  Webbplatsens upplägg  Informationsdesign, hur ska allt hänga ihop (wireframes)  Grundläggande layout  Navigationslayout
53. The Surface Plane  Visuell design, och allt vad det innebär.
54. Skapa en webbplats med fokus på användarna Hur går det till?
55. 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.
56. 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
57. 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
58. Iterativ utformning
59. Utformning - Vision  Från skiss och skelettliknande visioner till mer konkreta visioner  Från en generell bild av vad man vill åstadkomma till detaljnivå som t.ex. funktionalitet, navigering, vad saker ska heta osv.
60. Utformning - Design  Ett ”hantverk” som kräver kompetens inom grafisk design, informationsarkitektur, interaktionsdesign, språk och programmering  Användaren är inte direkt inblandad, men bör hållas i åtanke.
61. Utformning - Utvärdering  Kontrollera att man är på rätt väg, vilket bör göras tidigt och ofta genom t.ex. - Diskussioner - Skisser och prototyper - Gradvis expanderande sajter/program  Mer om användbarhetstester i nästa föreläsning
62. Utformning - Återkoppling  Utifrån resultatet av utvärdering, ändra visionen: - Fördjupningar och förtydliganden. - Åtgärda eventuella problem. - Eventuella förändringar av syfte och målgrupp.
63. Uppföljning  Sluttest – Mer grundligt än i utformningsfasen och har ofta inslag av objektiva mått.  Loggar och statistik som ger en bild av faktisk användning, exempelvis funktioner som ofta eller sällan används.
64. Att göra ”lagom” mycket
65. Nästa föreläsning Användbarhetsutvärderingar