This article will guide you through the best practices for designing a user-friendly navigation bar.
A good navigation bar will put the most important sections of the app at the users' fingertips, and facilitate navigating through the app.
More information on how to edit the navigation bar is available in the Building the app menu and navigation bar article.
Requirements
- You can pick any three items from the app menu to appear in the navigation bar.
- Home is always present, together with More.
- Icon colors are controlled by the app theme and can have only one color.
Important: When an app menu item is added to the navigation bar, it will automatically be removed from the app menu in the mobile app, to avoid duplicating buttons between the navigation bar and the app menu.
Best practices
Identify often used sections
Do Place often used sections of the app that will stay important during the whole event/workspace lifetime. |
Don't Don't place items that are used only once or only during specific timeframe (ex. "Voting"). Use home or notifications for that. |
Use short call-to-action labels
Do Labels should be short and descriptive. Use nouns that describe the section or the type of information users will interact with. |
Don't Long labels might not fit all screens and all platforms, and are not any more descriptive than a single noun. Avoid describing activities or specific functions. |
Use contrasting colors
Do Use vibrant and contrasting colors to highlight selected section, helping users orient themselves in the app. Ideally match the title bar of the app or another color of your brand if navigation bar is monochrome. |
Don't Dark or washed-out colors are not well distinguishable on small icons and text. |
Don't swap items around
|
Do Keep items the same during your event/workspace's lifetime. |
Don't Changing items or targeting them based on dynamic properties while users are using the app will force them to re-learn how to navigate them app. |
Comments
0 comments
Please sign in to leave a comment.