Boken. Kap Kap 11.3

Transkript

1 Konceptuell design

2 Boken Kap Kap 11.3

3 Konceptuell design är helt grundläggande inom interaktionsdesign kan upplevas som abstrakt och svårt att förstå förstås bäst genom att man utforskar och upplever denna designnivå på olika sätt

4 Konceptuella modeller

5 Konceptuell modell A high-level description of how a system is organized and operates Enables designers to straighten out their thinking before they start laying our their widgets

6 Mentala modeller Internal representations of reality that allow us to interact with the world Incomplete representations of reality

7 Mentala och konceptuella modeller Designerns mentala modell Systemets konceptuella modell Användargränssnitt Användarens mentala modell System

8 Vi utformar en dörr som öppnas med en fotocell! SJ:s tågdörrar

9 ...men folk begriper sig inte på fotoceller så vi gör en låtsasknapp istället så att de för in handen under fotocellen! Låtsasknapp Dörr

10 Användaren ser knappen och sluter sig till att dörren öppnas genom att man trycker på den En knapp! Jag trycker på den så öppnas dörren! Låtsasknapp Dörr

11 Ibland reagerar dock inte fotocellen Huh? Jag trycker men inget händer? Gör jag fel? Är dörren trasig? Låtsasknapp Dörr

12 Varför inte erbjuda en mer korrekt konceptuell modell från början? Detta är en dörr med fotocell som öppnas med en gest.

13 Donald Normans kylskåp Donald Norman, The Design of Everyday Things, sid

14

15 Vilken konceptuell modell erbjuder detta användargränsnitt? Kylskåpet har två separata kylsystem som båda kan kontrolleras med var sitt reglage.

16 Användarens mentala modell

17 Designerns mentala modell (av hur detta kylskåp bör fungera)

18 Den mest kända konceptuella modellen Att använda en dator är som att arbeta på kontor.

19 Nintendo Wii En konceptuell modell som bygger på TV-konceptet

20 Diskussion På vilken konceptuell modell bygger de flesta webbutiker?

21 Huvudkomponenterna i en konceptuell modell Metaforer (t ex bokmärken) Koncepten som användaren kommer interagera med (t ex spara, organisera) Inbördes förhållanden mellan dessa koncept (t ex hur viktig en handling är jämfört med en annan) Kopplingen mellan koncepten och den användarupplevelse produkten är tänkt att stödja

22 Metaforer

23

24 Vad är en metafor? Inom litteraturen: Min ros, jag älskar dig! Inom interaktionsdesing: konceptuella metaforer

25 Definition Mappning mellan två kognitiva domäner, en källdomän och en måldomän Källdomän Metafor Måldomän

26 Time Machine (Mac OS X)

27 Varför metaforer? Används i användargränssnitt för att underlätta för användaren att förstå måldomänen. Kunskap, erfarenheter och begrepp från källdomänen används för att organisera innehållet i måldomänen. En väl utformad metafor erbjuder användaren en god konceptuell modell.

28 Problem med metaforer i användargränssnitt

29 Gammal källdomän En metafor som bygger på en gammal källdomän aktiverar lite eller ingen förkunskap hos yngre användare

30 Aktiverar olämplig bakgrundskunskap i användarens mentala modell

31 Hjälper inte användaren att hitta tjänster som är datorspecifika Hur gör man en sökning i en bokhylla?

32 Riskerar att bryta konventioner och kulturella regler

33 De lider av den fysiska världens begränsningar Vad händer när bokhyllan blir full? Det går snabbare att hitta rätt bok med en lista.

34 Begränsar fantasin hos designers att komma på nya konceptuella modeller Skrivbordsmetaforen är nästan 40 år gammal!

35 ... men ändå så kommer användargränssnitt förmodligen bygga på metaforer för en lång tid framöver.

36 Övning Ni ska utforma ett datorprogram för att lära 6-åringar matematik Vilken/vilka metaforer väljer ni till programmets användargränssnitt?

37 En strukturerad process för att välja bra metaforer 1. Förstå vad produkten/tjänster ska kunna göra 2. Förstå vilka delar av produkten/tjänsten som är komplicerade och/eller kritiska 3. Generera metaforer Leta efter metaforer i användarnas beskrivningar Metaforer som redan används inom tillämpningsområdet

38 Fem frågor vid utvärdering av metaforer 1. Hur mycket struktur tillhandahåller metaforen? En bra metafor ska tillhandahålla struktur och helst känd struktur. 2. Hur mycket av metaforen är relevant för problemet? 3. Är metaforen enkel att representera? 4. Kommer din publik att förstå metaforen? 5. Hur utbyggbar är metaforen? Besitter den extra aspekter som kan komma till användning senare?

39 Övning Utvärdering av metafor till en delad reseplaneringstjänst Metafor: en tryckt resebroschyr

40 1. Hur mycket struktur tillhandahåller metaforen? Den tillför struktur som är baserad på den kända pappersbaserade broschyren. Detta är en bok och har därför sidor, ett omslag, någon typ av bindning för att hålla ihop sidorna, ett index och en innehållsförteckning.

41 2. Hur mycket av metaforen är relevant för problemet? Uppgifter om boende, tillgängliga faciliteter, karta över området och stödjande illustrationer är relevanta för reseplaneraren så innehållet i broschyren är relevant. Broschyrens fysiska struktur, t.ex. bladvändning, är mindre relevant. Reseplaneraren kan vara mer flexibel än broschyren och bör inte försöka efterlikna dess bokkaraktär. Slutligen trycks broschyren kanske en gång om året och kan inte hållas uppdaterad med de senaste ändringarna medan reseplaneraren bör kunna erbjuda den mest aktuella informationen.

42 3. Är metaforen enkel att representera? Ja. Semesterinformation kan vara en uppsättning broschyrliknande sidor. Observera att detta inte är detsamma som att säga att navigering genom sidorna ska vara begränsad till sidvändning.

43 4. Kommer din publik att förstå metaforen? Ja.

44 5. Hur utbyggbar är metaforen? Funktionaliteten hos en pappersbaserad broschyr är tämligen begränsad. Men den är också en bok och vi skulle kunna låna funktioner från e-böcker (som också är kända föremål för de flesta i vår publik), så ja, den är utbyggbar.

45 OBS! Sid 403 i boken Lämpliga metaforer Lämplig typ av interaktion Lämplig typ av användargränssnitt Vi väntar med den konkreta interaktionen till nästa designnivå: Lo-fi prototyping

46 Konceptuell design i projektet Systemets övergripande struktur Systemets konceptuella modell Metaforer Gruppering av tjänster i naturliga grupper Språkbruk/terminologi På denna nivå ska ni börja utforska designrymden, dvs. ni ska arbeta med flera olika alternativa lösningar (parallell design), genom att varje gruppmedlem tar fram var sitt designkoncept.

47 Tips från coachen Börja med en djupdykning i datan från användarstudien. Försök leva dig in i deras situation. Använd skisser, scenarios och storyboards för att utforska designrymden. Använd card sorting method för att skapa naturliga grupper. Beskriv INTE din konceptuella design i termer av hårdvara/mjukvara.