5 Signs Your Product Has Outgrown Its UX: Cargo Pants

By on January 11, 2019 12:20 pm

“Do you have everything you need?” You’ve probably been asked this a few times in your life. And if you were wearing cargo pants at the time, you definitely said “yes” in response. Because with all of those pockets, how could you not have everything you need?!

This post is a continuation of our “5 Signs Your Product Has Outgrown Its UX” series. If you haven’t already, you might want to start at the beginning with “Does This Make My App Look Fat?”

As product owners, designers, and developers, we talk a lot about the user “having everything they need.” We’d like to outfit them with some nice canvas cargo pants covered with zippers, pockets, secret compartments—maybe even a hammer loop!

Our intent is that the user has plenty of options while using our product. Sounds noble enough, right? In the world of enterprise software however, this will eventually become a doomed mission. Enterprise apps have so much complexity that those cargo pants will soon be nothing but pockets. All of those options will confuse the user; they’ll just end up using them for tater tots.

Almost every enterprise-grade application reaches this point of scale. And usually, the original designs don’t provide guidance to handle the issue. That’s why this is one of the most common signs of an outgrown UX that we see when working with our clients.

Previously, we talked about how hidden navigation can be a bad decision for your app’s navigation. You really should display the choices to the end user. That’s great in theory, but what if your team just keeps putting more and more tabs on the menu? Tweaking the design and layout is only going to get you so far. What if you still need more space to accommodate your growing navigation?

Too many to fit? Not a problem, we’ll just wrap them to the next line! (No, don’t actually do this)

Why This is a Problem

This method avoids the problems of discoverability and engagement that come with hidden navigation patterns. But all the same, too many tabs and options comes with its own set of issues that can’t be ignored.

Choice Overload

There’s a concept in psychology called “Overchoice.” In essence, it is the phenomenon of someone being unable to make a decision when presented with too many options. It becomes too difficult to weigh and compare the options to one another. This effect is especially strong when many of the options are similar.

Now, most of the time your users aren’t making choices when they use your app. They know what features they need to use and where they need to go. But they are deciding how to get there. If they are presented with too many avenues and options, it will quickly lead to a frustrating and unfriendly experience. They may not be able to articulate why your app is hard to use, but that won’t stop them from damaging your Net Promoter Score.

Screen Real Estate

Screen size is one of the biggest constraints in UX design. Perhaps the most obvious problem with too many options is that your cumbersome navigation will quickly eat up that valuable screen real estate.

What’s more, all of that navigation repeats on every single page. What’s more, all of that navigation repeats on every single page. What’s more, all of that navigation… you get the idea. People aren’t using your app for the navigation; they are using it for the content and utility it provides. Repeating large amounts of UI is a waste of space to the end user. Try to give the content as much room as possible.

Solutions

You don’t have to be a UX genius to see how this can start getting out of hand. At some point, enough is enough. Otherwise your navigation will continue to grow and take over the other content of the app. But you still need to add navigation that’s visible and descriptive, so what do you do?

Rework Your Information Architecture

The first thing to consider when approaching this scale of navigation is your app’s information architecture (IA). IA is the structure of how the application is organized, something akin to a sitemap. Look at the application and ask “Does this organization still make sense?” You might be surprised that your original structure has shifted out of balance. Many times by introducing new layers in the IA or by changing the hierarchy, your app can grow in an organic and natural process without a redesign.

Spotify is a recent example of how reworking an IA can facilitate a growing UX. Over time, they have been adding features that make it easier to discover music that is recommended to you. Much of this has been in the form of playlists organized under the “Your Library” section of the app. As they released these new playlists, they began just tacking them on to the navigation.

Had this only been one or two additions, the design would have scaled just fine. But Spotify had no intention to limit the personally curated content of the library. And the issue was compounded when they released other features like Podcasts and Videos. They couldn’t just keep adding more and more options to the menu. Instead, they reassessed the app’s IA and introduced a new menu item, “Made For You,” that would house the curated content. This allows that portion of the app to continue to scale without impacting the core UX of the Library.

Landing Screens, Breadcrumbs, and Back Buttons

Another option to consider is to impose a more tunneled approach to your UX. Some times users don’t really need to easily jump laterally through the app. This is usually the case in apps where the user has extremely specific tasks they want to perform quickly.

When this is the case, you can present the user with a landing screen that contains anything they need in a clear, well-organized format. From here, the user can dive into the particular feature they need, and be unencumbered by the rest of the app’s functionality. Just provide them an easy way to get back to that landing page if they do have more than one task to perform.

Helping the user find their way back home is pretty simple if you utilize two widely adopted UX patterns: Breadcrumbs, and a back button. Breadcrumbs are a nice way to imply context to the user, reminding them how they got to the screen they are on. They are also a great way for the user to quickly jump back to any point in the process. A back button can be a familiar part of the UI that will always help the user retrace their steps, even when you don’t have the room to display a breadcrumb path.

If you need an example of this, you need not look further than your phone. Out of necessity, mobile design has embraced this tunneled pattern. If I need to adjust my Airdrop settings on iOS, for example, I can get there by following a very specific line of taps. Chances are, that’s what I opened up the Settings app to do and will probably quickly make the change and then close the app. But if I need to make other changes, I’ve got a nice path back to where I started in the navigation bar.

Splitting Up Your Application

But there is still a third option. This is the big one, not to be taken lightly. If your app has scaled so far that there’s menus, menus inside of menus, and still more menus within those. If the features of the application have started to take on their own unique users and challenges. Well, it might be time to start talking about breaking up the app.

Keep in mind, this really should be a conversation to be had with all stake holders of the product, and will likely only be necessary for the largest of applications. But it cannot be overlooked as an option that may need to be considered when things have scaled beyond imagination. This will not be an easy process (nor should it!), and you’ll need to plan for dedicated UX resources to help facilitate the transition. But after the app has been segmented, those individual applications will be free to expand their UX in their own needed ways independent of the rest of the suite.

Lose the Pockets

Nearly every application grows to this level at some point in its lifecycle. So don’t be surprised when you look down and realize you’ve been wearing those cargo pants for weeks without realizing it. All of those options will feel useful at first, but don’t let things get out of control. And if you need a little help getting rid of those pockets, let’s talk. Chances are, we’ve got some nice five-pocket jeans your app would look great in.

Other Posts in this Series

Does My App Look Fat? – Introduction to the series
Little Black Dress – Hidden Navigation

Follow SitePen for more articles just like this
TwitterFacebookLinkedIn


Need help improving the design of your application?