Share
Tomme stater er ofte en ettertanke for de fleste designere.
Hjemmesiden og betalingsvognen kan for eksempel være den mest prioriterte funksjonen i tilbakemeldingen din - men hva med de tomme tilstandene til disse funksjonene? Hvordan skal de takles?
Følgende artikkel er ikke omfattende, eller en "må" på noen måte. I stedet skisserer det tre vanlige typer tom tilstand:
Vi vil se på et godt eksempel på hver, diskutere hvorfor det fungerer og hvordan du kan implementere lignende ideer, eller utvide det ut fra din unike situasjon.
Følgende skjermbilde er fra BBCNews-appen. Det er et eksempel på en skjerm hvor brukeren bruker appen for første gang og trenger litt retning for å "komme i gang".
Den er effektiv på et par nivåer:
Den gir tydelig forklaring. Denne tomme tilstanden forklarer hva gjeldende funksjon gjør og gir deg en knapp, som indikerer hvordan du kommer i gang. I dette tilfellet må brukeren legge til emner for å lage sin egen personlige nyhetsmating.
Den gir en link for å fylle den funksjonen. Knappen, som tar brukeren til siden der de kan fylle den angitte skjermen, er en praktisk funksjon. Det sparer brukeren å navigere hjem og prøve å finne skjermen på annen måte.
Så hvordan kan du implementere noe som ligner deg selv?
Gi en ombordstigningssekvens. Hvis brukeren bruker din web-app for første gang, kan du vurdere en gjennomgang for å hjelpe dem med å få fart. Vær imidlertid oppmerksom på at dette kan frustrere eksperten og mellombrukeren. Vurder bare å vise det en gang og formidle informasjonen i hjelpeseksjonen din.
Følgende side er Ønskeliste fra Apple iTunes Store. Det er et eksempel på en side der brukeren ikke har noe, eller de har ryddet alt fra sin liste.
Hva gjør denne tomme siden effektiv?
Noe er bedre enn ingenting. Denne ønskelisten gir ikke bare noe ut. Det gir brukeren et signal om at de må legge til et element i listen. Ikonet er stort og fet, men likevel subtilt. Din tomme tilstand burde ta tak i brukerens oppmerksomhet - du har ingenting her! -Men er også et tegn på tomhet, f.eks. bruker dempede farger osv.
Direkte og rett til punktet. Det er fristende å sette inn litt flufftekst i din tomme tilstand ... kanskje et sitat fra noen. Men mesteparten av tiden er det beste alternativet bare å være direkte og rett til punktet som vist i eksempelet ovenfor "Du har ikke lagt til noe i din ønskeliste".
Denne ønskeliste siden kunne ha blitt forbedret, så hva skal vi lære av det?
Gi et eksempel. Du kan også tenke på å legge til et eksempel på hva en fylt tilstand kan se ut. Dette er trolig mer relevant for skrivebordet enn mobilgrensesnitt, da du har litt mer skjerm fast eiendom å jobbe med.
Følgende feilside er en del av Google Chrome-nettleseren. Det er et eksempel på en situasjon der brukeren får noe annet enn deres ønskede tilstand. I dette tilfellet kan de ikke koble til Internett.
Denne grafikken har blitt kjent for millioner, men hva gjør det til å fungere?
Det passer for situasjonen. Det virker fordi ikonet er subtilt og passende for problemets tyngdekraft. Det er vanlig å gå for et kryss eller en "X", og det er greit. Det er en god måte å ta tak i oppmerksomhet, men her vil du bare informere brukeren om at noe er galt. Du trenger ikke å skrike om det med et over ikonet eller meldingen.
Det gir mer informasjon. Du bør aldri la brukerne være usikre på hva du skal gjøre neste. I dette tilfellet har Chrome levert en Mer knappen for å hjelpe deg med å feilsøke problemet. I de fleste tilfeller vil brukeren trolig være klar over at de må slå på wifi, tilbakestille modemet eller ringe til internettleverandøren, men dette gir verdier til de brukerne som trenger mer info.
Hva med å bruke dette selv?
Vurder hvor kritisk feilmeldingene dine er. Hvor dårlig er feilen? Hvis det er kritisk for brukeren, må du virkelig ta tak i deres oppmerksomhet med sterke farger og klart hierarki. Tenk på språket som brukes og empati med brukerens posisjon. Et morsomt ikon som gir lys av en frustrerende situasjon kan gjøre saken verre!
Denne artikkelen har gitt deg et godt utgangspunkt for å vurdere når du ser på tomme stater. Vurder hvilken type tom tilstand du designer for og de mest hensiktsmessige måtene å opprette siden basert på brukernes situasjon og deres mål.
Noen få gode tommelfingerregler inkluderer:
Accentsconagua