Psykologi, Human Factors og HCI John Paulin Hansen ITC, Usability E2003
Ben Schneiderman Høj-niveau teorier, eksempelvis: GOMS (goals, operators, methods & selection rules) - keystroke level Beslutnings-stigen, gulf of execution gulf of evaluation Skills rules knowledge Situated action: om brugsmønstre (Suchman, Kyng, Schmidt, Bannon)
Objekt-aktions modeller GUI frem for liniekommandoer Forstå den verden der skal repræsenteres eller anvendes til metafor, eksempelvis: Billedbehandling som fotoalbums, filmredigering som klippebord Opgavehierarkier -> projekter, kontakter, korrespondancer (tråde) frem for filer, arkiver, navne og datoer
Brugerne 1: Brugere er forskellige (og de befinder sig i forskellige situationer med forskellige opgaver med forskellige brugserfaringer): Brugsprofiler (køn, alder, osv.) Erfaringer (novicer, erfarne, eksperter) -> lagdelingsstruktur af systemer (også manualer, hjælpemenuer, fejlmeddelelser mm.) Nybegyndere vil gerne have udførlige feedback beskeder - dem gider eksperterne ikke. Nybegynder vil gerne have rene, enkle skærmbilleder. Eksperter vil gerne have dem tæt pakket med informationer.
Opgave analyse Opgaveanalysen gøres ofte alt for uformelt og ad hoc. Svært at definere hvad der skal være atomerne i en opgave Understøtte hyppige handlinger & kritiske handlinger som ikke kan automatiseres hvor siger man stop? Ofte der hvor man har en masse kode fra andre projekter som kan genbruges! Palm Pilot blev en kæmpe succes fordi de lavede en meget omhyggelig opgaveanalyse der identificerede de væsentlige opgaver, som skulle understøttes med enkle operationer.
Interaktionsformer Direkte manipulation Menu-valg Udfyldning af datafelter Kommandosprog & short cuts Naturligt sprog Multimodal (kropssprog) Fordele og ulemper ?
De 8 gyldne regler Konsistens - brydes mest ofte Understøt regelmæssige brugere Giv informativ feedback Afslut ordentligt Undgå fejl - og vær tolerant Fortrydelsesmuligheder Giv brugerne kontrollen Undgå overlast af korttidshukommelsen Understøttelse af regelmæssige brugere: shortcuts, modificering af menuer, cockies Afslut ordentligt: Chekout procedurer, feedback, kvitteringer Tolerance: eksempelvis ikke genudfylde en hel blanket hvis man skriver forkort postnummer. Brugerkontrol: Brugerne skal være initiativtagere til alle handlinger, ikke respondenter
Undgå fejl Fejl kommer efter tøven.... Alle fejler - selv læger! Teknikker: Indsæt automatisk par Fuldend selv sekvenser Bloker for fejlene Tøven: Storebæltbroens indvielse Lægefejl: Indsæt automatisk par: begyndelses og slutparenteser, ”” m.m. Fuldend sekvenser: autoudfyldning af formularer, url-er etc. Bloker for fejl: Biler kan ikke sættes i bakgear hvis de kører mere end 5 kilometer. Menupunkter der som ikke kan vælges på det pågældene operationstrin er gjort transparente
Guidelines for displays Brug designmanualer (konsistens!) Brug velkendte formater Minimal belastning af brugerens hukommelse Input skal ske i tilknytning til displays Fleksibilitet, eks. v.b.a. CSS Vis Mullet og Sano,
Anbefaling: Mullet & Sano
Pause 10 minutter Kom når det passer jer
”Dont make me think” Selvindlysende Selvforklarende Minimal kognitiv belastning Ikke forstyrre opmærksomheden
Spatiale relationer ”Ud på nettet”,” ind på sitet”, ”hopper til siden” Men til forskel fra fysiske rum så har man ingen: Størrelsesfornemmelser (10 eller 1000 sider?) Retningsfornemmelser (op eller ned i hierarkiet?) Stedsans (nedbrydes bl.a. pga. hyberlinks) Derfor er det nødvendigt med begreber for web-navigation og særlige hjælpeforanstaltninger til brugeren, så han/hun kan finde vej.
Krug´s heuristikker (1) Skab et klart visuelt hierarki: Prominent placering til det vigtigste på siden Visuelle relationer er logiske relationer Visuelle underinddelinger skaber grupperingerne Brug konventioner Opdel siden i klart definerede arealer Gør det tydeligt, hvad der kan klikkes på Undgå visuel støj Undgå tvetydigeheder ved valgmuligheder Gerne mere end 3 klik, bare de ikke kræver en masse omtanke.
Skab fokus punkter
Visuelt hierarki
Byg visuelle hierarkier
Perceptuel lagdeling Gruppér informationer i familier på max. 7 +/-2 medlemmer Bestemt rangordenen imellem de enkelte familier Slå de mindst betydningsfulde familier sammen eller ihjel så der kun er 3 - 5 familier tilbage på et opslag Skab en klar visuel adskillelse mellem de vigtigste familier og en klar visuel sammenhæng indenfor familierne
Struktur er det første man ser - hvis den ikke er der!
Krug´s heuristikker (2) Udelad unødvendige ord (”happy talk” og instruktioner) Vedvarende navigationsredskaber Site ID på alle sider Hver side skal have et navn, som er tydeligt og i overensstemmelse med den henvisning (linket) der førte til siden ”Du er her” indikatorer på alle sider (brødkrumme-stier øverst på siden) Instruktioner er først noget der opsøges, når det ikke længere lykkedes at fumle sig frem. Brødkrumme-stier (Hans og Grete-eventyret) som på ITU´s hjemmeside
Pause 10 minutter Kom når det passer jer
Krugs navigations test Hvilket site er dette ? (Site ID) Hvilken side er jeg på ? (Sidens navn) Hvad er de væsentlige sektioner på dette web-sted ? (Tabs eller andre angivelser) Hvad kan jeg gøre på det niveau jeg befinder mig? (Lokal navigation) Hvor er jeg i den store sammenhæng? (brødkrumme-stier eller andre ”Her-er-du”) Hvordan kan jeg foretage søgninger?
5 eksistentielle spørgsmål til en hjemmeside Hvad er dette ? Hvad har de her? Hvad kan jeg gøre her? Hvorfor skal jeg bruge dette site og ikke et andet? Hvor starter man på sitet? svar inden for 5 sekunder
Krugs navigations test Print en tilfældig side ud Lad testpersonen hole den i en armlængdes afstand, så den ikke kan læses tydeligt Bed vedkommende indkredse så hurtigt som muligt: Id Sidens navn Sektioner Lokale navigationer ”Her-er-du” søgemulighederne
Direkte adgang
Navigation (1)
Navigation (2)
Navigation (3)
Navigation (4)
Navigation, brugere og indhold