På dette tidspunktet i historien vår finnes det absolutt ingen unnskyldning for dårlig produktdesign. I den stadig mer konkurransepregede verdenen av programvareprodukter er det ikke valgfritt å få UI- og UX-designet riktig. Selv om du har fremragende teknologi som er i stand til å løse brukernes problemer, vil dårlig UX få brukerne til å flykte fra produktet ditt – enten fordi de ikke klarte å finne ut hvordan de skulle bruke det, eller rett og slett fordi de hater det.
Gjør deg klar; jeg skal snart komme med litt «tøff kjærlighet» om hvordan man ikke bør utforme UX, ved å liste opp produktdesignets sju dødssynder og avsløre noen av de verste synderne.
Synd nr. 1: «Juletreet»
Et av mine hyggeligste barndomsminner er da søsteren min og jeg pyntet juletreet. Så snart vi var ferdige, så vi på det med ærefrykt, siden det var noe helt nydelig for oss. Vel, i hvert fall var det slik vi så det. Hvordan så det egentlig ut? Noe som dette.
Jeg antar at du skjønner hvor jeg vil med dette. I motsetning til juletreet som du virkelig ønsker at barna dine skal pynte akkurat slik de selv vil, bør ikke UI-en og UX-en din se ut som et stort virvar av elementer og farger som er strødd rundt omkring.
La oss nå se på et ekte produkt som ser ut som et «juletre».
Bare se på dette et øyeblikk og prøv å forklare meg hva dette produktet handler om. Jeg er sikker på at du gikk deg vill i UI-en og heller ikke klarte å finne ut av det på en stund. Det skjer rett og slett for mye på denne skjermen; det er nærmest umulig å forstå hvor du er, og hva du bør gjøre.
Problemene jeg ser med dette grensesnittet, omfatter:
- Overdreven bruk av farger: Farger er et kraftig verktøy i hendene på dyktige produktdesignere, siden de kan lede brukerne i riktig retning. Hvis du derimot har for mange farger i UI-en, svekker det denne kraften, og hvert fargelagte element begynner å konkurrere om oppmerksomheten.
- For mange CTA-er: Hva er det viktigste jeg bør klikke på nå? Helt ærlig, jeg aner ikke – det er knapper overalt.
- Forvirrende oppsett: Skjermen er altså delt inn i tre kolonner, der den midterste har to faner, og det finnes også en stor tidslinjedel nederst. Designerne har forsøkt å presse inn så mange ting som mulig på én enkelt skjerm.
Gjør dette i stedet
Dette er et tilfelle der man forsøker å tilnærme seg UX ved å skape en form for orden ut av en mengde informasjon. Tenk heller på UX-en din som et kart over atferden du ønsker fra brukerne dine. Det er grunnleggende produktdesign at farger, CTA-er og oppsett bør fungere sammen for å lede brukeren til å ta de riktige neste stegene.
Synd nr. 2: Dårlig visuelt hierarki
Visuelt hierarki viser til hvordan elementene i UI-en din er arrangert på en måte som tydelig formidler det hierarkiske forholdet mellom dem.
Artikkelen du leser nå har for eksempel et tydelig visuelt hierarki, siden tittelen står øverst med stor skrift, undertitlene har mindre skrift enn tittelen, men er langt fetere enn avsnittene, og så videre.
I begge tilfellene fremhever vi titlene ved enten å gjøre dem større eller fetere – noe som tydelig viser at avsnittene handler om temaene som er angitt i hver av de tilhørende undertitlene.
Visuelt hierarki er en flott måte å organisere UI-en på og gjøre den enkel å navigere i. Fraværet av det er derimot en flott måte å gjøre det vanskelig for brukerne å finne frem i grensesnittet.
En av de mest fremtredende sviktene når det gjelder visuelt hierarki, og noe som irriterer meg daglig, er svarseksjonen på Quora.
For å oppmuntre folk til å se på andre spørsmål og bli værende lenger på nettstedet har Quora også inkludert spørsmål og svar som er relatert til spørsmålet du ser på nå.
Det har jeg ikke noe imot. Det er en eksisterende brukeradferd, og Quora har funnet en organisk måte å dra nytte av den på.
Det jeg derimot har noe imot, er måten de har utformet disse relaterte spørsmålene og svarene på. De ser nesten identiske ut med de faktiske svarene på siden og mangler et visuelt hierarki. Se på skjermbildet ovenfor og fortell meg hvilket som er et svar, og hvilket som er et relatert spørsmål. Du må virkelig lese sakte for å få det med deg.
Have an account? Log In
Gjør dette i stedet
Ideelt sett burde de relaterte spørsmålene være mindre fremtredende i brukergrensesnittet og ligge under hovedsvarene når det gjelder det visuelle hierarkiet (for eksempel ha en gråaktig bakgrunn i stedet for en hvit).
Synd #3: Brukergrensesnitt rett fra 2000-tallet
Jeg vet, jeg vet, Craigslist har et fryktelig utdatert brukergrensesnitt, og det fungerer fortsatt helt fint. Men det er et unntak fra regelen, og du bør ikke tro at det fortsatt er helt greit å ha noe slikt i 2023.
Problemet er at produktet ditt, i motsetning til Craigslist, ikke kommer til å bli superpopulært og ikke har en merkevare som er universelt gjenkjent. Derfor vil folk ganske enkelt ikke ta deg seriøst hvis de ser noe utdatert når de besøker nettstedet ditt eller bruker applikasjonen din. Du har imidlertid alltid muligheten til å bli lagt merke til gjennom din kreative logodesign og merkevarebygging.
Trist nok er det noen ganger de mest «seriøse» organisasjonene som gjør seg skyldige i denne synden.
Jeg fikk muligheten til å samarbeide med Armenias sentralbank for et par år siden. De har noen av de dyktigste finansanalytikerne og ekspertene på pengepolitikk som finnes. Dessuten var presidenten for denne institusjonen (utdannet ved Harvard) professoren min, og han er uten tvil den smarteste personen jeg har møtt i livet.
Nettsiden til sentralbanken ser imidlertid så dårlig ut at det vil være vanskelig for deg å tro at dette er en svært fremtredende organisasjon med ekstremt dyktige medarbeidere.
Synd #4: Mørke mønstre (eller å bruke UX mot brukerne dine)
I UX-verdenen er «mørke mønstre» brukerreiser og brukergrensesnittelementer som feilinformerer brukeren og får dem til å utføre en handling de ikke er klar over.
Det finnes en bestemt nettbutikk med en oransje, pilformet logo som er spesielt «kjent» for å implementere mørke mønstre. De er så skyldige i dette at det pågår klager og undersøkelser mot dem for ikke å følge FCC-reglene.
En av de mest kjente brukeropplevelsene som faller inn under denne kategorien, er måten du skal avslutte et Prime-medlemskap på.
For å være rettferdig synes jeg fortsatt det er en god idé å be brukerne dine om tilbakemeldinger når de avslutter det betalte abonnementet sitt, eller til og med tilby dem en «ikke gå»-rabatt. Men du må respektere tiden og tålmodigheten til brukerne dine.
Vær oppmerksom på at personer som ønsker å avslutte abonnementet ditt, mest sannsynlig er irriterte på eller misfornøyde med deg. Hvis du gjør det vanskelig for dem å avslutte, vil de derfor bli enda sintere (og du kan glemme muligheten for å få dem tilbake en dag i fremtiden).
Hvis du for eksempel prøver å avslutte Prime-medlemskapet ditt, vil Amazon be deg om å revurdere.
Jeg synes denne skjermen er grei, det gjør alle.
Jeg synes imidlertid ikke det er greit at du må bekrefte valget ditt to(!) ganger til for å avslutte (du tuller nå, ikke sant?). Dessuten er ordlyden og fargene de bruker på handlingsknappene, utformet for å gjøre det vanskelig for deg å finne den som avslutter medlemskapet i stedet for å beholde det.
Gjør dette i stedet
Ikke prøv å lure brukerne dine til å utføre en handling som strider mot hensikten deres, eller prøv å «slite dem ut» ved å gjøre det unødvendig vanskelig å avslutte. Folk er smarte nok til å vite at du gjør det med vilje, og det vil bare få konkurrentene dine til å fremstå som mer attraktive. Ta i stedet en kort undersøkelse om hvorfor de forlater deg, og gjør prosessen effektiv samtidig som du lar døren stå åpen for at de kan komme tilbake.
Synd #5: Ikke følge beste praksis for skjemaer
Skjemaer er et av de grunnleggende elementene på nettsteder, og noe av det første utviklere lærer å bygge og designere lærer å, vel, designe.
Å skape en god brukeropplevelse for skjemaer er sannsynligvis et av de mest diskuterte temaene blant designere, og du kan finne beste praksis, veiledninger og leksjoner om dette omtrent overalt.
Author's Tip
Merk: For mer om dette emnet anbefaler jeg på det sterkeste boken “Utforming av UX: Skjemaer” av Jessica Enders
Med tanke på hvor utbredt opplæringsmateriell om skjemaer er, og hvor viktig det er å utforme dem riktig (det vil tross alt ha direkte innvirkning på anskaffelsen og andre viktige måltall), vil jeg hevde at det er en synd å ikke følge etablerte UX-anbefalinger for skjemaer.
La meg nå gi deg et eksempel på dårlig produktdesign for skjemaer.
Jeg klarer ikke engang å se på denne siden uten at det svir i øynene. Det er rett og slett så mye som er galt her. For å nevne noe:
Feil bruk av tomrom: Hvorfor må feltnavnene være så langt unna selve feltene? Hvorfor bruker dere en hel blokk til å plassere to små brytere for henting og levering? Dere kan lage et skjema som inneholder all informasjonen her, som er minst 4 ganger mindre og mye enklere å skanne.
Feil formatering av felt: Det finnes et telefonfelt der sifrene du skriver inn, ikke vises i formatet til et telefonnummer (f.eks. +1 (555) 123-1234), slik at det blir enklere å lese. Dette er så vanlig at de fleste designverktøy til og med har ferdige komponenter for det.
Manglende plassholder: Du kan knapt legge merke til at det finnes et tekstfelt i delen «Ytterligere leveringsinstruksjoner». Dessuten er jeg ikke sikker på hva du skal skrive der. God UX for skjemaer forutsetter alltid at det finnes plassholdere som gir deg et hint, som «Vennligst legg pakken på trappen foran inngangsdøren.»
Gjør dette i stedet
Løsningene på hvert av disse problemene er ganske selvinnlysende, men dette er et tilfelle der det virker som om de eneste som testet skjemaet, var de som laget det. Designerne ville vært godt tjent med å innhente reelle tilbakemeldinger fra brukere på denne UX-en før lansering.
Synd #6: Å bruke feil brukergrensesnittelementer
Den neste synden jeg vil snakke om, er en fortsettelse av den forrige. Skjemaer er ikke de eneste brukergrensesnittelementene i produktet ditt som bør følge veletablerte konvensjoner og anbefalte fremgangsmåter. Det finnes også andre vanlige elementer, som brytere, avkrysningsbokser og flere andre.
Faktisk har brukerne allerede etablerte mentale modeller for hvordan hvert av disse elementene fungerer, og du må sørge for at du bruker dem på riktig måte.
Her er et par eksempler på hva disse elementene er laget for, og hvordan du ikke skal bruke dem:
Brytere: Dette elementet viser en «boolsk» tilstand (for eksempel om noe er På/Av eller Aktivt/Inaktivt). De er ypperlige til å vise brukerne statusen til Bluetooth-antennen på smarttelefonen deres og la dem slå den på eller av.
I det forrige skjemaet finnes det imidlertid to brytere som lar brukeren velge mellom henting og levering.
Hvis du tenker over dette et øyeblikk, har du allerede tenkt på det lenger enn designeren gjorde. Disse bryterne betyr at du må slå «henting» AV og «levering» PÅ for å velge alternativet «levering»! De kunne ha brukt alternativknapper. Jeg lurer ærlig talt på hva som skjer hvis en bruker slår begge på samtidig.
Valgmenyer uten filtrering: Som et av de eldste elementene på nettsteder er valgmenyer fortsatt populære og svært brukervennlige når de brukes riktig.
Gjør dette i stedet
Beste praksis tilsier at du bør bruke en valgmeny når brukeren skal velge ett enkelt alternativ fra en liste med 5–15 alternativer. Hvis det er færre enn 5 alternativer, bør du heller bruke alternativknapper.
Hvis det finnes en omfattende liste med alternativer å velge mellom (f.eks. 50 amerikanske delstater eller rundt 200 land), må du legge til filtrering i valgmenyen. Ellers må brukeren bla gjennom den lange listen for å finne alternativet de ønsker.
More Articles
Synd #7: Å overse hvem brukerne dine er, og hva de ønsker
Til slutt, den største synden av dem alle: å skape et nytt produkt med en UX-design som ikke passer brukernes behov og interesser. Dette er rett og slett en oppskrift på fiasko.
Gjør dette i stedet
En god produktdesignprosess starter alltid med brukerundersøkelser. Med mindre du vet hvem brukerne dine er og hva de trenger, vil du nesten helt sikkert ende opp med et dårlig utformet produkt, uansett hvor vakkert brukergrensesnitt du lager.
Jeg vet at brukerundersøkelser ikke er en enkel oppgave. Det tok tross alt Apple flere år med brukertesting å oppnå et eksepsjonelt nivå av brukervennlighet både i den industrielle utformingen og brukeropplevelsen til iPhone. Men tro meg: Det er det enkeltarbeidet som har størst innvirkning på produktets suksess.
Det er virkelig enkelt å unngå designfeil
Hvis du jobber med å bygge nettsteder, har du et bedre utgangspunkt. Hvorfor? Fordi verktøy for webdesign vanligvis tilbyr maler som allerede unngår noen av feilene som er listet opp her. Men uansett om du er en oppstartsbedrift som utvikler digitale produkter, eller en større virksomhet som bygger fysiske produkter (som tastaturer eller bevegelsessensorer), er det faktisk ganske enkelt å unngå dårlig design.
Så lenge produktutviklingsprosessen din fokuserer på brukernes behov og smertepunkter, og du bruker riktig programvare for produktdesign, vil du kunne unngå betydelige designfeil og å ende opp med et dårlig utformet produkt (dette er også én av de mange fordelene med AI-designprogramvare).
Jeg håper disse eksemplene fikk deg til å føle deg bedre med tanke på dine egne produkter, eller i det minste fikk deg til å trekke på smilebåndet. Hvis du vil ha flere UX-tips og andre artikler for produktfolk, bør du abonnere på vårt nyhetsbrev!
