5 Designtriks for å få din mobile UX til å skinne
Har du sett på nettstedanalysen din i det siste? Sjansene er en betydelig del - kanskje enda mer enn halvparten - av brukerne dine kommer til nettstedet ditt via mobilenhet.
Enten du fokuserer mobilinnsats på et nettsted eller en app, må du sørge for at designen skaper en fantastisk brukeropplevelse for hver og en av de mobile brukerne. Du trenger ikke å starte fra bunnen av for å gjøre det heller. Å tenke på mobilbrukeren og hvordan de interagerer med designen vil bidra til å forme hvordan grensesnittene dine ser ut og fungerer.
Her er fem designtriks du kan bruke for å gjøre din mobile UX til en som brukere elsker.
Utforsk Envato Elements
1. Streamline Navigation
Disse mega-navigasjonsmenyene på old school gjør deg ikke noe særlig - spesielt når det gjelder mobil. Mobilbrukere kan ha de korteste oppmerksomhetsspennene for en gruppe brukere. De vil åpne nettstedet eller appen og finne det de trenger med en gang.
Design navigasjonsmenyer med bare noen få alternativer - se på analysene dine for å se hva flertallet av brukerne leter etter eller naviger til først.
Færre alternativer vil ta mindre skjermplass, slik at du kan integrere mer plass i designen, noe som er ideelt for berøring og lesbarhet.
Selv om vi ikke vil argumentere for fordelene med hamburgerikonet her, er pop out-navigasjon et mønster som brukerne er vant til. Bare sørg for at hvis du planlegger å sprette eller skyve ut navigasjonsmenyen, at det er en tydelig visuell identifikasjon for brukere.
Ebates-appen bruker to navigasjonsnivåer: En som er en liste over de beste tilbudene deres, og en annen er den bokmerkede listen over favorittbutikkene (i hamburger / hjerteikonet). Ingen av alternativene føles tunge. Det ser nesten ut og fungerer som innhold. Hele designet er navigasjon uten å føle seg overveldende.
2. Tenk i gester (og Haptics)
Mobilbrukere samhandler med enhetene sine ganske annerledes enn stasjonære brukere. Brukergrensesnittet ditt skal redegjøre for dette.
Designet bør dra nytte av gester for å utføre visse handlinger. Et grensesnitt som bruker vanlige og intuitive kontroller, vil glede brukerne.
Disse bevegelsene inkluderer:
- Trykk og dobbelttrykk
- trykk
- Holde
- Dra og slipp
- Rull (enkel- og tofinger)
- Zoom inn og ut
- Sveip
- flick
Når det gjelder mobilbevegelser er de nye klikkene.
Og mens du tenker på berøringsinteraksjoner, ikke glem haptics. Den subtile "støt" fra din bærbare eller at vibrasjoner fra telefonen i lommen er haptiske varslinger, mekaniske simuleringer av berøring ved bruk av vibrasjoner eller bevegelse.
Trikset for haptisk er at samhandlingene er subtile og ganske beskjedne. Selv om brukeren kanskje vet at det er en varsling, vil andre ofte ikke gjøre det. Berøringsgrensesnittet blir mer vanlig hele tiden og ser ut til å få et positivt svar fra brukerne.
Two Dots-spillet bruker for eksempel en støt hver gang du tømmer prikker på en viss måte. Det lydløse alternativet sørger for diskret spill og gir en hyggelig opplevelse for brukerne.
3. Gjør det til samtale
Folk liker å føle at de snakker med og samhandler med andre mennesker. Heldigvis for designere, kan et snev av kunstig intelligens og chatbots bidra til å skape disse interaksjonene, slik at du ikke trenger å være i beredskap for live chat-økter 24 timer i døgnet.
Det er tre måter å lage en samtale-brukergrensesnitt på:
- Skriv kopi gjennom grensesnittet ditt som har et mer personlig preg. Fra lange tekstblokker til små biter av mikrokopi, bør teksten ha en personlighet, slik som på WTFWeather-appen, over. Det bør leses på den måten folk snakker. Vær forsiktig med å høres altfor formell eller robot i meldingene dine.
- Bruk meldingsfunksjoner eller chatbots for å opprette øyeblikkelig interaksjon med brukere. Dette kan være et flott kundeserviceverktøy og også bidra til å skape kundelojalitet hvis noen alltid er der for å hjelpe dem gjennom problemer.
- Integrer et stemmebrukergrensesnitt i designet. Siri og Alexa er husnavn, takket være stemmegrensesnitt. Den andre bonusen til å integrere stemmekommandoer? Det vil gjøre nettstedet eller appen din mer tilgjengelig.
4. Animer det
Det virker som om det er animerte elementer på nesten alle nettsteder du besøker. Og det er av design. Animasjon kan gi et design liv.
Animerte elementer er svært engasjerende fordi de fanger brukerens oppmerksomhet og kan hjelpe brukerne å vise hvordan de kan samhandle bedre med et design. (Det går tilbake til den klassiske ideen om “show, don’t tell” når du lager et design.)
Google Maps er for eksempel fullpakket med lite animasjoner. Vær oppmerksom neste gang du bruker den.
Nick Babich, for UX Planet, har en flott grunning på bruk for animasjon i mobil UI-design. Han skisserte tre viktige bruksområder for hvordan du bruker bevegelse godt.
- For systemstatus: Bruk animasjon for å vise en lastestatus, for forfriskende innhold og for varsler.
- For navigering og overganger: Bruk animasjon for å hjelpe brukere med å bevege seg mellom forskjellige typer innhold, for å etablere visuelt hierarki mellom elementer og for å vise en endring av tilstanden.
- For visuell tilbakemelding: Bruk animasjon for å vise erkjennelse av en handling eller for å hjelpe til med å visualisere resultatet av en handling.
5. Ombord brønn og bruk skjemaer riktig
Spesielt med en app er onboarding viktig for brukernes lojalitet.
Tenk på det siste spillet du lastet ned. Hoppet du rett inn? Eller trengte du en rask opplæring for å sikre suksess?
En interaktiv onboarding-opplevelse for apper vil hjelpe brukere å lære å få mest mulig ut av funksjonene som er inkludert i brukeropplevelsen. Et morsomt alternativ vil også hjelpe dem med å overføre til lojale brukere. Hold ombordopplæringen kort, og sørg for å ta med ofte stilte spørsmål eller hjelpeavdeling slik at brukere kan gå tilbake til det hvis de har problemer.
Onboarding med mobile nettsteder er mindre viktig, men registrering eller registreringsskjemaer kan være et problem. Skjemaer på mobile enheter må være enkle og enkle. Brukere liker ikke klumpete kompliserte former.
Strømlinjeformer for mobil for å øke konverteringene. (Du kan alltid be om mer informasjon senere.)
Se på det enkle utgangspunktet for GoodRx, over. Den ber bare om medisinen du vil vite mer om. Skjemaet er i fokus, og det er superenkelt.
Be om bare en bit informasjon - en e-postadresse. Det er alt du trenger for å starte et forhold med en bruker. Hvis nettstedet eller appen din krever innlogging, hold deg til en e-postadresse og passord.
Utform skjemaet slik at bokser er enkle å fylle ut (fra et størrelsessynspunkt) og vurder å grøfte eventuelle auto komplette funksjoner for å redusere sjansene for feil skrevet e-postadresser. Ett triks til? Bruk et sosialt påloggingsskjema når du kan for å forenkle prosessen enda mer. Brukere er vant til denne prosessen, og det er lett for dem… og mindre sannsynlig at det har feil for deg.
Konklusjon
Den mobile brukeropplevelsen er en av de viktigste tingene du trenger å tenke på når du bygger nettstedet eller appen din. Og mobilbrukerbehov fortsetter å endre seg hele tiden.
Lag et grensesnitt som er enkelt å bruke og dra nytte av moderne teknologi og funksjoner for å lage noe brukerne vil ønske å engasjere seg igjen og igjen.