6.6
15-‐10-‐05 TNM040 Kommunika2on och användargränssni; HT2015, FÖ6 Idag • Språk • Utvärdering Förmågor och begränsningar Relevans Vik$ga processer • Percep2on • Uppmärksamhet • Minne • Språk • Problemlösning “Morgondagens civilingenjör är en kommunicerande och socialt kompetent person, med kunskaper och färdigheter inom en mängd olika komple;erande områden”. Civilingenjörsförbundet Vad krävs? “…kunskaper och färdigheter i a; handha produkter, processer och arbetsmiljö med hänsyn 2ll människors förutsä;ningar och behov”. Högskoleförordningen Kogni2v psykologi Psykologi -‐ milstolpar • Sägs vara både den äldsta och den senaste delen av psykologins historia. • Andra världskriget – tydligt behov av mer kunskap om (det som senare blev) kogni2v psykologi – Aristoteles gjorde upp lagar om hur vi lär och minns. – 1956 en egen skola (många studier och ar2klar om problemlösning, uppmärksamhet, minne, språk) . – – – – Förstå na;seende (visuell percep2on) Förstå kodade meddelande (problemlösning, språk) Designa varningssignaler (audi2v percep2on) Begränsningar i kapacitet hos piloter (minne, uppmärksamhet) • använde bara en bråkdel av 2llgänglig informa2on 1 15-‐10-‐05 Kogni2v psykologi Språk • Sägs vara både den äldsta och den senaste delen av psykologins historia. – Aristoteles gjorde upp lagar om hur vi lär och minns. – 1956 en egen skola (många studier och ar2klar om problemlösning, uppmärksamhet, minne, språk) . – 1967 bok som heter "Cogni2ve Psychology" (Neisser). – Under senare år -‐ hur man ska förstå människa-‐datorinterak2on. Metaforer Metaforer • Blue Tooth (blåtandskommunika2on) – varför heter det så? • Liknelser -‐ begrepp och existerande mentala modeller används för a; karaktärisera och förklara det som är okänt -‐ överföring från en domän 2ll en annan. • Används för a; organisera tänkande och främja förståelse. Metaforer Metaforer • Metaforer existerar på flera olika nivåer • På en hög nivå genom a; organisera en hel arbetsyta på en skärm, tex skrivbord. 2 15-‐10-‐05 Metaforer • Metaforer existerar på flera olika nivåer • På en hög nivå genom a; organisera en hel arbetsyta på en skärm, tex skrivbord. • På en opera2v nivå, för a; ueöra något, tex drag-‐och-‐släpp • På en låg nivå genom exempelvis ikoner som avbildar något meningsfullt för användaren, tex. filer/mappar, fönster. skrivare etc. Ikoner • En ikon är – religiös bild oia avbildad/målad på trä – en representa2on i bild av e; objekt – I människa-‐datorinterak2on: en bild/grafisk symbol vars uppenbarelse leder 2ll a; man tänker på en funk2on • Vik2gt med design och igenkänning/förståelse av ikoner. • Den metafor som valts bidrar starkt 2ll igenkänning av vilken funk2on (applika2on) de representerar. • Det första en användare gör är a; försöka förstå/lista ut vad något är innan man klickar på det (öppnar det). 3 15-‐10-‐05 Ikoner Tar upp lite utrymme (mindre än text) Känns (oia) igen snabbare än text Oberoende av språk (bra för användning i olika länder) Är oiast este2ska • • • • Ikoner • Godtycklig Ikoner • Fyra sä; på vilket en ikon kan representera e; underliggande koncept Godtycklig (arbitrary) Symbolisk (symbolic) Exempel (example) Likhet (resemblance) • • • • Ikoner • Symbolisk – Har ingen rela2on 2ll avsedd betydelse så en associa2on måste läras in – Inte nödvändigtvis dålig design även fast den måste läras in Ikoner • Exempel – Representerar e; centralt a1ribut av e; objekt eller en handling – Exempelvis används en kniv och en gaffel för a; representera ”restaurang”. Bilden visar de mest grundläggande a;ributen för vad som sker på en restaurang, det vill säga man äter där – Refererar 2ll ngt (handling, objekt eller begrepp) som ligger på en högre abstrak2onsnivå än bilden i sig – bilden av e; vinglas med en spricka förmedlar begreppet ömtåligt (här ömtåliga varor, inte bara vinglas) Ikoner • Likhet – Presenterar en likartad/jämförbar avbildning av något (objekt, funk2on etc.) – Ikonen är en reproduk$on av e; objekt, funk2on – Vägskylten för fallande stenar presenterar en direkt likhet med den fara den varnar för 4 15-‐10-‐05 Ikoner Ikoner Två vik2ga saker a; tänka på vid design: • 1) Tolkning (vad ska ikonen förmedla) – Kan vara svårt, en ikon kan förstås vad gäller en bild/e; objekt men vara oförståelig vad gäller dess betydelse – Ikoner utan text bör undvikas? (för a; förhindra a; deras betydelse inte framgår) men då försvinner fördelen med a; använda ikoner – koncisa, små, sparar plats etc. #6 Overly original metaphors Selec2ng what is to be displayed in an icon is always a compromise between recognizability and originality. Before a metaphor (image) is developed for an icon it is wise to see how it is done in other products. Maybe the best solu2on lies not in coming up with something original but rather in adop2ng the exis2ng solu2on. An example of excessive originality is the bin icon in OS/2 Warp 4, which is not actually a bin at all but a shredder. Another problem with choosing a shredder is that there is no one well-‐known type of shredder out there. The icon appears very much like a printer with an octopus hidden inside. What is more, it is absolutely unclear how a full bin would be displayed according to this metaphor. Icons Ikoner Två vik2ga saker a; tänka på vid design: • 2) Läsbarhet (avser om man kan se/skilja mellan ikoner eller inte) – Ikoner visas inte all2d under ideala förhållanden (svag eller stark belysning, skärmupplösning, storlek på själva ikonen) – Under vissa förhållanden är det ikonens utseende som styr dess uppfa;ning och urskiljbarhet, ikoner ska inte designas så a; de bara varierar/skiljs åt av små detaljer. Ikoner A; minnas • En användare måste kunna vara fokuserad på (arbets)uppgiien, inte på a; hantera verktyget. • Man får inte överbelasta korrdsminnet. • Man ska stödja lång2dsminnet. • Människan kan överblicka och orientera sig i en stor informa2onsmängd i real2d och ha full koll på det som sker – om gränssni;et stödjer de;a. • Mycket små informa2onsmängder kan vara totalt oöverskådliga och svårtolkade i annat fall. • Informa2on vi inte ser kan vi inte hantera effek2vt. • ”Informa2on overload” uppstår genom för lite eller irrelevant informa2on eller för dålig presenta2on. • Informa2on kan (bara) tolkas och 2llämpas i dess rä;a sammanhang (användare, uppgii, syie, ...) 5 15-‐10-‐05 Utvärdering • Handlar om a; “testa” något på något sä; för a; få kunskap, få svar. • Datainsamling c Utvärdering Utvärdering Varför utvärdera? Varför utvärdera? • Kontrollera a; du förstå; kundens krav och användares behov och förutsä;ningar • Kontrollera a; gränssni;et följer vik2ga designprinciper • Undersök hur produkten påverkar användandet (arbete, ny;a, nöje…) • Bestäm om produkten är klar (exempelvis 2llräckligt ”användbar”) för a; klara specifika mål, en release etc. • Det är svårt a; förutse vad som kommer a; ske vid användning/bruk • Det är (mycket) lä; hänt a; du missat något • Andra är inte som du • Du är inte användaren • Problem hi;as och kan lösas ”i 2d” • Minskad utvecklings2d, förbä;rad utveckling Användbar Utvärdering Vad vill man undersöka? • Handlar om a; “testa” något på något sä; för a; få kunskap, få svar. • Datainsamling • När i designprocessen? • • • • • Effek2v a; använda Lä; a; lära Lä; a; komma ihåg Säker a; använda Tillfredsställande a; använda • Definiera/opera2onalisera!! – Beror på syiet – Återkommande i en itera2v process 6 15-‐10-‐05 Utvärdering • Kvalita2v • Kvan2ta2v • Kontrollerad (mer eller mindre) • Ueörs av experter (analy2sk) • Ueörs av användare (empirisk) Intervju • • • • Observa2on Intervju Tänka-‐högt Enkät • Mätning • Inspek2on (heuris2ker/ designprinciper) • Explora2v/ueorskande • Forma2v • Summa2v • Ostrukturerad – Tillåter den som intervjuas a; ”tala helt fri;” • Strukturerad – Följer en fördefinierad lista med frågor – Minimerar påverkan av kontexteffekter och 2llåter bra sammanställning av svar • En kombina2on av båda • Kom ihåg a; fråga ”Varför”!! Enkät Enkät • Skrivna frågor/påståenden • Två typer: • Innan ”test” för a; samla in vik2g kunskap om personen som deltar (bakgrundsinforma2on som ålder, erfarenhet, vana, vanor etc.) – Öppna (svara fri;) (kvalita2v) – Slutna (välja mellan olika fördefinierade alterna2v , exempelvis Likertskala) (kvan2ta2v) • Eier ”test” för subjek2v återkoppling, för a; samla in reak2oner, artyder, preferenser etc. Enkät Enkät Öppen fråga: Sluten: Har du några förslag på hur gränssnittet skulle kunna vara lättare att använda? …………………………………………………………………………… …………………………………………………………………………… Semantisk skala: Presenterar par av motsatta adjektiv på skalans olika sidor Att interagera med gränssnittet var Lätt 1 2 3 4 5 svårt Jag upplevde gränssnittet som Konsekvent 1 2 3 4 5 Inkonsekvent Svårt att hitta ord som verkligen är varandras motsatser och “likvärdiga” Exempelvis: användarvänligt - användarovänligt användarvänligt - icke användarvänligt användarvänligt - fientligt 7 15-‐10-‐05 Questionnaire ”Tänka högt” Sluten: • Observa2on av någon som använder e; system och då personen uppmuntras 2ll a; ”tänka högt” under 2den. • Personen berä;ar: Likert skala: ett (positivt eller negativt) påstående till vilket respondenten skattar i vilken utsträckning denne håller med – – – – – Det är alltid tydligt var jag kan hitta den funktion som jag behöver 1. Instämmer inte alls 2. Instämmer inte 3. Vet ej 4. Instämmer 5. Instämmer helt Det är svårt att veta var jag är när jag navigerar i gränssnittet 1. Instämmer inte alls 2. Instämmer inte 3. Vet ej 4. Instämmer 5. Instämmer helt Vad han/hon gör, försöker göra Vad han/hon tror händer Varför han/hon gör vissa saker Vad han/hon skulle vilja kunna göra … Var försiktig då du sammanställer och analyserar resultaten! Överväg antal steg i skalan, neutralt val i mitten ”Tänka högt” • Observa2on av någon som använder e; system och då personen uppmuntras 2ll a; ”tänka högt” under 2den. • Personen berä;ar: – – – – Vad han/hon gör, försöker göra Vad han/hon tror händer Varför han/hon gör vissa saker ….. • Fördel: Mätning • • • • • Tid Fel eller inte Antal fel Antal klick Kvan2ta2va må; i enkäter – man förstår användares mentala modeller • Nackdel: – kan upplevas som distraherande, onaturligt, trö;samt – inga mätningar • Vik2gt med konkret syie och mål (vad säger annars 2den 37 sekunder för a; slueöra en uppgii?) • Mycket beror på hur bra du är på a; få folk a; prata och hur väl du följer upp vad personen säger Mul2-‐touch table system for medical visualiza2on: Applica2on to orthopedic surgery planning.2011. Lundström, C., Rydell, T., Forsell, C. Persson,A. & Ynnerman, A. IEEE Transac*ons on Visualiza*on and Computer Graphics, 17(12), 1775-‐1784. Tänka högt, intervju and enkät 8 15-‐10-‐05 Tänka högt, intervju Heuris2sk utvärdering Inspek2onsmetod En eller flera experter ueör en “inspek2on” eller granskning Ueörs utan användare (i sin ursprungliga form) Man utgår ifrån vedertagna riktlinjer för god design och bedömer om systemet följer dessa eller inte • Syiet är a; hi;a användbarhetsproblem, ange hur allvarliga de är och rekommendera lösningar på dessa för a; förbä;ra • Arbetet ueörs systema2skt och följer en viss ordning • A; ueöra det med experter är e; bra komplement 2ll utvärdering med användare (exempelvis innan dessa involveras) • • • • Se “How to conduct a heuris2c evalua2on” av Jacob Nielsen h;p://www.nngroup.com/ar2cles/how-‐to-‐conduct-‐a-‐heuris2c-‐evalua2on/ Tominski, Forsell & Johansson. 2012. Interac2on support inspired by natural behavior. IEEE Transac*ons on Visualiza*on and Computer Graphics, 18:12 , p. 2719 – 2728. Heuris2sk utvärdering Fler heuris2ker/guidelines Nielsen & Molich (1994)-Nielsen (1990) Schneidermans "Eight Golden Rules of Interface Design” h;p://faculty.washington.edu/jtenenbg/courses/360/f04/ sessions/schneidermanGoldenRules.html Tognazzini ”First Principles of Interac2on Design” h;p://www.designprinciplesiw.com/collec2ons/first-‐principles-‐ of-‐interac2on-‐design Fråga eier fler! • • • • • • • • • • Visibility of system status Match between system and the real world User control and freedom Consistency and standards Error prevention Recognition rather than recall Flexibility and efficiency of use Aesthetic and minimalist design Help users recognize, diagnose, and recover from errors Help and documentation h;p://www.nngroup.com/ar2cles/ten-‐usability-‐heuris2cs/ http://www.id-book.com/firstedition/catherb/ index.htm This interactive toolkit enables you to do either of the following: a) view a list of the suggested heuristics for a particular type of electronic device, or b) select your own heuristics for a type of device and then compare your selections against a list of suggested heuristics. • • • • • • • • Website Mobile phone Personal organizer Pocket PC Tablet PC Interactive TV Interactive toy Interactive kiosk Rogers, Sharp & Preece. (2011). Interac2on Design. 9 15-‐10-‐05 Metoder Metoder h;p://www.usabilitypartners.se/om-‐ anvandbarhet/metoder Metod och resultat h;p://www.usabilitynet.org/tools/methods.htm • Rapportera hur utvärderingen gick 2ll – Deltagare (antal, bakgrund) – Metod och procedur • Rapportera och analysera resultatet på e; meningsfullt sä; och presentera det så a; det är lä; a; läsa och förstå Inför projekt – 6 2ps • • • • • • Dont make me think! (Krug… Visionera Konkre2sera Visualisera Utvärdera Revidera Arbeta från lågupplöst 2ll högupplöst – iterera! 10 15-‐10-‐05 Dont make me think! (Krug… Perspek2vtänkande Designprocess och kvalité • De Bono: tankemetod för a; se saken ur olika synvinklar DeBonos sex tänkarha;ar DeBonos sex tänkarha;ar • Syien med tänkarha;ar • DEN VITA MÖSSAN är som papper: neutral, bär informa2on eller data. Vilken informa2on har vi? Vilken informa2on saknas? Vilken informa2on skulle vi vilja ha? Hur ska vi få den? • DEN RÖDA MÖSSAN handlar om känslor och intui2on. • DEN GULA MÖSSAN är som solen: op2mis2sk och posi2v. Med denna mössa letar man eier sä; a; lösa problem och hi;a välgrundade fördelar med de idéer man granskar. • DEN SVARTA MÖSSAN är som en domarkåpa (USA) som gör kri2ska bedömningar. A; iden2fiera varför en idé inte kommer a; fungera eller varför den inte är lönsam är den svarta mössans uppgii. • DEN GRÖNA MÖSSAN står för krea2vitet, nya idéer, nya alterna2v, nya möjligheter. • DEN BLÅ MÖSSAN står för fågelperspek2vet. Med denna mössa tänker man på processen, dagordningen, nästa steg, sammanfa;ningar, slutsatser. – fokusera och förbä;ra tänkandet – förbä;ra kommunika2on – effek2visera beslutsfa;ande Projekeörberedelse -‐ Avstämning V42 (12-‐16okt) ska alla grupper redovisa en projkeeörberedelse: Syiet med projekeörberedelsen är a; ni ska etablera er som grupp, komma överens om projketuppgii och om hur projektet ska hanteras och dokumenteras. Det innebär också a; diskutera styrkor och svagheter, eventuell kompetensutveckling och andra förberdelser som behövs etc. Projekeörberedelsen ska innehålla: • Projektuppgii • Projektmetod och arbetsfördelning – – – – • Roller • Vik2gt a; resepktera allas önskningar och a; var och en kommunicerar önskemål, styrkor och svagheter 2ll gruppen. System för a; hantera projektet • Fildelning, Excel, Word, Facebook etc. Parprogrammering eller inte Början 2ll projektplan och 2dsplanering – • Tydlig beskrivning av typ av gränssni;, syie, målgrupp(er) c När skall arbetet ueöras, vad ska göras och i vilken ordning och hur lång 2d beräknas varje moment a; ta. • Förstudie • Implementa2on • Utvärdering/ar Gruppkontrakt – – E; kontrakt ska upprä;as och signeras. Se föreläsningsanteckningar och förslag på innehåll på hemsidan (under Projekt). 11
© Copyright 2024