Bruk av mock-ups for brukertesting
Hvordan teste brukeropplevelsen av en app før man har utviklet den teknisk?
Lag en klikkbar mock-up (i Figma, Adobe XD eller på papir) for å teste brukeropplevelsen før dere skriver kode. Skisser de viktigste skjermene, test på 5–7 reelle brukere, og hold den enkel så de kommenterer funksjon, ikke farger.
Slik løser du det
Lag en mock-up i verktøy som Adobe XD. Dette skaper klikkbare bilder som simulerer appens funksjonalitet, noe som er effektivt for å teste brukeropplevelsen (UX) før koding starter. La oss utdype hvorfor dette er så lurt, og hvordan dere går frem. En mock-up er en visuell skisse av appens skjermer – hvordan knapper, menyer og innhold ser ut – uten at noe faktisk kode ligger bak. Når dere kobler skjermene sammen slik at man kan trykke seg fra side til side, kalles det gjerne en interaktiv prototype. Brukeren får da en illusjon av en ekte app, men dere har spart ukevis (eller månedsvis) med utviklingstid. UX (User Experience / brukeropplevelse) handler om hvordan det føles å bruke produktet: er det intuitivt, finner folk frem, blir de frustrerte? Dette er billigst å fikse FØR utviklerne har skrevet kode, fordi endringer i en skisse tar minutter, mens endringer i ferdig kode tar timer og penger. Adobe XD er ett verktøy for dette, men dere kan like gjerne bruke Figma (i dag det mest brukte, gratis for små team og samarbeidsvennlig i nettleser), Sketch eller endatil enkle papirskisser i tidligste fase. Poenget er det samme: lag klikkbare skjermer raskt. Konkret fremgangsmåte: (1) skisser de 3–5 viktigste skjermene som dekker hovedoppgaven brukeren skal gjøre, (2) koble dem sammen til en klikkbar flyt, (3) sett deg ned med 5–7 reelle målbrukere og be dem løse en konkret oppgave mens de tenker høyt, (4) observer hvor de nøler eller trykker feil – det er gull. En vanlig fallgruve er å gjøre mock-uppen for 'pen' og detaljert; da blir testpersoner høflige og kommenterer farger i stedet for funksjon. Hold den enkel, test tidlig, og gjenta. Spark* har folk som kan hjelpe med både verktøy og testopplegg.
Begreper forklart
- Mock-up
- En visuell skisse av appens skjermer uten kode bak, som viser hvordan knapper, menyer og innhold ser ut.
- Interaktiv prototype
- Skjermer som er koblet sammen så man kan trykke seg fra side til side og oppleve en illusjon av en ekte app.
- UX (brukeropplevelse)
- Hvordan det føles å bruke produktet – om det er intuitivt og folk finner frem uten å bli frustrerte.
- Figma
- Et mye brukt designverktøy for å lage klikkbare skjermer; gratis for små team og kjører i nettleseren.
- Adobe XD
- Et designverktøy for å lage klikkbare mock-ups og prototyper av apper og nettsider.
Trenger du hjelp med akkurat dette?
Er du student ved NTNU i Trondheim eller Ålesund? Da kan du få en gratis, personlig veileder fra Spark* som hjelper deg videre med nettopp din idé.
Ofte stilte spørsmål
Hvordan teste en app eller tjeneste før den er ferdig utviklet teknisk?
Wizard of Oz-metoden lar deg teste en app før den er bygd: brukeren møter et ekte-virkende grensesnitt, mens du manuelt utfører funksjonaliteten bak kulissene. Slik validerer du etterspørsel og opplevelse uten å programmere noe avansert.
Les hele svaret →Utvikler har en ferdig MVP (f.eks. Graidable), men mangler reelle brukere for å teste programvaren og få tilbakemeldinger.
Rekrutter ekte målbrukere som kjenner problemet, ikke venner og familie, og la dem teste MVP-en gratis mot ærlig tilbakemelding. Observer dem mens de bruker produktet, og still åpne spørsmål framfor ja/nei-spørsmål.
Les hele svaret →Store hoteller ønsker ikke å kjøpe eller teste produktet, og teamet føler de har satt seg fast.
Verifiser at problemet er stort nok og test betalingsvilje hos eksisterende kunder. Målrett mot hoteller med dårlige Tripadvisor-ratings, som har et synlig smertepunkt og er mer motiverte for å teste.
Les hele svaret →Har design av appen klart, men mangler teknisk implementering.
Hold en workshop for å spesifisere appen, lag klikkbare invisionskisser og rekrutter utviklere parallelt med å ferdigstille Business Model Canvas. En tydelig spesifikasjon og klikkbare skisser gjør det mye lettere å tiltrekke seg utviklere.
Les hele svaret →Hvordan markedsføre en app (f.eks. Barcoa) til studenter som har begrenset betalingsevne?
Utnytt at studenter er enkle å nå på campus og i sosiale kanaler, sett konkrete og tidsbestemte mål for nedlastinger, og bruk Pareto-prinsippet til å satse på de få kanalene som gir mest resultat per innsats.
Les hele svaret →Har du et annet spørsmål? Ta kontakt med oss.