Prototype workshop

28/09/23

Til denne workshop blev vi delt i grupper af ca. 4 personer, hvorefter vi skulle designe 3 prototyper til en “dating” app og samtidig brugerteste prototyperne. Vi kunne vælge mellem følgende målgrupper:

  1. Børn 
  2. Hunde
  3. Unge mennesker (18-25)
  4. Ældre mennesker (70+)

Brainstorm

Min gruppe og jeg startede med at diskutere og brainstorme idéer til dating apps rettet mod de forskellige målgrupper. Først snakkede vi om at designe en app til hunde. Her snakkede vi om at man bl.a. kunne lave en hunde-parring app eller en app for hundeejere der søger en hundepasser. Derefter prøvede vi også at brainstorme idéer til en app for unge mennesker (18-25), hvor vi først fik idéen til at lave en blind-dating app, altså en app hvor man matcher baseret på interesser og derefter skal skrive sammen før man kan se billeder af hinanden. Til sidst fandt vi frem til idéen om at lave en app for unge mennesker der føler sig ensomme og gerne vil finde en gruppe af andre unge mennesker som de kan dyrke deres interesser og hobbyer med. Denne idé blev vi ret glade for, så den valgte vi at udvikle videre på.

Moodboard

Efter vi havde brainstormet, gik vi igang med at lave et moodboard i Adobe XD (vi brugte Adobe XD til hele projektet. Vi besluttede fra starten af at vi gerne ville bruge en grøn farve som gennemgående tema i appen. Vi valgte at gå efter mere “støvede” og blålige grønne, for ikke at give en følelse af bæredygtighed og/eller miljøvenlighed, da det ikke var vores fokus med appen. Vi valgte også de her farver, fordi de virker rolige og afslappende, hvilket vi gerne ville udtrykke, da appen handler om at finde nye venner og fællesskaber uden nogen romantisk hensigt.

Style tile

Det var her vi fandt frem til at kalde vores app “Hyg”, da den alligevel er baseret i Danmark. Til logoet brugte vi fonten Brush Script MT, da vi syntes den passede til den stemning og følelse vi gik efter. Til alt andet tekst på appen valgte vi at bruge fonten avenir, da den er letlæselig og fungerer godt til både header, overskrifter og brødtekst. På den måde behøvede vi ikke at bruge flere forskellige fonte, hvilket kan give appen et rodet udseende. Vi fandt frem til de farver vi primært ville bruge på appen, dog endte vi med senere hen at udskifte nogle af farverne med sort og hvid. Til knapperne valgte vi at bruge den mørkegrønne farve til de primære knapper (de knapper vi gerne vil have brugeren skal trykke på) og en mere lys og støvet grøn til de sekundære knapper.

Lo-fi wireframe

før vi startede på den første prototype lavede vi en hurtig lo-fi wireframe i XD, for at få en generel idé om layoutet på hver side. Vi endte dog med at tilføje flere sider til appen undervejs i projektet.

Når man åbner appen
Opret en profil

Login
Forside

Udforsk
Beskeder

Profil

Prototype nr. 1 og første brugertest

Efter vi havde lavet vores wireframe og vi havde fået et bedre overblik over hvilke sider vi skulle designe, gik vi igang med at lave den første prototype i XD.

Første prototype:

Den første prototype blev meget low-fidelity, i sort og hvid. Vi havde dog sat nogle ikoner ind i det der skulle forestille menu-baren på appen, så vi på den måde kunne teste om ikonerne gav mening for brugeren. Derudover tilføjede vi en “indstillinger”- side. Fordi det er en lo-fi prototype, valgte vi til den første brugertest, at vi ville teste appens interaktion og funktion. Vi besluttede at køre en think aloud test, specifikt en concurrent probing test, så vi kunne teste specifikke funktioner på appen.

Scenarier til brugertest:

  • Du har allerede en profil på appen, men du har skiftet postnummer. Find siden “indstillinger” så du kan ændre dit postnummer. 
  • Du er blevet meget interreseret i at hækle for tiden og vil gerne finde et hækle-fællesskab på appen.
  • Du vil gerne oprette dit eget fællesskab.

Vi nåede at teste på i alt 4 personer, hvoraf vi fik taget disse noter i mens:

Vi fandt frem til at de største ting vi skulle ændre ift. appens funktion og interaktion, var placeringen af profil-knappen. I den første prototype placerede vi den oppe i højre hjørne. Det skabte forvirring for mange af testpersonerne da alt andet information lå i bunden, altså på menubaren. Derudover kom vi også frem til at vi skulle ændre ikonet til “udforsk siden”, da nogen af testpersonerne ikke syntes at et kompas-ikon kommunikerede “udforsk”. Noget der allerede fungerede godt var plus-ikonet til “opret nyt fællesskab”- siden. Testpersonerne forstod med det samme hvad det betød.

Prototype nr. 2 og anden brugertest

Anden prototype: https://xd.adobe.com/view/c26e2a2c-4cf9-484f-89cb-97fd56e24a2c-973d/screen/efcbec4a-c980-498a-85d1-bcf8789fa1bd?fullscreen&hints=off

Efter første brugertest, tog vi den feedback vi havde fået med os, og begyndte at lave den anden prototype. Her tilføjede vi farver, logo, billeder og copywriting. Derudover flyttede vi knappen til profil-siden ned i menu-baren, der hvor knappen til “opret nyt fællesskab”-siden før havde været (som var et plus-ikon). Så satte vi i stedet en knap ind på “opdag”-siden, som man skulle trykke på for at lave et nyt fællesskab. Vi ændrede også ikonet til “opdag”-siden, fra at være et kompas, til at være 3 personer. Det syntes vi gav mere mening, da “opdag”-siden er der for at brugeren kan finde fællesskaber. Til den anden brugertest, besluttede vi at køre en desirability test, da vi gerne ville teste appens udseende. Vi begyndte at lave et spørgeskema på google forms, hvor vi lagde et link ind til prototype nr. 2, så folk kunne prøve den. Derefter skrev vi en masse adjektiver ind på spørgeskemaet som fx: kedelig, rodet, tillidsfuld, frisk, hyggelig etc. Testpersonerne skulle så vælge op til 5 ord, som de forbandt med udseendet af appen. I bunden af spørgeskemaet var der så mulighed for at testpersonerne kunne uddybe deres valg af ord. Vi sendte spørgeskemaet ud til vores klassekamerater og fik 13 svar.

Testresultater:

Ud fra resultaterne kunne vi se at folk generelt havde en positiv response til appen. De fleste syntes at appen var rolig og hyggelig, hvilket også var det vi gik efter. Men der var selvfølgelig stadig ting der kunne forbedres. I de kommentarer vi fik, blev der bl.a. nævnt at der ikke var nok kontrast mellem de farverne, hvilket kunne være en udfordring for farveblinde, plus at appen virkede uprofessionel fordi alt kun var grønt. Der blev også nævnt at nogle af funktionerne var alt for store og fyldte for meget.

Prototype nr. 3

Tredje prototype: https://xd.adobe.com/view/1af195ee-1bd8-4a6c-a4d2-b85d04db8115-4fa2/?fbclid=IwAR0FUuwo6Ryj3aNl2g54cpiaYeqXY_aEfpOJwY29Ey5AIOZ3rd21iI2kmKU&fullscreen

Med det feedback vi havde fået fra vores desirability test, gik vi i gang med at lave den endelige prototype. Vi lavede nogle ret store ændringer. Vi tilføjede to ekstra sider; en eksempelside på et fællesskab (camping) og en eksempelside på en anden brugers profil (Mikkel Lundsgaard). Vi fjernede den store knap på “fællesskaber”-siden og ændrede den til et simpelt plus-ikon (ligesom i prototype nr. 1) og placerede det oppe i højre hjørne på siden. Vi fjernede også den store “find dit fællesskab her”- knap på forsiden, da vi mente den var unødvendig og fyldte for meget. Vi droppede også velkomst-teksten på forsiden, da det ikke giver mening at den er der permanent, især ikke hvis brugeren har haft og brugt appen i en længere periode. Vi ændrede også farverne på appen, så den blev mindre grøn. Her tilføjede vi bare mere sort og hvid, så appen stadig har det grønne tema, men kontrasten mellem farverne er tydligere. Vi undgik at bruge bold tekst der hvor det ikke gav mening, så typografien ikke virkede alt for rodet. Til sidste lavede vi noget finpudsning på prototypen, inden vi kom frem til det endelige resultat.

Refleksion

Selve opgaven var både sjov og udfordrende, men vi havde en god dynamik i gruppen og vi var gode til at hjælpe hinanden og fordele opgaverne. Noget vi kunne have gjort bedre var at planlægge layoutet bedre fra starten (da vi lavede wireframe) ift. hvilke sider der skulle med i prototypen. Det havde gjort processen mere overskuelig og organiseret, frem for at vi tilføjede flere sider undervejs. Vi burde også have planlagt appens funktioner bedre, for da vi nåede til den sidste prototype, var der lidt usikkerhed omkring funktionerne af “hjem”- og “fælleskaber”-siden. Men taget i betragtning af den korte tid vi fik til opgaven og den lidt dårlige planlægning fra vores side af, var vi alle meget tilfredse med slutresultatet.

Skriv kommentar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *