Hoe kies je een hoofdmenu voor je app?

App Design, Bouw je app Fleur 25 feb 2013

Een app maken is keuzes maken. Welke inhoud zet je er in? Hoe gaat je app eruit zien? Een van de belangrijkste keuzes is die voor het hoofdmenu, de navigatie van je app. Wanneer kies je voor welke navigatie?

Navigatiesoorten

Wie zelf een app maakt met AppMachine en kiest voor het basisabonnement, kan grofweg kiezen uit vier soorten navigatie. Omdat de keuze voor een bepaalde menustructuur gevolgen heeft voor je latere ontwerpmogelijkheden, geven we je in dit artikel een overzicht van de soorten navigatie met hun voor- en nadelen. Dit zijn overigens de standaardopties; de veel uitgebreide mogelijkheden van het Designer- en Developerabonnement laten we in dit artikel nog even buiten beschouwing. Hoewel je het menu natuurlijk zo mooi mogelijk wilt maken, moet je de gebruiker niet vergeten. Hoe bied je de informatie aan? Hoe verleid je straks gebruikers van je app om verder te tappen? Houd dat in gedachten als je een menu kiest.
Voor je begint met het bouwen van een app, kijk je eerst naar bestaand materiaal. Heb jij, of heeft de klant waar je voor werkt, een huisstijl en een website? Dan wil je de app en de menustijl daar waarschijnlijk op aan laten sluiten door bijvoorbeeld te kiezen voor groot beeld, of juist alleen voor tekst. Je hebt voor de navigatie van je app de volgende opties:

1. Iconen menu

Met dit menu navigeer je door middel van iconen op je hoofdscherm.
Meestal zal dat een even aantal zijn omdat het er mooi uitziet, maar dat hoeft niet. Zes iconen in twee rijen van drie is een veel gebruikte optie. Het iconenmenu komt vaak voor bij apps en is voor de meeste gebruikers erg herkenbaar.
Door de iconen onderin beeld te plaatsen, houd je volop ruimte voor een mooie visual op je hoofdscherm, zoals je kunt zien in de app van DJ Markus Schulz.
Heb je meer items dan je op het hoofdscherm kwijt kunt? Dan moet de gebruiker swipen naar een volgende pagina. Of je brengt meerdere bouwblokken onder bij één icoon. Zo kun je Facebook en Twitter samen combineren onder één icoon Social Media.
In dit menu moet je rekening houden met de beperkte ruimte voor tekst onder je iconen. Geef je bouwblokken daarom geen erg lange namen. Woorden als Discography of Facebook zijn nog prima, maar een term als De Facebook verhalen van Appie Appstra is te lang om mooi onder een icoon te zetten.

2. Lijst menu

Heb je veel items die je wilt laten zien? Dan is het lijstmenu misschien een optie voor je. Je krijgt, de naam zegt het al, een menu dat bestaat uit een wat langere lijst met onderwerpen. Hiermee kun je meer items kwijt op je hoofdscherm en de namen kunnen langer zijn. Zo zie je in de Watersport app van de provincie Friesland 9 items met termen als Afmeren en aanleggen en Regels op het water. Dit is erg overzichtelijk als je veel bouwblokken en langere namen gebruikt.
Je kunt kiezen of je een lijst wilt met alleen tekst of met icoontjes erbij. Zo heeft de app van het Amsterdam Dance Event alleen tekst in het menu. Zoals je kunt zien, hoef je niet bang te zijn dat alleen tekst er saai uitziet. Je hebt volop mogelijkheden voor je typografie.

3. Image menu

Dit menu bestaat overwegend uit beeld. Dat zijn over het algemeen foto’s, maar kunnen ook illustraties zijn. De app van Hotel Tjaarda is een mooi voorbeeld van een image menu. De grotere foto’s zorgen hier voor een mooie, luxe uitstraling. Je kunt de foto’s schermbreed in een enkele rij plaatsen of in een dubbele rij naast elkaar. Foto’s in dit menu moet je wel redelijk groot gebruiken om ze goed te kunnen zien.

4. Tabbar menu

Hiermee krijg je een menu met, meestal vijf, items onderin je scherm. Die items blijven er altijd staan. Dit is een typische iOS menu dus heel herkenbaar voor wie een iPhone is gewend. Heb je meer dan vijf items? Dan komt de rest op een volgend scherm. Omdat de eerste vijf items altijd onderin je scherm staan, komt de rest op het tweede scherm in een lijstje erboven. De vijf vaste items kosten wat ruimte op je scherm, maar je hebt die menu-items wel continu zichtbaar en beschikbaar.
De app opent altijd met de eerste menuoptie van de vijf. Dat kan een nadeel zijn, maar ook een voordeel. Heb je een app waar nieuwsvoorziening heel belangrijk is? Dan kun je de app altijd laten openen met Nieuws door dat item op de eerste plek te zetten.
Dit menu is minder geschikt voor Android smartphones omdat die hardware knoppen gebruiken onderaan het scherm.

Denk aan de gebruikers van je app

Je kunt dus alle kanten op met je navigatie. Denk er wel aan dat gebruikers van je app de informatie graag zo overzichtelijk mogelijk aangeboden krijgen. Zo worden zij sneller verleid tot verder tappen. Aan de ene kant werkt het prettig als soortgelijke informatie gegroepeerd is, aan de andere kant wil je ook weer niet te veel submenu’s gebruiken. Dan moet een gebruiker te veel moeite doen om bij de informatie te komen. Houd de balans in gedachten. Gelukkig kun je met AppMachine je keuzes altijd direct op je smartphone bekijken én testen.

Zelf je app vormgeven?

Wil je meer mogelijkheden om de navigatie van je app aan te passen? Dat kan met de uitgebreidere opties van het Designer- en Developerabonnement. Zo kun je daar de menu’s tot op de pixel aanpassen. In een later artikel zullen we alle ins en outs hiervan behandelen.

 

Bouw je eigen app

Betalen? Dat hoeft pas als je publiceert in de stores

Probeer nu gratis