Extra inlämningsuppgift (pga. frånvaro)

Iterativ design är ett koncept och en projektstruktur inom HCI som innebär att utvecklarna tar fram en design, bygger den, utvärderar den och sedan ändrar (förbättrar eller byter ut) designen. Detta innebär helt enkelt att en initiallösnings begränsningar kan förbättras, och dess goda egenskaper kan förstärkas. Anledningen till att detta system finns och används är att det är mycket svårt att skapa en komplett design på första försöket. Oftast krävs att designteamet genom en rad utvärderingar och tester som personas- & scenariofunderingar, Think-Alouds eller betatester skapar sig en bild om hur deras produkt faktiskt fungerar i en verklig situation. Efter det kan produkten förbättras. Att repetera detta beteende kallas iterativ design.

Denna bild visar hur jag upplever att den iterativa arbetsprocessen ser ut. Man börjar med problemformulering/kravlista, skapar en design, skapar en prototyp, utvärderar och sedan (re)designar. (Källa: http://www.pling.org.uk/cs/doi.html)

Under vårat grupparbete tycker jag att den iterativa utvecklingsprocessen varit mycket tydlig och påtaglig. Vi har i någon utsträckning diskuterat hur nästa iteration av vår design ska se ut vid varje arbetstillfälle. Allt eftersom att vår problemformulering och våra produktkrav blivit tydligare har det varit naturligt att produktidéen också utvecklades stegvis (iterativt).

Think Aloud - Sammanfattaning

Bonjour bloggen 😊

Vi genomförde våra thinkalouds på barn då de är våran målgrupp. De flesta barnen klarade av att gå igenom programmet på under fem minuter vilket tyder på man redan i detta stadium på kort tid kan lära sig grunderna av programmet utan någon yttre hjälp om man har lite dator vana. Men det betyder inte att vi inte fick någon kritik eller att inga problem uppstod under thinkaloudsen.

När barnen testade prototypen fick vi en del feedback, varje individuellt barn hade ju sitt att bidra med och utforskade programmet på sitt sätt. Men det fanns två saker som återkom; dels att den stora kartan tolkades som den där man skulle placera ut bänken samt att man skulle dra saker och ting. Det är inte konstigt att barn trodde man skulle dra runt saker och ting, det är praxis nu för tiden att man drar runt objekt på skärmar. Vi planerade att göra så att man drog ut bänken men på grund av tekniska begränsningar var det inte möjligt. Det första problemet är svårare att tolka och det är svårt att riktigt hitta roten till problemet. Vi lyckades aldrig komma på varför barn trodde att man redan i den stora kartan skulle placera ut bänken så för att lösa problemet tvingades vi använda oss av text, något som man försöker undvika inom spelindustrin där mottot "don't overwhelm the player" är något man strävar efter, ofta brukar man räkna med att åtta ord är överväldigande för vuxna så för barn är det nog ännu färre. Utöver dessa två problem stötte barnen på en massa andra hinder som exempelvis att de tyckte texten var för liten, färgschemat hade för lite kontrast och att de trodde man startade genom att klicka på avstängningsknappen.

Men känslan var i överlag att det var ett intuitivt program att arbeta med. Barnen sa saker som:
"Det var ju aslätt, hallå det var ju aslätt! Jag vill göra det en gång till."
"Ahh, nu fattar jag. Det här ser ju ut som the sims eller nått."
"Knapparna ligger ju där de brukar."
Vi tror att programmet var enkelt att använda för att vi försökte designa prototypen me Nielsens 10 usablity heuristics i åtanke. Vi har gjort det enkelt att ångra vad man gör, har en minimalistisk och responsiv design samt så planar vi ut inlärningskurvan genom att följa samma design som många andra program och spel.

tl;dr barn tycker om programmet och franskt piano är chill 🇫🇷🎹

Kommentarer & reflektionen kring utvecklingen av hi-fi protoypen (iterativ design) + summerande inlägg (slutpresentationen)

Genom det här projektet har vi försökt att inte förälska oss för mycket i vissa designbeslut eller konceptidéer. Kursen har i sig varit upplagd på ett sätt som uppmuntrat till en iterativ designprocess genom att ha schemalagda övningstillfällen med brainstormingövningar och sedan manat grupperna att mellan tillfällena sitta ner och vidareutveckla, sålla och fatta beslut om olika vägar att ta projektet vidare.

När vi inför slutpresentationen kollade genom vår DRIVE (databas) såg vi en tråd där vi ganska tidigt yttrade en idé (se under orange rubrik) som sedan lades åt sidan till förmån för en mer fri brainstorming, men som på ett eller annat sätt lyckades komma tillbaka i ett av koncepten som föddes fram. 

Vi tog fram en lo-fi prototyp där logisk följd var det viktigaste (hur processen går från tom till inredd park - ur användarens perspektiv). Vi tog fram en Moodboard med inspirationsbilder och utvecklade lo-fi prototypen till en hi-fi prototyp med mer fancy utseende och förbättrad logisk följd/processflöde.

Vi tog hänsyn till kritiken från ÖVN 4 (första presentationen av lo-fi prototypen) när vi finslipade hi-fi prototypen till det läge som presenterades under ÖVN 6 (slutpersentationen). Vi tog rakt av tipset att lägga till en gräns för hur många objekt som kan placeras och löste det genom en plånboksmodell - elevgrupperna ges en budget och de olika föremålen kostar olika mycket.

Det som i slutändan blev vår Hi-fi prototyp (program för att öppna hämtas här) är en väldigt kontrollerad miljö där användaren ändå har möjlighet att påverkar innehållet genom att anpassa objekten och dess relativa placering (framtida implementeringar) – dessa kreativa inslag är tänkta att aktivera användaren och leda denna mot kreativ problemlösning och uppmuntra till reflektion om arbetsprocessen och objektens samverkan (i parken).

Vi har också fokuserat mycket på att vårat gränssnitt ska vara intuitivt och mycket lätt att komma igång med. “Start-up” tiden ska vara mycket kort, för att snabbt fånga intresse och motverka downtime. Vi har väl löst detta genom att låta våra ikoner vara stora och tydligt visa en bild av det de representerar. Gränssnittet har också en stor “världsvy” som visar spelvärlden (parken), vilket gör det lättare för användaren att se vad de har åstadkommit och vad de håller på med.

För att kunna spara ”data” och ta vara på lärdomar och de projekt som eleverna bygger upp har det för oss varit viktigt att inte lämna de mer traditionella datorprogrammen - de som främst fokuserar på resultatet av användningen - så projekten som skolklasserna producerar/tar itu med inte bara stannar som trevliga (ploj)koncept utan att vi (utvecklare) och vidare dataanalytiker/insamlare faktiskt tar elevernas arbete allvar och vågar lyssna på förslagen som kommer fram.

se även FÖRDJUPNINGSUPPGIFT för jämförande bilder mellan vår prototyp och the Sims.

FÖRDJUPNINGSUPPGIFT (MDI)

Till fördjupningsuppgiften samlades gruppen i en datorsal och letade efter intressanta HCI-relaterade artiklar. Vi bestämde oss ganska snabbt för att fokusera på hur användargränssnittet kan utformas för att skapa intresse och dra fokus till huvuduppgiften - detta har varit gruppens strävan hela tiden sen konceptgenereringen.

Daniel hittade en mycket intressant artikel med titeln Video game values: Human - computer iteraction and games som visar på en tydlig skillnad i hur spel utformas - för att dra intresse till själva upplevelsen av användandet - jmf med hur mer traditionella mjuvaror tas fram - med huvudfokus på att uppgiften blir genomförd.

Här är ett citat som sammanfattar stora delar av artikeln

“Games focus on the process of use (gameplay) rather than the result of process… while the goals of productivity applications are generally defined outside the application, by the task”

Artikeln fortsätter och tar upp vilka konsekvenser detta får på utformandet av mjukvaran

“The degree of innovation in games tends to exceed that of productivity applications, both in content and control systems.”

Spel är viktiga för att de enkelt fångar användarens uppmärksamhet och spel tenderar även att stimulera innovation & nyskapande till en högre grad än produktiva applikationer. Detta har inspirerade oss att göra en spelbaserad prototyp som prioriterar användarvänlighet/usability - för att minimera start-up tiden. Detta är ofta något som saknas hos produktiva applikationer såsom Adobe Photoshop och/eller andra verktyg.

 

En till aspekt är att vår målgrupp är barn. Spel har fördelen att de fångar användarens intresse genom exempelvis belöningar och genom att vara roliga att jobba med - att fånga barnens intresse kan vara avgörande för utfallet av hela projektet. Detta har genomsyrat utformandet av hi-fi prototypen (och förbättringar som vi gjort) och det finns ett gäng likheter mellan användargränssnittet som används av  exempelvis the Sims i det hos vår slutprototyp.

Källor

doi-org.focus.lib.kth.se/10.1016/j.intcom.2006.08.008

dx.doi.org.focus.lib.kth.se/10.1080/00140130310001610865

Think Aloud - August

Här är en think aloud av vår hi-fi prototyp som jag lät min kusin Mio Singemo (12 år) utföra. Han har ganska god datorvana, och spelar mycket Minecraft, men inte så mycket The Sims. Denna think aloud utfördes 29-04-2017.

Instruktioner:

“Logga in och placera ut en bänk. Hitta sedan menyn för att kolla närmare på och ‘fixa’ bänken. Medan du gör det, bara säg allt du tänker, liksom.”

Vid startskärmen

“‘Klicka på ditt namn’ - Jag är G2”

Klickar mitt på startskärmen, tas till nästa sida

“Jag trycker på bänken”

Klickar på bänk-ikonen under kategorier vilket leder till att undermenyn med en bänk öppnas.

“Oj” - trycker på även denna bänk-ikon, vilket leder till ‘fixa’ vyn.

“Eeeh, tillbaka…”

Klickar på tillbaka, tas till parköversikten. Rör muspekaren över skärmen lite på måfå, ser att muspekaren ändras över det ‘aktiva’ området.

“Här där det är grönt går det att klicka”

Klickar på det ‘aktiva’ området - tas till närvyn.

“Aha, så bänken ska vara någonstans här…”

Klickar några gånger, försöker ‘drag-n-drop:a’ bänken innan han märker att det finns en ‘placera’ knapp.

“Jaha, ok nu gick det.”

Klickar nästan omedelbart på bänken i närvyn. Detta gör så att bänken tas bort.

“Nu tog jag bort den. Det går att ta bort också.”

Instrueras att logga ut.

“Ok, det är väl bara att klicka tillbaka?”

Klickar på tillbaka två gånger och loggas ut.

“Aa precis, det var det.

Intervjufrågor som ställdes efter think aloud:en.

Tyckte du att det var lätt att använda programmet?

För mig - ja. Men jag är ganska bra på datorer, det finns ju vissa som inte är det. Jag tyckte det var svårt att veta att man ska klicka på just det gröna, fast det är ju mörkare så man kan lista ut det. Jag försökte ju också dra ut bänken istället för att klicka på “Placera”, men det gick ju också fort att förstå.

Tyckte du att menyerna var lätta att förstå och att alla knappar satt på vettiga ställen?

Ja, knapparna ligger ju där de brukar.


Vi kan alltså se att det var vissa mindre otydligheter i vår design. Vi borde kanske göra det tydligare att det 'aktiva området' är just det, och att man måste klicka på det för att komma till närvyn innan man kan placera ut objekt. Annars var användarprocessen i detta fall mycket smidig, hela think aloud:en tog ungefär 2 minuter. Jag borde möjligtvis ha bett Mio att navigera till 'fixa'-vyn igen då han nådde dit av misstag första gången, men det kändes inte relevant under utförandet.

Think Aloud - Martin

Hej bloggen 😊

Jag fick en grundskoleelev att testa hi-fi prototypen. Han är en kille som går i sjuan och heter Martin. Han fick testa applikationen på min dator.

Det första och enda jag bad honom göra var att logga in och placera en bänk i parken, jag ville ge honom så lite ledning som möjligt för att se hur en absolut nybörjare skulle använda programmet. Detta visade sig vara en dålig fråga då jag blev tvungen att hjälpa honom vid flera punkter senare. Men till en början gick allt bra. Vid startskärmen klickade han först på power knappen för att komma in men efter att det inte fungerade klickade han direkt på sin ikon och kom vidare. Vid nästa skärm uppstod tyvärr komplikationer, för Martin tolkade nämligen det som att den stora kartan var slutskärmen och försökte redan där placera ut en bänk. Han försökte gång på gång att dra ut en bänk från bägge ställen där en bänk ikon finns. Han störde sig på att vi hade en verktygslåda som var så tom. Efter lite ledningen kom han vidare till nästa skärm där han ännu en gång försökte dra ut bänkar, klicka på marken i försök att lägga ut bänkar och han pratade om att klicka på gubbar för att få de att bygga bänkar. Men efter viss tid lyckades han utan ledning klicka fram textbubblorna för att få fram texterna där det står placera och fixa. Tyvärr var de så små att han först inte märkte dem, han klagade sedan på att de var för små. Han klagade också på att han av misstag råkade ta bort bänken när han ville klicka på den. Efter detta ville han testa vad fixa knappen gjorde och han klickade på den och han hade testat allt som fanns att göra i programmet så jag tackade honom för hans hjälp.

Efteråt gav han mig lite feedback. Han sa att han tyckte texterna var för små och svåra att se. Han föreslog att ha viktiga saker i en mer utstickande färg som exempelvis röd. Speciellt ville han att det skulle vara mer tydligt vad som var ens område genom att måla det rött och kanske placera ens ikon i det. Han tyckte även att man göra knappen större och texten röd. Resten av hans kommentarer var att han ansåg att olika features fattades, han ville exempelvis att man skulle kunna välja namn och profilbild.

tl;dr barn vill välja profilbild 🎉

THINK ALOUD (Hi-Fi Prototyp)

Jag testade prototypen på två grundskoleelever, Elias (4e klass) och Ella (7e klass).

De båda testade appen/programmet var för sig och fick endast den enkla introduktionen “Ni skall placera ut en bänk i parken, säg vad ni tänker, vad som känns bra eller konstigt, lätt eller svårt”.

ELIAS

Inloggningsskärmen

“Ska man klicka på den här? (avstängningsknappen => inget händer)

*kollar på skärmen och klickar på Grupp G2* (han kommer vidare) “Jaa, ha! :D”

Överblicksvyn

*Elias kollar intensivt på skärmen* “Den här kanske” *klickar på bänk-ikonen under Kategorier* (En toolbar kommer fram) “Ok…”

*Han klickar på bänk-ikonen som nyss poppade upp* (Tas till bygga-om-vyn)

Bygga-om-vyn

*Klickar på bänken några gånger, på olika ställen* “Inget händer här, ska det göra det? (Jag är tyst, rycker på axlarna och ler tillbaka)

“Ne ok” *Klickar på Tillbaka*

Överblicksvyn (tillbaka till)

*Elias klickar lite på kartans olika delar, verkar medvetet undvika det mer färgade området* (inget händer) *Klickar på det färgade området* (tas till Parkvyn)

Parkvyn

(Toolbarmenyn är redan uppe) *Elias klickar på bänk-ikonen* (Fixa och Placera dyker upp)

“Placera! Eller hur?!” (Jag är tyst men ler) *Klickar på Placera* (bänken poppar upp i parken)

“Va det allt!?!” (Jag säger “Yes snyggt! Bra jobbat!”)

Tid: ca 1 min 15 s

“Det var ju aslätt, hallå det var ju aslätt! Jag vill göra det en gång till” *Går tillbaka till starten och testar igen*

*Elias leker runt lite och klickar runt i dom olika vyerna* (Nu upptäckte vi en saknad länk)

Om denna följd sker så funkar inte Tillbaka förrän man man klickar bort Toolbaren som visar bänk-ikonen

Grupp G2 - Parkvyn - Kategorier (Bänk-ikonen) - Toolbaren (Bänk-ikonen) - Fixa - Kategorier (Bänk-ikonen) - Tillbaka (FUNKAR INTE!!!)

ELLA

Inloggningsskärmen

*Klickar direkt på Grupp G2*

Överblicksvyn

*Klickar runt överallt på skärmen* “Men det går ju inte att klicka på någonting… Jättekonstigt...”

*Fortsätter klicka runt, klickar efter ett tag på Bänk-ikonen under Kategorier*

“Jaha ok (?)”

*Klickar på bänk-ikonen* (Kommer till Bygga-om-vyn)

Bygga-om-vyn

*Klickar på bänken* “Men inget händer ju”

*Klickar lite till på bänken* “Asså...”

*Tittar ett tag på skärmen*

*Klickar på Tillbaka*

Överblicksvyn (tillbaka till)

*Klickar runt på kartan lite till, och klickar slumpmässigt på det färgade området* “Jaha, vad är det här nu då”

Parkvyn

(även den här gången var Toolbarmenyn redan uppe)

*Klickar ett par gånger i parkområdet, och sen på Bänk-ikonen i toolbarmenyn*

(Fixa och Placera dyker upp)

“Placera…” *Klickar på placera* (Bänken hoppar fram i parken)

“Kan man dra runt den?” *Klickar på bänken* (Bänken försvinner)

“Men vad hände nu då?!” *Klickar på Bänk-ikonen i toolbar menyn igen & klickar på Placera*

Tid: ca 4 min

Jag säger “Nej inte än men vi har tänkt att man ska kunna dra runt bänken och andra saker i parken så man kan stoppa dom lite var man vill”

Ella säger “Är jag klar nu?”

Jag säger “Ja superbra jobbat”

Det var ganska svårt att få dom att prata och kommentera under tiden men dom sa ändå lite saker och tillräckligt för att jag skulle förstå det mesta som dom tänkte på (kopplat till dom olika skärmarna).

Det var svårt för oss också (gruppen) att få tag på barn att testa på men jag hade flyt att familjen bjöd hem några vänner över Valborg. Det var väldigt bra att vi lyckades genomföra dom här Think-aloud övningarna och en extra bonus att vi upptäckte en bristande länk i strukturen.