Prototyping Workshop

En dating app for UCL studerende

Dagens workshop handlede om prototyping. Vi blev inddelt i nogle grupper, hvor vi efterfølgende skulle vælge en målgruppe for vores dating app. Vores gruppe valgte at fokusere på unge mennesker, men vi ønskede stadig at lave noget, der ikke var som andre dating apps. Vi kom op med idéen om at lave en app kun for UCL studerende rundt i hele Danmark. Det kunne være en sjov måde at kende hinanden på, lære mere om andre studerende og måske endda finde sin soulmate.

Vi startede med at søge efter design idéer på Google, og kiggede på designet af andre dating apps. Vi udforskede også UCL’s hjemmeside, og kiggede på, hvordan de brugte design og farver. Dette gav os inspiration til at lave noget der macthede skolens hjemmeside, så det var tydeligt at appen er rettet hen imod UCL studerende. Vi begyndte at lave nogle low-fidelity prototyper, og valgte at tegne vores wireframes i hånden. Dette gav et billede af, hvordan vores frames skulle se ud, og hvordan vi kunne design de forskellige funktioner i appen. På billederne nedenfor kan du se vores wireframes eller prøv at klikke på knappen “se prototype” 😁.

Da vi var blev færdige med at tegne vores wireframes, præsenterede vi kort vores idéer til hinanden, og derefter arbejdede på at finde en fælles tråd gennem det hele.

Ud fra vores wireframes, begyndte vi at udvikle vores prototype i Figma, hvor vi legede med logo, layout og farver. For at skabe en genkendelig udtryk, brugte vi de samme farver fra UCL’s hjemmeside. På den måde ville vores design matche skolens identitet. Valget af disse farver havde også den fordel, at appen virkede mindre iøjefaldende – I forhold til hvis studerende nu ønskede at bruge appen mere privat i det offentlige rum, ville den ikke skille sig ud på samme måde. Derudover valgte vi også at tilføje et lille hjerte ved siden af logoet, som symbolisere appens datingaspekt.

Jeg kunne godt fornemme, at det måske ikke var så smart at begynde på prototypen i Figma inden vi helt havde gennemtænkt vores wireframes, og alle de sider appen skulle have. Dette indså vi, da vi opdagede nogle manglende sider i appen, hvilket vi efterfølgende tilføjede og designede. I så fald ville vores prototyper have været mere forberedte til brugertestene, som vi skulle lave senere i processen.

Da vores prototype var færdig, lavede vi første brugertest på Ingrid fra vores hold. Hun startede testen med at lave en profil, men fandt de mange interessefelter overvældende, og var usikker på, hvordan match-funktionen fungerede, og hvor matches ville blive vist. Positivt fandt hun hurtig ud af, hvordan man redigerede sin egen profil, hun kunne lide burger menuen og generelt synes godt om alt det visuelle og konceptet bag appen.

Efter første brugertest, arbejdede vi videre i Figma, og gennemgik siderne i appen. Vi tilføjede billeder til vores frames, så vores prototype lignede en rigtig app. Denne gang var det okay bruge billeder fra internette sagde vores underviser, da denne workshop var mere en øvelse i at lære Figma at kende. Vi udviklede også chatboxen, så det lignede at en bruger var logget ind og chattede med en anden person. Til sidst gjorde vi også prototypen klikbart, så der nu kunne navigeres rundt i de forskellige sider i appen.

Efter vi lavede prototype 3 færdig, valgte vi at lave sidste brugertest på vores underviser Freja. Hun kunne godt lide vores idé og synes, at vi havde gjort os nogle gode overvejelser. Vi fik også noget feedback som forvirring om hvad hjerte knappen i bunden ville følge videre til. For at gøre vores navigation mere brugervenlig, kunne vi erstatte hjerte ikonet med en kryds og en hjerte kombineret med en swipe ikon i midten, som også ligner det der allerede er på denne side. Dette ville i hvertfald gøre det tydeligere for brugeren, at knappen fører videre til swiping siden, hvor brugere kan finde sin match. Dette viste os, hvor vigtigt det var, at gøre navigations funktionerne tydeligt og forståeligt, da nogle ikoner kan hurtig skabe forvirring.

Reflektioner

Gennem denne workshop lærte jeg virkelig Figma at kende, og flere forskellige funktioner fik jeg styr på. Dette var jeg glad for, da jeg var sikker på at vi skulle bruge Figma igen i kommende projekter. Dog tog det lidt tid at lære programmet at kende, men til næste gang vil vi kunne hurtigere på det vi skal, og udnytte mere af vores tid. Som gruppe, havde vi alle ekstra fokus på målgruppen, og prøvede at indtænke dem i hver en proces. Vi designede ikke kun en app som matchede skolens visuelle identitet, men også inddragede interesser og behov for de unge. For eksempel valgte vi et simpel design, så brugere kan tilgå appen mere trygt og privat. En anden vigtig prioritering for os var også genkendelighed. Vi ville sikre os at appen havde en sammehængende design gennem alle sider, som både skaber genkendelighed og identitet.

Det sidste som jeg personligt lærte gennem denne workshop er, hvor vigtigt det er at lytte til alle idéer i gruppen. Vi alle er vores egen person med forskellige perspektiver. Nogle gange kan det være lidt svært at blive enige om tingene, men til sidst finder man ud af det. Denne uenighed kan hjælpe os med at finde på stærkere idéer og forbedre processen. Det er vigtigt at huske, at vi har brug for hinanden stærke kompetencer, og at vi tilsammen kan skabe noget større.