RoleBanner

This page is not available in English.

RoleBanner (Representasjonsbanner) brukes i innloggede publikumsløsninger for å tydelig vise hvem brukeren representerer, for eksempel andre personer eller virksomheter.

Eksempel

Repreasjonsbanner i kontekst av ekstern toppbanner

Egnet til:

Publikumsrettede løsninger, hvor brukeren er logget inn slik at det finnes en identitet eller rolle å vise.
Tydelig vise når en bruker representerer en annen person eller virksomhet.
Å vise innlogget bruker i skjema eller tjeneste når denne informasjonen ikke ellers er tilgjengelig i toppen.

Uegnet til:

Interne systemer. Disse har andre mekanismer for autorisasjon og rollevisning.
Feil- og varselmeldinger. Hvis du skal vise feil, advarsler eller globale meldinger, se mønster for systemvarsler i stedet.
Når bruker ikke er logget inn. RoleBanner skal ikke vises før brukerens identitet eller representasjon er kjent.

Komponenter som ligner:

Teknisk dokumentasjon

Se RoleBanner i Storybook for tekniske detaljer.

Varianter

Bakgrunnfarge: Gul eller grå. Gul brukes for å gi ekstra oppmerksomhet når man representerer andre, mens grå er mer diskret når man representerer seg selv.
Sticky (standard) og ikke-sticky - sticky vil si at komponenten holdes synlig på skjermen, også når brukeren scroller nedover på siden.

RoleBanner som sticky:

Hvordan bruke komponenten

Innlogget bruker

RoleBanner vises først når brukeren er innlogget. Dette gjelder uansett om brukeren kun representerer seg selv eller også har andre roller tilgjengelig. Komponentens grunnfunksjon er å vise hvem brukeren representerer, og skal kun vises etter at brukeren er innlogget.

Representerer andre enn seg selv

Når en bruker handler på vegne av en virksomhet eller en annen person, må løsningen tydelig vise dette. Her brukes RoleBanner aktivt for å trygge brukeren i hvem hen representerer her og nå.

Gjør da følgende:

Vis topplinjen som normalt, med meny, brukerknapp og eventuelt søk. Dette gjør det enklere for brukeren å navigere mellom områder basert på rollen.
Bruk gul variant av RoleBanner. Gulfargen skaper et tydelig skille og tiltrekker oppmerksomhet.
Bruk sticky-modus. Dette gjør at bruker alltid kan se hvem de representerer, også når de scroller.

Denne kombinasjonen gir en tydelig og konsekvent markering av at brukeren ikke er i sin private rolle.

Representere seg selv -– i oppgaver og prosesser

Normalt trenger du ikke å bruke RoleBanner når brukeren representerer seg selv. Det er som regel tilstrekkelig at informasjonen står i brukerknapp og brukermeny.

Unntaket er når brukeren er midt i en isolert oppgave og vi reduserer distraksjoner og gjør siden mer fokusert (ved å skjule brukerinformasjon fra toppbanner). Da skal RoleBanner brukes for å vise innlogget bruker.

Bruk følgende regler:

Vis språkvelger og «Logg ut» som eneste valg i toppen. Dette gir mer ro og færre veier ut av tjenesten.
Bruk grå variant av RoleBanner. Grått signaliserer en nøytral representasjon uten ekstra oppmerksomhet.
Ikke bruk sticky-modus. I oppgaver hvor en representerer seg selv er det ikke nødvendig å vise innlogget bruker hele tiden.

Når du har andre sticky-elementer

Enkelte løsninger har andre komponenter som kan være sticky, som seksjoner, søkebokser eller hjelpepaneler. Flere samtidige sticky-elementer kan konkurrere om plassen og skape dårlig brukeropplevelse.

Sjekk derfor:

At RoleBanner ikke kolliderer visuelt med andre sticky-elementer
At det er tydelig hvilken komponent som ligger øverst
At komponentene ikke skjuler funksjoner for hverandre

Hvis du ikke får løst konflikten på annen måte, kan RoleBanner settes til ikke sticky som en nødløsning. Vær likevel klar over at dette svekker tydeligheten av representasjonen.

Universell utforming

Ikoner i RoleBanner er skjult for skjermlesere. Informasjon som formidles visuelt med ikon er erstattet med skjult tekst for å sikre best opplesning.
Sjekk sticky-variant spesielt på mobil. Dersom løsningen også bruker andre sticky-elementer, må du kontrollere at RoleBanner ikke dekker innhold eller fokus ved scrolling og zoom.