6 Predictions for Mobile UX Design Trends in 2017

Creating a suitable user experience can be the difference between a good app and a great app, so it’s helpful to consider how and why designers set, and follow, particular trends. We take a look back at how mobile UX design evolved in 2016 and formulate six predictions for 2017.

Apps 2.0 – are we there yet?

Almost immediately after the coming of age of the mobile app (and ever since) we’ve heard media commentators say: “Apps are dead, the web is the future”.

But the app market keeps growing and even Google, who has a clear vested interest in making mobile apps part of the web, still hasn’t succeeded. And the reasons why are plentiful – every critic, developer and designer will tell you their own. One thing is clear, whether it is because apps are easier and more convenient to access, or because the native experience is more wholesome, or because they create better user journeys, apps aren’t going anywhere but up this year.

The question, for us, is whether apps will evolve in 2017. Will this be the year when we see a breakthrough in the app experience? The first thing we did while we were thinking about this is to look back at 2016. Where are the big changes? What are the big guys like Facebook, LinkedIn, Instagram, What’sApp — what are they doing with their interface?

Like us, we’re sure a lot of other people in the industry look to these guys looking for an app UX revolution (Apps 2.0!), but we were a bit underwhelmed by what we saw. Let’s have a look.

LinkedIn

mobile ux design

LinkedIn launched their new app, codenamed “Voyager” in late 2015. Ever since it hasn’t changed.

The Android and iOS versions are different but there’s nothing original to be found here: tabbed navigation – at the bottom on iOS and on the top for Android, following native standards; three lines of navigation on iOS and two on Android; a hamburger menu that’s really just an ad for other LinkedIn apps.; swiping between tabs.

Nothing groundbreaking here. Moving along.

YouTube

mobile ux design

In 2015 YouTube redesigned their app with minimalistic navigation and caused a little revolt.

In November 2016, a new update came through for iOS devices that made it less minimalistic. It added more items to the navigation and moved it to the bottom (for easier reach, although you can also swipe between tabs). The Android version retains the top tabbed navigation but rumors say it will be moved to the bottom as well sometime soon.

Is it a new generation of an app? Not really.

Instagram

mobile ux design

In May 2016, Instagram unveiled their rather major rebrand, including a change to their iconic vintage camera logo for a more minimal, modern design.

It wasn’t just the logo which underwent a series of changes, with the interface and design being altered, ‘stories’ being added to the feed and search sections, and direct messaging having a more prominent role on the home screen. All said and done, it remains effectively the same app, using similar features to their rivals (Snapchat and Messenger).

It’s fair to say their “major” rebrand and adjustments were rather tame in terms of functionality and design.

So what happened in 2016?

Organic growth.

The big app brands didn’t try to reinvent the wheel with their UX, much less try to revamp anything entirely. What we’re seeing is a gradual unification of standards: material design has gone mainstream, cards and scrolling are now well accepted amongst users, and, importantly, it feels like adhering to users’ expectations is playing a huge role in new developments. This is nothing to be alarmed at or disappointed with, it is technological maturity.

What will happen in 2017?

More organic growth.

We’ll see the app experience mature even more and become better at satisfying users’ needs, but also their expectations. We’ve selected six UX trends that we think will play a part in this. It’s not quite Apps 2.0 yet, but it’s still exciting and will make a difference to users.

Our predictions for mobile UX design in 2017

1. Micro Mini Interactions

mobile ux design

Example of micro-interaction in the format of a menu. Source.

mobile ux design

Example of micro-interaction in the format of a menu. Source.

We’ve seen micro-interactions (interactions within interactions) coming into play for a couple of years now when the Google Material design guidelines showcased a correct and incorrect use of animations and movement. Apple has also started making use of these through haptic feedback, but their potential is yet to be exploited in 2017.

This trend is all about making every single user interaction (touch, scrolls, taps, clicks and pinches — among new ones to come) rich with unique feedback to enhance the user experience:  vibration, sound, animation and/or movement.

Here’s an example:

  • A micro interaction would be to unlock your phone by pressing the home button.
  • A micro mini interaction would be too hard tap the home button, which is immediately followed by vibrating feedback and a home screen reveal animation.

We expect micro interaction to spread largely due to Google Material Design in the next 12 months, along with Apple who has already integrated a new haptic system into the iPhone 7 on iOS 10.

2. Design that lets the content shine

mobile ux design

Facebook Instant Articles use a simple and fluid design/navigation system. Source: https://mediatemple.net/blog/tips/wordpress-apple-news-instant-articles-amp/

mobile ux design

Medium is the epitome of a blog design that lets the content shine. Source: https://www.minterest.org/best-blogging-and-publishing-platforms/

Web (and app) design has gone through many stages: From skeuomorphic (trying to reference or mimic the real world to make interaction easier – you probably remember the days when icons were 3D and there were gradients everywhere) – all the way to the flat and material design of the present day.

During this journey, designers have realised that “design’s ultimate role is to present content in an intuitive, efficient, and delightful way” (in the words of Sergie Magdalin, Chief Design Officer at Webflow.)

But how do you put content first and make design “flatter”?

  • Minimalism – aesthetics add to the experience but don’t distract from it.
  • Spacing – let content breathe, help the eye move along the page through blank spaces
  • Simplicity – apps that are simple are clearer and easier to use
  • Declutter – remove excessive bars and repetitive elements

3. Innovative new ways of navigation

If you paid attention at the LinkedIn, YouTube and Instagram screenshots at the beginning you will have noticed that the biggest changes in mainstream apps have happened within the navigation. Most daily-use apps have moved to a tabbed approach, and the hamburger or home icon is taking a secondary role.

On the topic of the hamburger icon, many conversations have continued this year about it. James Archer, VP of Sales & Marketing at Crowd Favorite & UX Expert, said: “As the year goes on, we’ll start to see the hamburgers being methodically replaced with tab bars, Priority+ menus, and other alternative forms of navigation.

mobile ux design

Facebook put its hamburger menu in a secondary position, and Spotify eliminated it.

One method of navigation that’s emerging and we’ll see more of in 2017 is flicking/swiping. Snapchat, YouTube and iMessenger have kickstarted this but designers might need to wait for users to catch on. It’s also a challenge because users can only navigate 4 directions from each screen, and therefore it is only applicable to commonly used apps.

Although new and exciting ways of navigation may emerge with the most popular mainstream apps, we think standard apps like those for work purposes will continue to have slide-in sidebars, since people don’t use them enough to remember a different approach.

4. Bottom navigation used more sparingly

In March 2016 Google added bottom navigation guidance to its Material Design guide, so it’s certain we’ll see a resurgence. But such a resurgence will also include many examples of bad practice, as the bottom navigation’s purpose is often misunderstood.

mobile ux design

This example of a material design app uses bottom navigation that gets out of the way on scrolling. Source.

Liam Spradlin, from Android Police, put it simply: “The bar is meant for an app that has 3 to 5 top level destinations […] that must be immediately accessible from one another. Narrowing it down further, these destinations should be of equal importance.”

And then he goes on to clarify:

“The bottom nav bar is not for FOMO (fear of missing out). [It] is not a catch-all solution for making sure users don’t miss out on something. Call me optimistic, but I believe it’s completely possible to craft a flow that leads users to organic discovery of important features, and this kind of discovery can even be helpful to the user’s overall experience.”

So for 2017 we predict that designers will strive to create journeys of discovery, as opposed to trying to lock features into navigation drawers or tabs.

5. Long screens

Slowly designers are becoming less afraid of long pages that encourage scrolling, and this is especially true for mobile apps. Users are now fully comfortable with scrolling, and collapsing/expanding animations are enhancing the experience too (remember micro mini interactions?)

mobile ux design

This train app prototype takes advantage of natural expanding motions to display more information. Source.

Jamie Leeson, from CreativeBloq, explains:

“The long-scroll is a great mechanic to implement when seeking to tell a narrative, or structure content in a linear way to guide the user.” It’s great for “immersive, seamless, long-form content which allows users to consume it in a fluid manner, irrespective of the device they’re using.”

At Fliplet we work with enterprise clients and keep a keen eye on enterprise apps, and we think the long screen trend is yet to meet its potential in that sector.

Long screens are naturally suited for many corporate experiences like brand storytelling, but they’re also great for reporting, training, comparative content, tables and other formats that are popular in the enterprise.

6. Bold colors, gradients, shade, illustration

Flat design, the trend that’s been prevalent in web design for the last few years, promoted simplicity to the core – muted colors, vector icons and square angles. But 2016 saw some bold designers adding a little extra to enhance the experience.

mobile ux design

Featured in this prototype: a bold color palette, gradients and a lightly shaded button. Source,

In 2017 we’ll see more of these innovative apps that break free of some of the usual flat design rules by using light shading, bolder colors, angular shapes and gradients.

Another trend we love is an increase in brands using custom, quirky illustration as a way from breaking away from the overused stock vector icon. Brands like Intercom, BrewDog, Dropbox, Citymapper and Uber are doing this successfully.

Interested in these trends?

You can check out more information gradients, bold colors and interesting palettes, shade (Flat Design 2.0), or illustrations.

You can check out what you could create for your organization using Fliplet by having a look at our App Gallery, which showcases our app types and features.