Planning Your App's Navigation and Calls To Action

When planning your app's navigation, prioritize your main call to action (CTA) on the home screen. Include essential elements guiding users to primary functions. Use the bottom bar for high-priority, frequently used actions and the top bar for secondary navigation items like search or the notification inbox. Place user preferences and account options on the "Settings" screen, and additional features or less frequently accessed items on a "more" screen.

The Home Screen

The home screen is an ideal place to let users know what your app can do. While it's tempting to fill this screen with your brand and graphics, it’s essential to remember not to overwhelm your users. Your main call to action should be presented clearly and concisely.

The Top Header Bar

On custom widget screens, it is recommended to limit the top bar to two icon items for features or actions to avoid overcrowding and overwhelming the user. Most apps follow this practice to keep pages focused, which aligns with user expectations for your app. However, three icons can be configured if the actions are of similar importance and relevant to the specific screen's content, as custom widget screens do not support header titles. Please note that this only applies to custom widget screens, as native app screens like Schedule cannot be customized.

The Bottom Bar

The bottom bar is where users will find and navigate to high-priority, frequently used actions in your app. The navigation should be kept familiar with other app patterns by displaying frequently used and more important content as your leading items while placing secondary and less interacted content such as additional event information near the end of the bottom bar tabs.

Primary Content/Information

  • Home
  • Map
  • Schedule
  • Artists
  • Rewards
  • Tickets

Secondary Content/Information

  • FAQ
  • Info
  • More
  • Settings

Match the icons to the content, and use colors with good contrast, as the text on the bottom bar is some of the smallest in the app; therefore, it is vital that your users can read it.

The More Screen

The “More” screen can be used to inform your attendees of your event’s rules and guidelines, as well as redirect them to other important event information such as FAQs and Support channels. It is also a good place to host user’s personal content such as their tickets, photos, rewards, etc.

 

Most of the widget placements on the “More” screen have been streamlined to enhance your setup process. Use the “More” screen to link your users to secondary information, but ensure that only necessary content is included to avoid overwhelming users. If you prefer, the “More” screen can also be linked via a topbar icon to leave the last navigation bar item for a more important item.

Key Takeaways

  • When designing app navigation, prioritize placing the main call to action (CTA) on the home screen while ensuring it remains clear and uncluttered.
  • Use the bottom bar for high-priority, frequently accessed actions, and reserve the top bar for secondary features like search or notifications.
  • Limit icons on custom widget screens to two or three to avoid overwhelming users.
  • The bottom bar should follow familiar navigation patterns, with key items such as "Home," "Map," and "Schedule" appearing first, and secondary content like "FAQ" and "Settings" near the end.
  • The "More" or “Settings” screen is ideal for less frequently accessed information, event rules, FAQs, and personal content.

Next article: Planning for Cohesive Design and Branding Between App and Activations