5 måter den flytende handlingsknappen øker UX
En flytende handlingsknapp (FAB) er et sirkelikon som flyter over brukergrensesnittet. Form, posisjon og farge sørger for at den skiller seg ut fra resten av brukergrensesnittet. FAB ble popularisert ved utgivelsen av Googles Material Design-prinsipper i 2014. Siden denne utgivelsen har FAB-brukergrensesnittelementet blitt utbredt i web- og mobildesign.
Selv om FAB kan ses som en liten, tilsynelatende ubetydelig UI-komponent, kan dens effekter være viktige. Gitt at mønsteret brukes riktig, er det ment å være umiddelbart identifiserbart og tilgjengelig.
Flytende handlingsknapp i Android-app
1. Represent en Hallmark Action
Ideelt sett bør FAB markere de mest relevante eller ofte brukte tiltakene, det bør brukes til handlinger som er de viktigste egenskapene til appen din. Hvis du skal bruke FAB i appen din, må utformingen av appen nøye vurderes og brukerens mulige handlinger må kokes ned til en enkelt fremtredende funksjon. For eksempel kan en musikkapp ha FAB som representerer 'Spill / Stopp'. En Instagram-lignende app kan ha en FAB som representerer 'Ta et bilde'.
En flytende handlingsknapp representerer den primære handlingen i et program. Hvis du pauser eller gjenopptar avspilling på denne skjermen, forteller brukerne at det er en musikkapp.
Ifølge forskning ved Steve Jones , FAB demonstrerer en liten negativ brukbarhetspåvirkning når brukerne først bruker knappen. Når brukere imidlertid fullfører en oppgave med FAB, kan de bruke den mer effektivt enn en tradisjonell handlingsknapp.
2. Vær en måte å finne verktøyet
FAB er en naturlig cue for å fortelle brukerne hva de skal gjøre neste. Forskning fra Google viser at mange brukere bruker FAB til å navigere når de møter ukjente skjermbilder. Dermed er FAB veldig nyttig som skilt av hva som skal gjøres neste gang.
Bruken av en flytende handlingsknapp i Twitter oppfordrer deg til å legge inn innhold
3. Gi et sett med tiltak
I noen tilfeller er det hensiktsmessig for knappen å spinne ut og avsløre noen andre alternativer som kan sees i Evernote eksempelet nedenfor. FAB kan erstatte seg med en sekvens av mer spesifikke handlinger, og du kan designe dem for å være kontekstuelle for brukerne. Som en tommelfingerregel, gi minst tre alternativer ved trykk, men ikke mer enn seks (inkludert det opprinnelige flytende handlings-knappemål).
Vær også oppmerksom på at disse handlingene må være relatert til den primære handlingen FAB selv uttrykker, og være relatert til hverandre: ikke behandle disse åpenbare handlingene som uavhengige som de kunne være hvis de er plassert på en verktøylinje.
Ikke: "Hvor jeg er" er handling ikke relevant for å skape innholdsaksjoner.
4. Vær oppmerksom på innhold
Konteksten spiller en viktig rolle i brukerinteraksjonen. Noen ganger bruker brukere å konsumere innhold, noen ganger vil de utføre handlinger. Alt avhenger av kontekst. Bruke noen kontekstuell oppførsel kan bringe det beste av FAB til UX av en app. La oss vurdere Google+ som et eksempel. Google+ viser knappen når brukeren er i kontakt med strømmen, og gjemmer den når det engasjementet er reversert. Disse to statene er avhengige av kontekst: når brukerne er involvert med en sosial strøm, er en primær handling å rulle, derfor er det ikke behov for FAB, og når brukerne slutter å rulle, vil de kanskje legge inn noe.
5. Koble to stater sammen
FAB er ikke bare en rund knapp, den har noen transformative egenskaper som du kan bruke til å lette brukerne fra skjerm til skjerm. Når du trykker på den flytende handlingsknappen, gjør du overgang mellom to tilstander på en logisk måte. Animasjonen i eksemplene nedenfor opprettholder brukerens orienteringsorientering og hjelper brukeren å forstå forandringen som nettopp har skjedd i visningsoppsettet, hva som har utløst endringen, og hvordan man kan initiere endringen igjen senere om nødvendig.
Bilde kreditt: Ehsan Rahimi
Bilde kreditt: Dribbble
Konklusjon
Noen kan si at FAB er dårlig UX. Det er fristende å si det fordi brukere og designere ikke er vant til det. Vi er vant til kjente verktøylinjer, og konseptet FAB er fortsatt ganske nytt for oss. Vi vet alle hvordan de nye tingene er vanskelige, men samtidig oppmuntrer de til en mer nøye utformet brukeropplevelse. Brukes riktig, kan FAB være et forbløffende nyttig mønster for sluttbrukeren.