Jacob, Linus, Vuk og Johannes
Figma: Prototype


1. Opgaven og målgruppen

Opgaven var at udvikle en klikbar prototype til en datingapp og derefter forbedre den gennem tre versioner. Vi skulle bruge brugertests til at finde problemer i designet og bruge feedbacken til at lave konkrete ændringer fra version til version.

Målgruppe

Vi valgte at fokusere på ældre mennesker over 70 år.

En vigtig del af målgruppen er, at appen skal være nem at forstå og navigere i. Derfor arbejdede vi med store knapper, tydelige overskrifter og få valg på hver skærm.

Vi ville samtidig gøre det nemt for brugeren at finde andre mennesker med fælles interesser. Appen skulle derfor ikke kun fungere som en klassisk datingapp, men også kunne bruges til at finde nye venskaber og sociale relationer.

Mål og succeskriterier

Målet med prototypen var, at brugeren skulle kunne:

  • Oprette en profil
  • Gennemføre onboarding
  • Tilføje personlige informationer og interesser
  • Se andre profiler
  • Vælge mellem Yes og No
  • Forstå navigationen uden hjælp

2. Idéudvikling og plan

Grundidé

Vores grundidé var at lave en app, der kunne hjælpe ældre mennesker med at finde andre med fælles interesser – både til dating og venskab.

Hvilket problem forsøger appen at løse?

Det kan blive sværere at møde nye mennesker, når man bliver ældre, især mennesker med de samme interesser. Vi ville derfor skabe en digital løsning, hvor det er nemmere at opdage nye mennesker og hurtigt få en idé om, hvem de er.

Planlagt brugerflow

Dette var vores første idé til brugerflowet. Vi forventede allerede fra starten, at flowet ville ændre sig undervejs, når vi begyndte at teste prototypen.

  1. Velkomst – Brugeren vælger Sign up eller Sign in.
  2. Opret konto / Log ind – Brugeren indtaster sit telefonnummer.
  3. Bekræft telefonnummer – Brugeren indtaster en 6-cifret kode.
  4. Om dig – Brugeren skriver navn og fødselsdato.
  5. Interesser – Brugeren vælger sine interesser.
  6. Opret profil – Brugeren tilføjer profilbilleder og en kort About me-tekst.
  7. Færdig onboarding – Brugeren kommer videre til appens hovedside.

3. Version 1

Hvad kunne brugeren gøre i version 1?

I den første version kunne brugeren gennemføre hele onboarding-flowet. Det indebar at oprette en konto, bekræfte telefonnummer, indtaste navn og fødselsdato, vælge interesser og tilføje profilbilleder.

Målet var at se, om den grundlæggende struktur gav mening, før vi begyndte at tilføje flere funktioner.

Designvalg i version 1

Vi valgte et simpelt design med:

  • Store knapper
  • Tydelige overskrifter
  • Få valgmuligheder på hver skærm
  • Blå som primær farve
  • En enkel og genkendelig datingapp-struktur

Vi var inspireret af den måde, som apps som Tinder gør selve valget mellem profiler meget simpelt. Samtidig forsøgte vi at gøre designet mere roligt og overskueligt, så det passede bedre til vores målgruppe.


4. Brugertest af version 1

Testopgave

Testpersonerne fik til opgave at gennemføre onboarding fra velkomstskærmen til en færdig profil uden hjælp fra os.

Hvordan gennemførte vi testen?

Vi observerede testpersonerne uden at hjælpe undervejs. Vi noterede, hvor de blev i tvivl eller havde svært ved at finde ud af, hvad de skulle gøre.

Efter testen spurgte vi ind til deres oplevelse og bad dem fortælle, hvad der var nemt, uklart eller kunne forbedres.

Testresultater

Onboarding var nem at finde rundt i, og de store knapper gjorde appen overskuelig.

Tilbageknappen var ikke tydelig nok og burde have teksten “Tilbage” frem for kun et ikon.

Det simple og Tinder-inspirerede design blev opfattet som roligt og overskueligt.

Der manglede en tydelig hjælp-knap undervejs.

Oprettelse af profil og valg af interesser fungerede godt.

Swipe-delen var lidt uklar og havde brug for tydeligere navigation.

Det var ikke helt tydeligt, hvad Yes og No betød.

Samlet resultat

Generelt forstod testpersonerne appens grundidé og kunne gennemføre onboarding. De største problemer var:

  • Uklar tilbageknap
  • Manglende hjælp undervejs
  • Uklar navigation på swipe-siden
  • Behov for mere information på profilen

Samtidig fik vi positiv feedback på det simple design og Tinder-inspirerede swipe-flow.


5. Fra version 1 til version 2

Brugertesten gav os nogle konkrete ting, som vi kunne arbejde videre med.

About me

Problem: Profilen manglede en personlig beskrivelse.

Ændring: Vi tilføjede et About me-felt.

Hvorfor: Det giver brugeren mulighed for at fortælle lidt mere om sig selv og giver andre brugere mere information end bare billeder og interesser.

Tilbageknap

Problem: Tilbagefunktionen var ikke tydelig nok.

Ændring: Vi gjorde tilbagefunktionen tydeligere og tilføjede teksten “Tilbage”.

Hvorfor: Vi ville undgå, at brugeren skulle gætte, hvad et ikon betød.

Hjælpefunktion

Problem: Flere testpersoner efterspurgte hjælp undervejs.

Ændring: Vi gjorde hjælpefunktionen mere synlig og placerede den på relevante sider.

Hvorfor: En fast og tydelig hjælpemulighed kan gøre appen mere tryg at bruge, især hvis brugeren bliver i tvivl om næste skridt.

Swipe-navigation

Problem: Det var ikke helt tydeligt, hvad Yes og No betød.

Ændring: Vi gjorde swipe-navigationen og valgmulighederne tydeligere.

Hvorfor: Brugeren skal hurtigt kunne forstå, hvilken handling de foretager, og hvad der sker bagefter.

Det, der allerede fungerede

Vi fik positiv feedback på det simple, Apple-inspirerede design og Tinder-stilen. Derfor valgte vi ikke at ændre hele det visuelle udtryk, men i stedet fokusere på de konkrete problemer, som brugertesten havde vist.

Den vigtigste forskel fra version 1 til version 2

Den største forskel var, at version 2 havde mere fokus på guidance og navigation. Vi tilføjede blandt andet en tydeligere hjælpefunktion, forbedrede navigationen og tilføjede funktionalitet, som manglede i version 1.


6. Test og vurdering af version 2

I anden test fokuserede vi især på, om navigationen var blevet tydeligere, om brugerne kunne finde de vigtigste funktioner, og om der stadig manglede hjælp undervejs.

Testperson 1

Testpersonen savnede en fast hjælpefunktion, som altid var tilgængelig.

Forslag: Tilføj en tydelig hjælp-knap på alle relevante sider.

Testperson 2

Testpersonen savnede en navbar i bunden.

Forslag: Tilføj en fast navbar, så det bliver nemmere at skifte mellem eksempelvis profil, swipe og beskeder.

Testperson 3

Navigationen var blevet bedre end i version 1, men der var stadig steder, hvor det ikke var helt tydeligt, hvad man kunne trykke på. Der manglede også enkelte funktioner.

Forslag: Gør de vigtigste funktioner mere synlige og tilføj den manglende funktionalitet.

Samlet resultat

Version 2 løste nogle af problemerne fra den første test, men testen viste også, at vi stadig kunne forbedre navigationen.

De vigtigste punkter til version 3 blev derfor:

  • Fast hjælpefunktion
  • Navbar i bunden
  • Tydeligere navigation
  • Mere synlig funktionalitet
  • Færdiggørelse af de manglende funktioner

Hvad fungerede bedre end i version 1?

Navigationen var generelt nemmere at forstå, og flere af de problemer, vi havde fundet i første test, var blevet løst. Især den tydeligere tilbagefunktion og forbedrede swipe-navigation gjorde flowet mere overskueligt.

Hvilke problemer var stadig ikke løst?

Der manglede stadig en mere permanent måde at navigere rundt i appen på. Testen viste også, at hjælpefunktionen skulle være endnu mere tilgængelig, og at nogle funktioner stadig ikke var tydelige nok.


7. Version 3 – det endelige resultat

I version 3 fokuserede vi på at samle erfaringerne fra de to første tests og gøre appen mere komplet.

Sidste ændringer

Vi:

  • Tilføjede en fast navbar
  • Gjorde hjælpefunktionen mere tilgængelig
  • Forbedrede navigationen
  • Gjorde de vigtigste funktioner mere synlige
  • Tilføjede manglende funktionalitet
  • Bevarede det simple visuelle udtryk fra de tidligere versioner

Hvordan opfylder den endelige løsning målgruppens behov?

Den endelige løsning er bygget med fokus på, at ældre brugere skal kunne forstå appen uden at skulle lære en masse nye funktioner på én gang.

Store knapper, tydelig tekst og en mere fast navigation gør det nemmere at finde rundt. Samtidig gør hjælpefunktionen det muligt at få hjælp, hvis brugeren bliver i tvivl.

Appen gør også fælles interesser mere synlige, så brugeren hurtigt kan få en idé om, hvad de har tilfælles med andre.

Hvilken del af løsningen fungerer bedst?

Jeg synes, at profil- og swipe-delen fungerer bedst, fordi den samler de vigtigste informationer om personen på en enkel måde. Brugeren kan hurtigt se billede, interesser og information om personen og derefter tage stilling til, om de er interesserede.


8. Min refleksion

Hvad lærte jeg om prototyping og iteration?

Jeg lærte, at det er en stor fordel at tænke over, hvordan man bygger sin prototype i Figma, allerede fra starten.

For eksempel fandt vi ud af, hvor meget Auto Layout kan gøre arbejdet nemmere, når elementer skal ændres eller flyttes. Hvis strukturen er sat rigtigt op fra starten, er det meget lettere at arbejde videre med designet senere.

Jeg lærte også, hvor vigtigt det er at arbejde iterativt. Feedbacken gjorde det tydeligt, at der var ting, vi selv ikke havde tænkt over, fx behovet for en mere synlig hjælpefunktion.

Hvad lærte jeg af at teste på rigtige brugere?

Det blev meget tydeligt, at man har en form for bias over for det, man selv har lavet. Når man selv har arbejdet med et design i lang tid, kan ting føles meget mere logiske, end de faktisk er for en ny bruger.

Friske øjne kan derfor hurtigt opdage problemer, som man selv er blevet blind overfor. Brugertesten viste især, at små ting som ikoner, navigation og hjælp kan have stor betydning for brugeroplevelsen.

Hvad bidrog jeg selv med i gruppen?

Linus bidrog blandt andet med guidance og hjælp til Figma, sparring omkring designet og erfaringer fra app-udvikling.

Hvad vil jeg gøre anderledes i mit næste projekt?

I et kommende projekt vil jeg gerne teste tidligere og mere løbende.

I stedet for at bygge en stor del af appen og derefter lave én større test, kunne vi opdele appen i mindre sektioner og teste dem undervejs. På den måde kan man finde problemer tidligere i processen.

Jeg vil også bruge mere tid på at lave style tiles i starten og være mere præcis omkring, hvem i gruppen der har ansvar for hvilke dele.

Hvad tager jeg med videre fra workshoppen?

Jeg tager især med mig, at feedback er enormt vigtigt – specielt i de tidlige faser af et projekt. Det er svært selv at opdage alle problemerne i et design, fordi man hurtigt bliver vant til sin egen løsning.

Jeg tager også Auto Layout med videre som et vigtigt Figma-værktøj. Derudover vil jeg gerne blive bedre til at bruge Components, da det kan gøre designsystemer og ændringer meget nemmere at håndtere.


Kort afsluttende opsummering

Vi udviklede en datingapp til ældre over 70 år og arbejdede os gennem tre versioner ved hjælp af brugertests. Efter hver test brugte vi feedbacken til at finde konkrete problemer og forbedre prototypen. Vi arbejdede blandt andet med navigation, hjælp, swipe-funktionalitet og profilinformation.

For mig viste processen især, hvor vigtigt det er at få andre til at teste ens design. Man kan hurtigt blive blind over for problemer i noget, man selv har arbejdet meget med. Jeg lærte også, hvor stor en fordel det er at strukturere sit Figma-projekt rigtigt fra starten med blandt andet Auto Layout. Fremover vil jeg teste tidligere og arbejde mere løbende med feedback.


Leave a Reply

Your email address will not be published. Required fields are marked *