OBS! Under uppdatering…

Notera att deltagande i denna workshop är obligatoriskt. Om du av någon anledning inte kan delta ska du ta kontakt med kursansvarig. Se också instruktioner längst ned på denna sida för alternativ redovisning av workshopen.

Syftet med workshopen

Syftet med dagens workshop är att ni ska få prova på två mycket användbara tekniker för gränssnittsutveckling: paper prototyping och personas. Paper prototyping används för att enskilt eller i grupp spåna kring gränssnittsidéer och gränssnittsdesign på ett snabbjobbat och lättrörligt sätt. Personas hjälper utvecklaren att förstå användaren och hålla fokus på att applikationen är till för användaren.

Mål

• Att få insikt i nyttan med att använda paper prototyping för utveckling av applikationer och användargränssnitt
• Att få insikt i nyttan med att använda personas för att hålla fokus på användarnas perspektiv vid applikationsutveckling
• Att förbättra din applikations gränssnitt och användarupplevelse för slutuppgiften genom användning av dessa två tekniker

Dokumentation/redovisning

Allt material skapas under tiden för workshopen. Framtaget material ska läggas ut på sidan för slutuppgiften senast 1 vecka efter workshopen – se instruktioner nedan.

Paper prototyping – kort beskrivning

Även om du har redan har skapat en del grafik till gränssnitt och kanske har en del färdiga funktioner så ska papper och penna användas till denna workshop. Syftet med paper prototyping som teknik är att det ska vara snabbjobbat och skissartat för att undvika att man fastnas i en viss lösning för tidigt. Lägger man för mycket tid på grafiska detaljer, detaljer i layout och funktionalitet så är risken att man bygger fast sig i en lösning som inte är så användaranpassad och funktionell som den skulle kunna vara. Om man istället använder sig av snabba skisser som diskussionsunderlag för att mejsla fram sin funktionella, layoutmässiga och estetiska design så minskar man risken för den typen av fastlåsning. Och är det så att du har kommit en bit på vägen med att skapa ditt grafiska gränssnitt, så kan du utnyttja denna övning för att försöka utforska alternativa versioner av ditt gränssnitt – just för att komma ifrån den inlåsning som man riskerar att hamna i.

Personas – kort beskrivning

Personas är en teknik för att modellera användare. Den sammanfattar centrala egenskaper, attityder, behov och preferenser för användarna i den målgrupp man riktar sig mot. Man kan ha en persona, ett par eller många personas. Antalet beror på vilken/vilka målgrupper man vänder sig till och hur homogena/heterogena dessa grupper är. För att vara användbar behöver det vara en korrekt bild av dessa användare och man måste akta sig så att personan inte blir en karikatyr eller stereotyp. Det ska kännas som en riktig människa för att uppfylla sin funktion som är att hjälpa till att hålla fokus på användarnas behov och önskemål. Personan används för att att spåna kring funktionalitet och form och som ett kommunikationsredskap för att beskriva applikationens funktionalitet och syfte från ett användarperspektiv inom utvecklingsgruppen och med parter utanför utvecklingsgruppen.

Arbete individuell/arbete i grupp

I de stegvisa instruktionerna nedan är det angivet att vissa moment ska göras individuellt och andra i grupp. Det innebär inte att ni inte får diskutera och samarbete även i de individuella övningarna. Tvärt om – det är bara positivt att ni gör så i framtagandet av pappersprototyper och skapandet av era personas. Skillnaden mellan momenten som är uppmärkta som individuellt respektive grupp är att för de individuella momenten är fokus på att producera något (en pappersprototyp eller en persona) och i gruppmomenten så är fokus på diskussion.

Särskilda instruktioner för distansstudenter

Särskilda instruktioner för distansstudenter finns längre ner.

Instruktioner

Inledning 10 minuter – i helklass

Syfte: Beskriva upplägg och syfte för dagens workshop.
Upplägg: Efter inledningen så delas klassen in i grupper. Vi använder samma grupper som ni har i mjukvaruutvecklingskursen (för er som inte läser denna kurs parallellt så delas ni in i en egen grupp eller placeras i en av dessa befintliga grupper). Sedan följer man instruktionerna nedan för de olika övningarna. Lärare kommer att gå runt i grupperna och observera, svara på frågor och delta.

Prototyping

Steg 1.1 Paper Prototyping – rita upp gränssnittet 20 minuter – individuellt

Syfte: Presentera din applikations funktionalitet och hur gränssnittet i sin struktur och grundläggande form presenterar denna funktionalitet för användaren

1. Rita upp skärmbilder som presenterar din applikations huvudsakliga funktioner. Stilen ska vara översiktlig och skissartad. Lägg inte tid på detaljer och grafiska element. Skissen ska presentera funktionerna utan för mycket detaljer så att fokus blir på grundfunktionalitet och layout, hellre än på grafisk utformning och detaljer. Vid behov kan korta beskrivande texter, pilar och liknande användas för att beskriva funktionaliteten. Formen är inte viktig utan bara se till att få ned något på papper!

Steg 1.2 Paper prototyping – första intryck 20 minuter – i grupp

Syfte: Använda paper prototyping för att presentera och därmed kommunicera din applikationsidé till andra (och till dig själv). Det skissartade utseendet hjälper till att hålla fokus på koncept och huvudstrukturer genom att detaljerna inte skymmer sikten.

1. Presentera i tur och ordning era applikationer för varandra med era pappersprototyper som presentationsunderlag. Det ska vara korta presentationer med fokus på de grundläggande funktionerna utan för mycket detaljer. Syftet är att ge snabb översikt för de andra i gruppen vad er applikation är tänkt att användas för och ge återkoppling kring era första intryck till varandra.

Personas

Steg 2.1 Personas – skapa personas 20 minuter – individuellt

Syfte: Beskriva användarna som kommer att använda din applikation för bättre förståelse för vem din användare är.

1. Välj ut 1 eller 2 bilder på personer som ska representera dina typiska användare. (Resurs – bildgalleri: http://photobucket.com/martinspersonas) Har du en tydlig målgrupp räcker det med 1 bild. Har du flera målgrupper kan du välja ytterligare en till bild. Vi begränsar oss till högst 2 personas för denna övning, men använd gärna personas-tekniken för att fortsätta arbeta med tekniken för att analysera och förbättra ditt gränssnitt.
2. Fundera kring vilka allmänna egenskaper som dina respektive personas har för att få en känsla för vilken typ av personer det är (så att det blir lättare att sedan leva dig in i hur de ser på din applikation). Fyll i egenskaperna i separat persona-mall (nedan).
3. Fundera kring vilka specifika egenskaper som är särskilt relevanta för din persona i relation till din applikation – skriv ned de viktigaste och/eller mest utmärkande persona-mallen.
4. Gör en bakgrundsteckning för vem din persona är. Eftersträva att göra denna beskrivning personlig så att man får en känsla för att det är en riktig person som den handlar om (ingen karikatyr eller steretyp).
5. Fyll i övriga fält i persona-mallen.

Steg 2.2 Personas – presentera era personas för varandra 20 minuter – i grupp

Syfte: Låta de andra lära känna din/dina persona/personas och därmed få insikt i hur du ser på din målgrupp. Också att förändra personan för att göra det till en bättre representant för målgruppen genom den feedback som du får från de andra i gruppen.

1. Presentera i tur och ordning era personas för varandra. Kom ihåg att målet är personan ska känna som en riktig person. Diskutera gärna personans egenskaper och huruvida det är en bra representation för målgruppen för applikationen. Förändra personan, lägg till eller ta bort saker utifrån synpunkterna som kommer fram.

Redigering

Steg 3.1 Redigering – Redigering av pappersprototyper och personas 20 minuter – individuellt

Syfte: Att fixa till pappersprototyper och personas utifrån de intryck och den feedback som ni har fått hittills.

1. Redigera dina pappersprototyper – kanske lägga till lite detaljer, ändra vissa detaljer eller ta bort vissa detaljer – och redigera din/dina personas.

Persona Walk-through

Steg 4.1 Persona walk-through – Testa din design med personas 40 minuter – i grupp

Syfte: Att testa din applikationsidé och gränssnittskoncept genom att låta personan använda din pappersprototyp. Det är en gruppövning och ni ska utnyttja era olika perspektiv och erfarenhetsbakgrunder, men ni ska alla eftersträva att sätta er in i hur personan ser applikationen – att se applikationen (som den representeras av pappersprototypen) ur personans ögon. Målet är att få förståelse för användarens perspektiv och att identifiera förbättringspunkter i den konceptuella designen, sättet som funktionaliteten presenteras för användaren, i interaktionsflödet (sättet som användaren går från funktion till funktion) och/eller för funktionerna som erbjuds i applikationen.

1. Välj ut en av dina personas (om du har flera). Välj den som är den bästa representanten för din målgrupp.
2. I tur och ordning för varje applikation, gör en funktionsgenomgång – även kallat walk-through – där ni tillsammans guidar en persona (välj ut en persona om du har flera) genom funktionerna i din applikation. Ni ska alla eftersträva att sätta er in i personans roll och försöka se applikationen genom dennes ögon. En person i gruppen tar huvudansvaret för att guida personan genom applikationen – och denna person ska vara någon annan än du själv när det är din applikation som gås igenom. Ni ska dock alla vara delaktiga i denna övning och diskutera vad personan gör och hur denne uppfattar applikationen. Den som leder personan ska använd berätta-högt metoden (talk-aloud method) som helt enkelt innebär att man berättar högt hur personan tänker i varje steg. Övriga deltagare betraktar och kommenterar – t ex om det är något som man tycker verkar fel i beskrivning av hur personan skulle tänka i aktuell situation eller om det är något med gränssnittets presentation av funktionalitet eller flödet i funktionaliteten.

Reflektion

Steg 5.1 Reflektion resterande tid – i grupp

Syfte: Att individuellt och i grupp reflektera över vad teknikerna paper prototyping, personas och personas walk-through tillför ett utvecklingsprojekt och vad det har tillfört specifikt för din applikation.
Diskutera följande och anteckna det som gäller för din applikation (ska redovisas på sidan för slutuppgiften):

• Vilka förbättringar kan göras för att presentera funktionaliteten bättre för tänkt målgrupp
• Vilka förbättringar kan göras i applikationens funktioner (funktionsutbud)
• Vilka förbättringar kan göras i sättet applikationen presenterar sina funktioner
• Vilka förbättringar kan göras för att förbättra interaktionsflödet för applikationen
• Vilka andra lärdomar kan du dra från övningen med personas och paper prototyping som kan ge förbättringar för användarupplevelsen
• Hur kan du använda dig av presenterade tekniker fortsättningsvis i ditt projekt

Dokumentation/redovisning på sidan för slutuppgiften

Syfte: Att presentera produkterna från workshopen.
På sidan för slutuppgiften ska följande presenteras:

• Pappersprototypen
• Framtagna personas
• Sammanfattning (punktvis eller i löpande text) av dina reflektioner från den avslutande övningen i workshopen

Obs! Sammanfattningen ska finnas på kurssidan senast 1 vecka efter workshopen.

Särskilda instruktioner för distansstudenter

Workshop i Adobe Connect med break out groups

För distansstudenter så kommer denna övning att genomföras med hjälp av Adobe Connect. Vi kommer att använda oss av funktionen break-out groups för att dela in er i grupper (samma indelning i grupper används som för mjukvaruutvecklingskursen – och för er som inte läser den kursen parallellt så kommer ni att placeras i en grupp). Workshopen börjar i det här rummet:

connect.sunet.se/lnu1ik491_workshop/

Break out groups fungerar på det sättet att värden för mötet (läraren) fördelar in deltagarna i separata mötesrum. När det blir dags för de gruppvisa övningarna så kommer ni att fördelas i de olika grupperna av läraren. Meddelanden kan fortfarande skickas till läraren, men inte till de andra studenterna i sina egna grupper.

Ljud i Adobe Connect för gruppövningarna

Det finns stöd för ljud (audio) och video (webcam) i Adobe Connect. Video är frivilligt, men ni ska använda er av ljudkommunikation för att prata med varandra. Läraren kommer att gå mellan de olika rummen och hjälpa till, svara på frågor och delta i övningarna och för att det ska fungera behöver ni använda er av kommunikationsfunktionerna i Adobe Connect (i motsats t ex att använda er av Skype för ljudet). Om ni inte får ljudet att fungera så kan chatten användas, men det är bara i undantagsfall.

OBS! Aktivera inte ljudet förrän förrän ni har fördelats i break out groups.

Om alla aktiverar ljud (och video) innan fördelningen i break out groups så kan det bli onödigt segt och bli fördröjningar i ljudet. För att aktivera och ställa in mikrofonen (och andra ljudinställningar), använd Audio Setup Wizard… under Meeting-menyn. Headset rekommenderas för bästa ljud in och ut. Om du inte har tillgång till headset så rekommenderas du att stänga av din mikrofon när du inte pratar för att undvika ekon och missljud.

Uppladdning av dokument och Whiteboard-funktioner

I och med att ni kommer att jobba med egenskapade dokument som skapas under workshopen så behöver dessa laddas upp till mötesrummet i Adobe Connect. Detta gör man genom att använda delningsfunktionen – Sharing pod. För att ladda upp dokument till sharing-podden gör man så här:

1. Klicka på drop down-knappen i sharing-podden (den där det står Share My Screen)
2. Välj Share document
3. Ladda upp dokumentet

Man kan också klicka på snabbmenyn längst upp till höger i sharing-podden och sedan välja Share>Document för att komma uppladdningsfunktionen. Denna är enklare att använda när man ska växlar mellan dokument (när ni växlar mellan era olika dokument i gruppen). Genom att klicka på Draw-knappen i övre listen på sharing-podden så aktiverar man whiteboard-funktionerna som gör att man kan rita och skriva ovanpå bilden som laddas upp. Ni ska aktivera dessa funktioner och rekommenderas att använda dem aktivt för att kommentera varandras uppladdade filer och göra noteringar.

Typ av dokument som laddas upp

Ni kommer att skapa pappersprototyper och persona-beskrivningar. Dessa behöver delas ut till de andra i gruppen via sharing-podden. De behöver således laddas upp i sharing-podden i något lämpligt format. För personasbeskrivningen ska ni använda er av den mall som finns här på workshophandledningen. Den sparas lämpligtvis i PDF-format och kan sedan laddas upp i sharing-podden.

För pappersprototypen finns några olika alternativ. Grundtanken med paper prototyping är att man ska jobba snabbt och skissartat och det är svårt att få till det på annat sätt än att använda just penna och papper (när pappersprototypen ska digitaliseras och laddas upp så är det bra att använda lite mörkare färg och lite grövre stift än man annars skulle behöva göra). För att få in skissen i datorn så behöver digitaliseras. Har du en scanner kan du använda den. Annars fungerar det oftast bra med att ta ett fotografi – med digitalkamera eller med mobilen. Om du av någon anledning inte kan använda någon av de här möjligheterna så kan du rita direkt i Photoshop, Illustrator eller annat ritprogram. Rita då på frihand med musen. Det viktiga är inte att det blir snyggt utan att du får med det centrala i gränssnittet vad gäller struktur och funktion.

Tid för tekniskt strul

I och med att det är flera moment i hanteringen av break out groups, ljudinställningar och uppladdning av dokument som kan strula till det här i den här workshopen så kan det vara så att ni inte hinner ge lika mycket tid till varje moment som i de föreslagna tiderna. Prioritera i så fall övningen med Persona Walk-through som är den centrala övningen för workshopen. Det är dock viktigt att ni spara lite tid åt att reflektera över teknikerna och resultaten (förbättringsförslagen) från workshopen.

Alternativa grupprum fortsatt samarbete

Jag har skapat 10 stycken separata mötesrum i Adobe Connect som ni kan använda er av för fortsatt samarbete av liknande slag som i den här workshopen. Det är inte något kurskrav, men förhoppningsvis upptäcker ni nyttan med att använda teknikerna för att att diskutera i grupp kring era applikationer. Grupperna är namngivna på följande sätt: connect.sunet.se/lnu1ik491_workshop_grupp1, connect.sunet.se/lnu1ik491_workshop_grupp2 … connect.sunet.se/lnu1ik491_workshop_grupp10. Dessa ska alltså inte användas till dagens workshop, men kan användas för att arbeta vidare i sin grupp om man så önskar.

Instruktioner för dig som inte kunnat delta i den obligatoriska workshopen

Notera: Deltagande i workshop är obligatorisk och giltig anledning ska finnas för att inte delta. Ta kontakt med kursansvarig om du inte kan delta. Saknas giltig anledning kommer detta att påverka betygsbedömningen för slutuppgiften.

Instruktioner: För dig som inte kunnat vara med på workshopen så ska workshopen genomföras på egen hand. Du ska skapa de produkter som efterfrågas – pappersprototyp, personas och reflektioner och lägga ut dem på sidan för slutuppgiften. Du ska utöver detta också beskriva din Persona walk-through (steg 4) i textform, alltså skriva ned det som din persona tänker högt i varje steg i applikationen. Det ska vara en detaljerad genomgång motsvarande åtminstone en A4-sida text.