Har du styr på navigationen i din app?
Design handler ikke kun om et flot og kreativt interface, det handler i høj grad også om at få skabt en brugervenlig og ikke mindst simpel navigation gennem produktet.
Både nye og tilbagevendende brugere skal være i stand til at kunne bevæge sig nemt og gnidningsfrit igennem din app. Jo nemmere dit produkt er for dem at bruge, jo mere sandsynligt er det, at de vil bruge det.
Ind imellem vil vi gerne gøre det så godt som muligt for vores brugere, så vi overvælder dem med et hav af navigationsmuligheder, hvor alt er vigtigt og på samme niveau. Men det gør det ikke nemmere for dem at finde rundt, desværre.
En af de mest solide og grundlæggende navigationsformer i en app er tab bar (eller fanebjælken, på dansk). For at kunne nøjes med den som navigation, skal man dog have en knivskarp arkitektur.
Hvordan er arkitekturen i din app?
Vejen til den gode mobil navigation kan være en udfordring grundet mobilens lille skærm (sammenlignet med en computer-skærm). Derfor er der behov for en velstruktureret informationsarkitektur med hierarkier, der prioriterer indhold fra top til bund.
Tænk over hvilke handlinger brugeren forventes at udføre oftest, og placer dem øverst i hierarkiet. På den måde finder du hurtigt frem til din apps kernefunktionalitet, som bør udgøre fundamentet af din navigation. De sekundære funktioner placeres nederst i hierarkiet. Det er ofte alt det ekstra, men knap så vigtige, som dine brugere kan i din app.
Og her kommer tab baren ind i billedet, som den mest solide navigationsform, der genkendes af stort set alle typer brugere – uanset teknisk niveau, alder og geografi.
Tabbaren: Den synlige navigation
Tab bar kan oversættes til fanebjælke. Det vil sige en bjælke i bunden af appen med et udvalg af faner. Disse faner grupperer en del af din apps indhold, så du går til en ny sektion, hver gang du vælger en fane eller en tab. Brugeren har hermed nem adgang til de vigtigste funktioner i din app, uanset hvor i appen de befinder sig.
Er det vigtigt for dine brugere at kunne navigere hurtigt rundt i din app, så sats derfor på en tab bar placeret i bunden af skærmen. Det har mange apps allerede gjort, herunder LinkedIn og Instagram.
Tab baren fungerer dog bedst, hvis der er tale om uafhængige navigations-hiearkier indenfor de enkelte tabs. Altså bør du undgå krydsnavigation imellem tabs. Har du eksempelvis et dashboard som det første menupunkt, bør du undgå at skabe indhold her, der fører brugeren over i en anden tab. Brugeren skal helst selv aktivt skifte tab og dermed kontekst i appen.
Tab baren kan synes at være den perfekte løsning, men den har også sine udfordringer. Antallet af menupunkter er nemlig begrænset til 3 til 5 – hverken færre eller flere. Det vil altså sige, at tab baren kun fungerer med appens kernefunktionalitet og dermed kun det øverste niveau af navigationens hierarki. De sekundære navigationselementer er der ikke plads til.
For at løse dette problem, kan man vælge at bruge én af menupunkterne i tab baren som en “mere”-knap, der udfolder en større menu med flere navigationsmuligheder. Her skal man dog være opmærksom på, at de elementer der placeres under “mere”, vil være skjulte for brugeren og dermed også blive brugt mindre.
Se eksempelvis hvordan “Øresundsbron” appen succesfuldt gør brug af en “mere”-knap i deres tab bar. Denne leder brugeren hen til Øresundsbrons sekundære navigationselementer: indstillinger, kundeservice og priser.
Placer det vigtigste i bunden
Når det kommer til valg af den primære menutype samt placeringen af samme, kan man blive fristet til at afvige fra de kedelige normer med en mission om at skille sig ud fra mængden. I stedet for at anvende den sikre og velkendte tab bar, begiver man sig måske ud på mere dybt og eksperimenterende vand. Her må man træde varsomt i forhold til, hvad brugerne forventer og er vant til på deres respektive OS platforme. Afviger man for meget, kan der opstå forvirring og frustration over ikke at kunne gennemskue navigationen i appen.
Derudover vil en menu der afviger fra iOS’ og Androids standardfunktionalitet uundgåeligt øge udviklings- og vedligeholdelsesbudgettet, da menuen skal udvikles og testes fra bunden.
Til gengæld er det også vigtigt at eksperimentere og flytte grænser løbende. Men alt med måde.
Læs mere om mobilnavigation
Design er ikke kun en æstetisk grænseflade. Det er i høj grad også navigation. Læs mere om f.eks. tommelfingerzonen, hamburgermenuen og swipes i resten af serien om mobilnavigation af Greener Pastures Senior Designer Lærke Lyhne.