Monday, February 3, 2020

Mobile Design Trends: Navigation

Okay, so you’ve revamped your mobile strategy and need to know how to build an app or a mobile experience on the web. Where do you begin? No matter if you’re building a native mobile app, mobile website, or a Progressive Web App (PWA), there are a lot of things to be mindful of when it comes to designing your mobile experience. Yes, cool features and a sleek design are some of the first things that come to mind, but without intuitive navigation, your mobile experience will be rendered useless. Don’t fear! Here are some navigation trends you should be on the lookout for when designing your next mobile experience.

Make It Simple

Less is more when it comes to mobile navigation. People don’t want to be overloaded when searching for information. In fact, 29 percent of people will abandon a site or app if they can’t find what they are looking for or it requires too many steps. If you really want to wow your users, take a note from the Lancome PWA. By leaving breadcrumbs in the navigation, shoppers can easily see what category the product they are viewing is in, without leaving the page.

Tuck It Away

We are constantly bombarded with pop-ups suggesting that we download someone’s mobile app…which can be annoying. And marketers know you shouldn’t measure the effectiveness of your mobile strategy by just downloads alone. So let’s stop making our CTA for users to download our mobile apps the main thing on the web page! Consider having collapsible navigation that calls out your mobile app like Chipotle did on their mobile website.

Keep It Close to Home

Don’t you hate it when you accidentally exit out of a web page you didn’t intend to leave? Well, if you’re designing a mobile experience, don’t intentionally drive your users away from the page they really want to be on: the home screen! Layered actions keep users on the homepage while having a bottom sheet appear over the screen. eCommerce brands can take advantage of this new trend to simplify their checkout process. A layered action appears when consumers are ready to purchase; if the shopper is a repeat customer then their shipping address and payment method will be prepopulated so they don’t have to walk through multiple steps and potentially abandon their cart.

More Pins, Less Nav

If you haven’t noticed, phones are getting bigger, but our thumbs aren’t. That’s why having a hamburger menu at the top of the screen may not be the best approach anymore. It’s out of reach and adds extra steps that users don’t want to take. Enter tab layouts. While tab layouts isn’t a new concept, it’s gaining popularity with app builders to simplify navigation. When designing a tab layout, keep in mind to limit the number of tabs to avoid looking overcrowded. Pinterest is a prime example of utilizing tab layouts. Not only is the tab layout located near the bottom in the “safe zone” for reachability, but it only displays four pages that users commonly use. Bonus points for having it disappear while scrolling.

Navigation can make or break your mobile experience. Make it clear and intuitive for users so they can find exactly what they’re looking for. Interested in learning more about mobile trends? Download our Mobile Design Swipe File to spark your mobile mindset!