Blog
23. apr. 2025 - 8 MIN. LÆSETID
Fra mockup til marked: Min end-to-end produktdesignproces

Fra mockup til marked: Min end-to-end produktdesignproces

En detaljeret gennemgang af min iterative designmetode, fra indledende research til endelig overlevering, med praktiske tips til designere på alle stadier.

Jay Ho Oh

Jay Ho Oh

Succesfulde digitale produkter kræver ikke en rigid formel – men en fleksibel ramme, der tilpasser sig til de unikke udfordringer i hvert projekt. Efter at have raffineret min tilgang gennem snesevis af produkter har jeg udviklet en proces, der konsekvent leverer resultater, samtidig med at den giver plads til kreativitet og iteration.

I denne artikel vil jeg gennemgå min ende-til-ende designproces, fra den første opdagelse til overlevering til udviklerne, ved hjælp af mit seneste arbejde på EcoTrack-applikationen som case study.

Fase 1: Opdagelse & research

Enhver stor produkt starter med at forstå det problem, det prøver at løse. For EcoTrack var vores udfordring at skabe en engagerende måde for brugerne at følge deres miljømæssige indvirkning på uden at føle sig overbelastet af skyld eller komplekse data.

Brugerinterviews

Jeg begyndte med at gennemføre interviews med 12 potentielle brugere på tværs af forskellige demografier, med fokus på deres nuværende vaner og holdninger til bæredygtighed. Disse samtaler afslørede en afgørende indsigt: de fleste mennesker ønskede at træffe miljøvenlige valg, men følte sig lammet af kompleksiteten i at beregne deres indvirkning.

"Jeg bekymrer mig om miljøet, men jeg har ingen idé om, hvorvidt brug af en papirpose faktisk er bedre end plastik, eller om min genanvendelige vandflaske gør nogen forskel." — Interviewdeltager

Konkurrentanalyse

Derefter analyserede jeg eksisterende bæredygtighedsapps og oprettede en funktions sammenligningsmatrix for at identificere huller og muligheder. De fleste konkurrenter fokuserede på beregninger af kulstofaftryk, men kunne ikke levere handlingsrettede vejledninger eller positiv forstærkning.

Definition af succes

Før jeg åbnede Figma, samarbejdede jeg med interessenter for at definere klare succesmål:

  • Øg den daglige aktive brug med 40%
  • Forbedre brugernes selvrapporterede forståelse af miljøpåvirkning
  • Skabe målbare adfærdsændringer i mindst to bæredygtighedskategorier

Fase 2: Idégenerering & konceptualisering

Med en solid forståelse af problemområdet gik jeg videre til den kreative fase af processen.

Skitsering

Jeg starter altid med pen og papir og udforsker hurtigt forskellige tilgange uden begrænsningerne af digitale værktøjer. For EcoTrack fyldte jeg tre skitsebøger med koncepter, lige fra gamificerede oplevelser til data-tunge dashboards.

Informationsarkitektur

Baseret på forskningsindsigt udviklede jeg en brugercentreret informationsarkitektur, der prioriterede enkelhed og handlingsrettede informationer:

  1. Kontrolpanel — Personlig oversigt med indsigt i øjeblikkelig effekt
  2. Daglig tracker — Enkel logning af aktiviteter med øjeblikkelig feedback
  3. Effektrejse — Visualisering af fremskridt over tid
  4. Action Center — Tilpassede anbefalinger baseret på brugeradfærd

Designprincipper

Jeg fastlagde fire centrale designprincipper til at guide alle beslutninger:

  • Forenkl kompleksitet — Oversæt miljøpåvirkning til forståelige enheder
  • Fejr fremskridt — Fokus på positiv forstærkning frem for skyldfølelse
  • Muliggør informerede valg — Skab kontekst for beslutningstagning
  • Design til vanedannelse — Skab tilfredsstillende interaktionsloops

Fase 3: Prototyping & test

Med den konceptuelle ramme på plads gik jeg videre til den iterative cyklus af prototyping og testning.

Low-Fidelity Wireframes

Jeg oprettede wireframes med fokus på brugervenlighed og informationshierarki og holdt bevidst det visuelle design minimalt for at fokusere feedback på funktionalitet og struktur.

Brugertest (Runde 1)

Test af wireframes med 8 deltagere afslørede flere vigtige indsigter:

  • Brugere ønskede mere øjeblikkelig feedback, når de loggede aktiviteter
  • Visualiseringen af indvirkning var ikke intuitiv for de fleste brugere
  • Folk blev forvirrede over teknisk miljøterminologi

Mid-Fidelity prototyper

Baseret på testfeedback raffinerede jeg konceptet og udviklede interaktive prototyper med mere visuel detaljegrad, fokuserende på:

  • Forenklet datavisualisering ved hjælp af velkendte metaforer
  • Øjeblikkelig positiv forstærkning for loggede aktiviteter
  • Progressiv afsløring af mere kompleks miljøinformation

Brugertest (Runde 2)

En anden testrunde viste betydelige forbedringer i brugervenlighed, men fremhævede nye udfordringer:

  • Brugere ønskede at sammenligne deres indvirkning med venner eller gennemsnittet i fællesskabet
  • Ugentlige opsummeringer var mere motiverende end daglig statistik
  • Onboarding-processen føltes for lang

Fase 4: Visuelt design & finpudsning

Da kerneoplevelsen var valideret, gik jeg videre til visuelt design i high-fidelity.

Visuelt sprog

Jeg udviklede et visuelt sprog, der balancerede tilgængelighed med troværdighed:

  • En naturinspireret farvepalette med klar funktionel farvekodning
  • Specialdesignet ikonografi, der forenklede komplekse koncepter
  • Typografi, der prioriterede læsbarhed på tværs af enheder
  • Mikro-interaktioner, der gav tilfredsstillelse og forstærkning

Designsystem

For at sikre konsistens og lette udviklingen skabte jeg et omfattende designsystem, herunder:

  • Komponentbibliotek med dokumenterede tilstande og adfærd
  • Retningslinjer for responsivt layout
  • Animationsspecifikationer
  • Standarder for tilgængelighed

Endelig prototype

Den endelige prototype samlede alle elementer sammen i en sammenhængende oplevelse, som vi testede med en bredere brugerggruppe, før vi gik videre til udvikling.

Fase 5: Implementering & iteration

Designprocessen slutter ikke, når udviklingen begynder – den udvikler sig.

Udviklersamarbejde

Jeg arbejdede tæt sammen med udviklerne under implementeringen og deltog i kodegennemgang og justerede designene for at imødekomme tekniske begrænsninger, samtidig med at jeg bevarede den grundlæggende oplevelse.

Implementering af analyse

Vi integrerede analyser for at følge vores succesmålinger og satte dashboards op for at overvåge nøgleinteraktioner og brugerveje.

Iteration efter lancering

Efter lanceringen etablerede vi en fast cyklus for analyse og iteration:

  • Ugentlig gennemgang af brugerfeedback og adfærdsdata
  • Design-sprints hver anden uge for at løse opståede problemer
  • Månedlig funktionsplanlægning baseret på brugsmønstre

Resultater og læring

Seks måneder efter lanceringen har EcoTrack overgået vores oprindelige succesmål:

  • 52% stigning i daglig aktiv brug
  • 78% af brugerne rapporterer en bedre forståelse af deres miljøpåvirkning
  • Den gennemsnitlige bruger har indtaget 3,4 nye bæredygtige vaner

Den mest værdifulde læring fra dette projekt var vigtigheden af at gøre abstrakte begreber håndgribelige. Ved at oversætte komplekse miljødata til personlige, handlingsrettede indsigt skabte vi en oplevelse, der ikke kun uddannede brugerne, men også gav dem mulighed for at foretage meningsfulde ændringer.

Konklusion

Effektiv produktdesign er aldrig en lineær rejse – det er en kontinuerlig cyklus af læring og raffinering. Ved at holde fokus på brugernes behov og samtidig opretholde en fleksibel tilgang til problemløsning kan vi skabe produkter, der ikke kun opfylder forretningsmål, men også virkelig forbedrer folks liv.

Jeg ville ønske at høre om din egen designproces og hvordan du håndterer lignende udfordringer. Du er velkommen til at kontakte mig med spørgsmål eller dele dine erfaringer i kommentarerne nedenfor.

Bygget med Nuxt UI • © 2026