Produktdesignets 7 dødssynder (og sådan undgår du dem)

Discover how to lead product teams and build better products. Create a Free Account

Disse fejl inden for design af brugeroplevelser er så uhyrlige, at de burde være ulovlige. Her får du at vide, hvordan du ikke skal designe et produkt, samt eksperttips til, hvad du bør gøre i stedet.

7 deadly sins of product design and how to avoid them standard editorial post 26306

På dette tidspunkt i vores tidslinje er der absolut ingen undskyldning for dårligt produktdesign. I den evigt konkurrenceprægede verden af softwareprodukter er det ikke til forhandling at få styr på dit UI- og UX-design. Selv hvis du har fantastisk teknologi, der er i stand til at løse dine brugeres problemer, vil dårlig UX få brugerne til at flygte fra dit produkt – enten fordi de ikke kunne finde ud af, hvordan de skulle bruge det, eller helt ærligt fordi de hader det.

Gør dig klar; jeg er ved at levere lidt "hård kærlighed" om, hvordan man ikke skal arbejde med UX, ved at gennemgå produktdesignets syv dødssynder og afsløre nogle af de værste eksempler.

Synd #1: “Juletræet”

Et af mine mest behagelige barndomsminder er, da min søster og jeg pyntede juletræet. Så snart vi var færdige, betragtede vi det med ærefrygt, fordi det for os var noget helt fantastisk smukt. I hvert fald var det sådan, vi så det. Hvordan så det ud i virkeligheden? Noget i denne retning.

billede af juletræ
Kredit: Pamela Graves

Jeg går ud fra, at du ved, hvor jeg vil hen med dette. I modsætning til juletræet, som du virkelig gerne vil have, at dine børn pynter, præcis som de har lyst til, bør dit UI og din UX ikke ligne et kæmpe rod af elementer og farver, der er spredt ud over det hele.

Lad os nu se på et produkt fra den virkelige verden, der ligner et “juletræ”.

skærmbillede af produkt fra den virkelige verden, der ligner et juletræ

Se bare på dette et øjeblik, og prøv at forklare mig, hvad dette produkt handler om. Jeg er sikker på, at du også farede vild i brugergrænsefladen og ikke kunne finde ud af det i et stykke tid. Der sker simpelthen for meget på denne skærm; det er nærmest umuligt at forstå, hvor du er, og hvad du bør gøre.

De problemer, jeg ser med denne grænseflade, omfatter:

  • Overdreven brug af farver: Farver er et stærkt værktøj i hænderne på dygtige produktdesignere, da de kan lede brugerne i den rigtige retning. Men hvis du har for mange farver i dit UI, svækker det denne styrke, og hvert farvet element begynder at konkurrere om opmærksomheden.
  • For mange CTA'er: Hvad er det vigtigste, jeg skal klikke på nu? Helt ærligt, det aner jeg ikke – der er knapper overalt.
  • Forvirrende layout: Skærmen er altså grundlæggende opdelt i tre kolonner, hvor den midterste har to faner, og der er også en stor tidslinjesektion i bunden. Designerne har forsøgt at presse så mange ting som muligt ind på én skærm.

Gør dette i stedet

Dette er et eksempel på et forsøg på at arbejde med UX ved at skabe en form for orden ud af en enorm mængde information. Tænk i stedet på din UX som et kort over den adfærd, du ønsker fra dine brugere. Det er produktdesign 101, at farver, CTA'er og layout bør arbejde sammen for at lede brugeren til at tage de rigtige næste skridt.

Synd #2: Dårligt visuelt hierarki

Visuelt hierarki henviser til placeringen af elementer i dit UI på en måde, der tydeligt formidler det hierarkiske forhold mellem dem.

Den artikel, du læser nu, har for eksempel et tydeligt visuelt hierarki, eftersom titlen står med stor skrift øverst, underoverskrifterne er skrevet med mindre skrift end titlen, men er langt federe end brødteksten, og så videre.

I begge tilfælde fremhæver vi titlerne ved enten at gøre dem større eller federe – hvilket tydeligt viser, at afsnittene handler om de emner, der står i hver tilsvarende underoverskrift.

Visuelt hierarki er en god måde at organisere dit UI på og gøre det nemt at navigere. Fraværet af det er til gengæld en god måde at få dine brugere til at kæmpe med at finde rundt i din grænseflade.

En af de mest fremtrædende fejl inden for visuelt hierarki, som irriterer mig dagligt, er svarsektionen på Quora.

skærmbillede af Quora
Kilde: Quora

For at opfordre folk til at gennemse andre spørgsmål og blive længere på deres websted har Quora også inkluderet spørgsmål og svar, der er relateret til det spørgsmål, du gennemser i øjeblikket.

Det har jeg ikke noget imod. Det er en eksisterende brugeradfærd, og Quora har fundet en naturlig måde at drage fordel af den på.

Det, jeg derimod har noget imod, er den måde, de har designet disse relaterede spørgsmål og svar på. De ser næsten identiske ud med de rigtige svar på siden og mangler et visuelt hierarki. Se på skærmbilledet ovenfor, og fortæl mig, hvilket der er et svar, og hvilket der er et relateret spørgsmål. Du er virkelig nødt til at læse langsomt for at opdage forskellen.

Get Free Access to the Product Vault
We’ve collected the goods — AI prompts, exclusive deals, and a library of resources for product leaders. Unlock your account for access.
Get Free Access

Have an account? Log In

Gør dette i stedet

Ideelt set burde de relaterede spørgsmål være mindre fremtrædende i brugergrænsefladen og ligge under hovedsvarene med hensyn til deres visuelle hierarki (f.eks. have en grålig baggrund i stedet for en hvid).

Synd #3: En brugergrænseflade direkte fra 00'erne

Jeg ved det, jeg ved det, Craigslist har en frygteligt forældet brugergrænseflade, og den fungerer stadig helt fint. Men det er en undtagelse fra reglen, og du bør ikke tro, at det stadig er helt i orden at have noget lignende i 2023.

Problemet er, at dit produkt i modsætning til Craigslist ikke bliver superpopulært og ikke har et universelt genkendeligt brand. Hvis folk derfor ser noget forældet, når de besøger dit websted eller bruger din applikation, vil de ganske enkelt ikke tage dig seriøst. Du har dog altid mulighed for at blive genkendt gennem dit kreative logodesign og din branding.

Desværre er det nogle gange de mest “seriøse” organisationer, der er skyldige i at begå denne synd.

skærmbillede af Armeniens centralbank

Jeg havde mulighed for at samarbejde med Armeniens centralbank for et par år siden. De har nogle af de mest talentfulde finansanalytikere og eksperter i pengepolitik, der findes. Desuden var formanden for denne institution (uddannet fra Harvard) tidligere min professor, og han er uden tvivl den klogeste person, jeg har mødt i mit liv.

Centralbankens websted ser dog så dårligt ud, at det vil være svært for dig at tro, at dette er en meget fremtrædende organisation med ekstremt talentfulde medarbejdere.

Synd #4: Mørke mønstre (eller brug af UX mod dine brugere)

I UX-verdenen er “mørke mønstre” brugerrejser og elementer i brugergrænsefladen, der vildleder brugeren og får vedkommende til at udføre en handling, som han eller hun ikke er klar over.

Der findes en bestemt e-handelsbutik med et orange, pilformet logo, som er særligt “berømt” for at implementere mørke mønstre. De er skyldige i dette i en sådan grad, at der er igangværende klager og undersøgelser mod dem, fordi de ikke følger FCC's regler.

En af de mest berømte brugeroplevelser, der falder ind under denne kategori, er den måde, du forventes at opsige et Prime-medlemskab på.

For at være fair synes jeg stadig, at det er en god idé at bede dine brugere om feedback, når de opsiger deres betalte abonnement, eller endda tilbyde dem en “bliv nu”-rabat. Men du er nødt til at respektere dine brugeres tid og tålmodighed.

Vær opmærksom på, at de personer, der ønsker at opsige dit abonnement, højst sandsynligt er irriterede eller utilfredse med dig. Hvis du derfor gør det vanskeligt for dem at opsige det, vil det gøre dem endnu mere vrede (og du kan glemme alt om muligheden for at få dem tilbage en dag i fremtiden).

Hvis du for eksempel forsøger at opsige dit Prime-medlemskab, vil Amazon bede dig om at genoverveje det.

skærmbillede af opsigelse af Amazon Prime-medlemskab
Kilde: Business Insider

Jeg har ikke noget imod denne skærm, det gør alle.

Jeg bryder mig imidlertid ikke om, at du skal bekræfte dit valg to(!) gange mere for at opsige det (du laver sjov, ikke?). Desuden er formuleringerne og farverne, de bruger til deres CTA'er, udformet, så det bliver svært for dig at finde den, der opsiger medlemskabet, i stedet for at beholde det.

Gør dette i stedet

Forsøg ikke at narre dine brugere til at udføre en handling, der strider mod deres hensigt, eller at “slide dem ned” ved at gøre det urimeligt svært at opsige. Folk er kloge nok til at vide, at du gør det med vilje, og det får bare dine konkurrenter til at se mere attraktive ud. Gennemfør i stedet en kort undersøgelse af årsagen til, at de forlader dig, og gør processen effektiv, samtidig med at du holder døren åben for, at de kan vende tilbage.

Synd #5: Manglende overholdelse af bedste praksis for formularer

Formularer er et af de grundlæggende elementer på websteder og noget af det første, udviklere lærer at bygge, og designere lærer at, ja, designe.

At skabe en god brugeroplevelse for formularer er sandsynligvis et af de mest diskuterede emner blandt designere, og du kan finde bedste praksis, vejledninger og lektioner om det stort set overalt.

Suren Karapetyan

Author's Tip

Bemærk: Hvis du vil vide mere om dette emne, anbefaler jeg på det kraftigste bogen “Designing UX: Forms” af Jessica Enders

I betragtning af mængden af undervisningsmateriale om formularer og vigtigheden af at udforme dem korrekt (det vil trods alt have direkte indflydelse på din tilgang og andre vigtige målepunkter), vil jeg hævde, at det er en synd ikke at følge de etablerede bedste praksisser for brugeroplevelse i formularer.

Lad mig nu give dig et eksempel på dårligt produktdesign af formularer.

skærmbillede af dårligt produktdesign af formular

Jeg kan ikke engang se på denne side, uden at mine øjne svier. Der er simpelthen så mange ting, der er galt her. For blot at nævne nogle få:

Forkert brug af tomrum: Hvorfor skal feltnavnene være så langt væk fra selve felterne? Hvorfor bruger du en hel blok til at placere to små omskiftere til afhentning og levering? Du kan oprette en formular, der indeholder alle oplysningerne her, og som er mindst 4 gange mindre og meget nemmere at skimme.

Forkert formatering af felter: Der er et telefonfelt, hvor de cifre, du indtaster, ikke vises i formatet for et telefonnummer (f.eks. +1 (555) 123-1234), så det bliver nemmere at læse. Det er så almindeligt, at størstedelen af designværktøjerne endda har færdige komponenter til det.

Fravær af pladsholder: Man kan knap nok se, at der er et tekstfelt i sektionen “Yderligere leveringsinstruktioner”. Desuden er jeg ikke sikker på, hvad man forventes at skrive der. God brugeroplevelse i formularer forudsætter altid, at der er pladsholdere, som giver dig et hint, f.eks. "Stil pakken på verandaen foran huset."

Gør dette i stedet

Løsningerne på hvert af disse problemer er ret indlysende, men dette er et tilfælde, hvor det ser ud til, at de eneste personer, der testede formularen, er dem, der byggede den. Designerne ville have været godt tjent med at indhente noget reel brugerfeedback om denne brugeroplevelse, før den blev lanceret.

Synd #6: Brug af de forkerte brugerfladeelementer

Den næste synd, jeg vil tale om, er en fortsættelse af den foregående. Formularer er ikke de eneste brugerfladeelementer i dit produkt, der bør følge veletablerede konventioner og bedste praksisser. Der findes også andre almindelige elementer som omskiftere, afkrydsningsfelter og andre.

Faktisk har brugerne allerede etablerede mentale modeller for, hvordan hvert af disse elementer fungerer, og du skal sørge for, at du bruger dem på den rigtige måde.

Her er et par eksempler på, hvad disse elementer er beregnet til, og hvordan man ikke skal bruge dem:

Omskiftere: Dette element viser dig en “boolesk” tilstand (som at noget er Til/Fra eller Aktivt/Inaktivt). De er gode til at vise brugerne status for Bluetooth-antennen på deres smartphone og lade dem slå den til eller fra.

I den foregående formular er der dog to omskiftere, som lader brugeren vælge mellem afhentning og levering.

skærmbillede af omskifter til afhentning eller levering

Hvis du tænker over det et øjeblik, har du tænkt længere over det, end designeren gjorde. Disse omskiftere betyder, at du skal slå “afhentning” FRA og “levering” TIL for at vælge indstillingen “levering”! De kunne have brugt alternativknapper. Jeg spekulerer ærligt talt på, hvad der sker, hvis en bruger slår dem begge til på samme tid.

Vælgermenuer uden filtrering: Som et af de ældste elementer på websteder er vælgermenuer stadig populære og meget brugervenlige, hvis de bruges korrekt. 

Gør dette i stedet

Bedste praksis foreskriver, at du skal bruge en vælgermenu i de tilfælde, hvor brugeren skal vælge én mulighed fra en liste med 5-15 muligheder. Hvis der er færre end 5 muligheder, bør du vælge alternativknapper.

Hvis der er en omfattende liste over muligheder at vælge imellem (f.eks. 50 amerikanske delstater eller ~200 lande), skal du tilføje filtrering til din vælgermenu. Ellers bliver din bruger nødt til at rulle gennem den lange liste for at finde den mulighed, vedkommende ønsker.

More Articles

Synd #7: At forsømme, hvem dine brugere er, og hvad de ønsker

Endelig den største synd af dem alle: at skabe et nyt produkt med et brugeroplevelsesdesign, der ikke passer til dine brugeres behov og interesser. Det er en opskrift på fiasko.

Gør dette i stedet

En god produktdesignproces begynder altid med brugerundersøgelser. Medmindre du ved, hvem dine brugere er, og hvad de har brug for, vil du næsten helt sikkert ende med et dårligt designet produkt, uanset hvor smuk en brugergrænseflade du skaber.

Jeg ved, at brugerundersøgelser ikke er nogen nem opgave. Det tog trods alt Apple flere års brugertest at opnå et enestående niveau af brugervenlighed i både det industrielle design og brugeroplevelsen af deres iPhone. Men tro mig: Det er det enkeltstående stykke arbejde, der har størst indflydelse på, hvad du kan gøre for at sikre dit produkts succes.

Det er virkelig nemt at undgå designfejl

Hvis du arbejder med at bygge websites, har du et bedre udgangspunkt. Hvorfor? Fordi webdesignværktøjer normalt tilbyder skabeloner, der allerede undgår nogle af de fejl, der er nævnt her. Men uanset om du er en startup, der udvikler digitale produkter, eller en virksomhed, der bygger fysiske produkter (som tastaturer eller bevægelsessensorer), er det faktisk ret nemt at undgå dårligt design.

Så længe din produktudviklingsproces fokuserer på dine brugeres behov og problemer, og du bruger den rigtige software til produktdesign, vil du kunne undgå væsentlige designfejl og at ende med et dårligt designet produkt (dette er også en af de mange fordele ved AI-designsoftware).

Jeg håber, at disse eksempler fik dig til at føle dig bedre tilpas med dine egne produkter eller i det mindste fik dig til at trække på smilebåndet. Hvis du vil have flere UX-tips og andre artikler til produktfolk, så husk at abonnere på vores nyhedsbrev!

Suren Karapetyan
Suren Karapetyan, MBA, is a principal product manager focused on AI-driven SaaS products. He thrives in the fast-paced world of early stage startups and finds the product-market fit for them. His portfolio is quite diverse, ranging from background noise cancellation tools for work-from-home folks to customs clearance software for government agencies.
Follow the author:

You may also like