When designing a mobile app, business decision-makers and development teams have a number of considerations to make. These can include the development language that will be used, the overall color scheme as well as the content and images that will be included. One of the most important factors here, however, is the app’s ease of navigation.
According to 2015 research, today’s users tend to prefer mobile apps as opposed to accessing websites via a mobile browser. In fact, TechCrunch reported that smartphone owners spend 85 percent of the time utilizing native applications on their devices. However, many designers and developers might overlook the considerable importance navigation plays.
The journey users take through an app’s menu and features to find the information or capability they are looking for is critical. Let’s examine a few considerations businesses should make with their app’s navigation, and how these can make or break its success:
One of the first items to examine with mobile app navigation is the icons being utilized in the app’s menu. For the most part, iconography offers the easiest way for the end user to find the information he’s looking for, but designers need to be aware of the impact of culture components and choose icons with the app’s specific target audience in mind.
Icons should be chosen wisely and always taking the user’s context into consideration as well as common uses. For example, working on a “Contact Us” page, an envelope icon usually means a “send an email” functionality.
Also, icons need to be consistent with company branding, and be placed in an easily-discoverable position. Once icons have been designed, the team should test to ensure that they make sense to users and convey the right meaning.
Minimum size and distance
Another element to consider is the size and distance of icons and other navigation controls. It’s important that menu items and navigation features are displayed large enough so that they can be clearly read and tap by the user. Every app should have its own guideline and it’s the designer’s job to create it, but professionals can make use of the good practices of every Operating System following Google’s Material Design Guidelines and iOS Human Interface Guidelines.
In addition, navigation features should also be arranged with consistent space between them. Overcrowding of these elements could lessen the user’s ability to discern between navigation options, making it difficult for them to find the information or features they’re looking for.
DesignModo also suggested ensuring that the navigation menu is displayed throughout the app, on every view. For this reason, it’s important that size and distance remains consistent on every page of the app.
Designers should also ensure that navigation transitions are the same across the application. This not only helps to keep things organized, but also ensures that users know where to look when they’re ready to move to the next page or feature. Once an user learns how to use an app, he’s gonna be waiting the same behaviour on every page. If it’s the case that when browsing the app pages show up from right to left, every time he visits a new page he’ll be waiting for that exact transition (right to left) and vice-versa.
“Make transitions between selections obvious and easy with the swipe of a finger,” DesignModo suggested. “Make transitions between overview and detail states seamless.”
Here’s an example of Google Inbox’s navigation:
Google Inbox – Done Tooltip
Navigation patterns: Android vs iOS
When examining navigation, it’s essential to take into account the differences between the operating systems consumers will be using. One of the biggest defining characteristics of the iOS and Android platforms is their devices navigation capabilities. On one hand iOS devices only have one main button, while Android devices also offer “back” and “options” buttons as well. For that reason, when designing for iOS, it’s important to keep in mind that we’ll need to offer a way for people to go back directly from within the app.
Speaking of the different menu options, Chris O’Sullivan points out that “The primary navigation pattern on Android is a drawer menu. Android users naturally go to this for menu items, and it tends to be omnipresent throughout the experience”. Apple’s guidelines are more in favor of a tab bar, which is located at the bottom of the screen, and allows easy access to the top level areas of the app.
When designing apps for multiple OS, I always prefer creating two separate navigation menus – one for Android users and one for iOS users. This way, the navigation capabilities will be aligned with the design of each individual operating system.
Bonus: 3D Touch Navigation
Recently, an increasing number of applications have begun supporting 3D navigation. This will no doubt become more popular, particularly with the introduction of Apple’s 3D Touch feature on its iPhone 6s device and Samsung adding it to its S7 in 2016.
3D touch navigation brings a whole host of new considerations to the table. Designers must ensure that the capabilities being provided here align with the spacial features of the application. On the iPhone 6s and iPhone 6s Plus, the 3D Touch function calls up secondary actions, information, and other content when the glass is pressed more forcefully. Apple calls some of these tools Peek and Pop. For example, a 3D Touch of the iMessage icon lets you initiate a new message or respond to recently received messages. Designers need to keep this new feature in mind to come up with clever ways of using the 3D touch in their apps.
Planning seamless, easy-to-use navigation within a mobile application requires a number of considerations, including the icons, size and distance of menu items, as well as transitions and operating system differences. However, when these items are taken into account, the business can create a successful app that supports the best possible user experience.