If you have a lot of features in mind for your app, making sure it delivers everything while still being easy to use is a challenge you’ll have to solve.
On mobile, the obvious limitation is that you always have to make everything fit nicely onto a small screen. But simply doing that isn’t enough.
To deliver a user-friendly experience on smartphones and even tablets, you have to be able to create an interface that looks clean, uncluttered, but still delivers the level of detail and functionality you need it too.
Unfortunately, this is where a lot of developers fail.
There’s a difference between making software mobile-friendly and making it user-friendly.
If everything fits and works within the boundaries of a smartphone’s screen, then it’s mobile-friendly.
For it to be user-friendly, it also has to be easy to use and to work smoothly without ever causing confusion or frustration.
…and making sure you’re creating a user-friendly app is important, because this affects user retention most of all. So how do you do that without sacrificing important features?
We’ll take a look at Ribbet, one of our recent case studies, and explain what steps we took to do that.
Ribbet is a comprehensive photo editing app that needs to deliver a lot of functions, filters and editing tools, all while keeping the interface clean and easy to use. At the end of the day, most of the screen space has to showcase the user’s image.
Step 1: Creating the user journey.
The first step for us is always to understand and define exactly how our target users will be using the app.
Let’s say you have 100 different tools you want to give people access to. You obviously can’t throw all of them on the screen at once. The question is, at which point will they be interested in each one?
With Ribbet, one of the first things we did to address that question was to decide how tools should be grouped together into separate categories.
At every point in the user’s journey, they would need to have access to the tools that were relevant to them at that exact point. Tapping on a category opened up a relevant set of tools. Selecting one of those tools opened up yet another set of variables useful in that particular instance.
This can all sound very obvious but it’s really important to get it right. Giving users irrelevant options at a time when they don’t need them can quickly make the entire interface feel confusing.
It means they’ll need to search for the option they’re looking for in menus where they wouldn’t expect to find it. For this reason, it really pays to take the time to understand how users will be navigating through your app and what they’ll be looking for on each screen.
Things like user testing, open betas and customers surveys have been playing an increasingly important role in app development precisely for this reason.
Step 2: Adding contextual interactions.
Going back to our project, once we had all of the navigational elements sorted out, we had to decide how we’ll give users access to the different tools in each group without cluttering the screen.
By using gestures instead of menus and toolbars, we were able to add entirely new streams of choices without using any extra visual space on the screen.
The user could simply hold and swipe back and forth to open up and search through their list of options. Once releasing, the option they chose would be selected, and the menu, no longer being necessary, disappeared from sight.
Step 3: Minding common conventions.
When designing for mobile, some things are better left unchanged.
Whatever other choices we make, keeping mobile design best practices in mind as we go is always a constant.
People are used to certain conventions and navigational items being similar across apps.
If you’ve used both Apple and Android phones you will have noticed a difference in how their menus, top bars and other navigational elements are typically positioned.
Those conventions, particular to their platform, are found in most apps, regardless of who developed them or for what purpose.
That’s because when people get used to having things a certain way, changing those general concepts often confuses and irritates them. Nobody wants to do that.
This doesn’t only apply to apps. In gaming, suppose you own a PS4 and in all of your shooter games, the trigger is always the button you have on the right side of the joystick.
Every now and then, you’ll stumble across a game where this is different, and that’s just the type of thing that gets gamers frustrated. They instinctively expect the button on the right to be the trigger.
In the music industry, almost all songs, no matter the genre, respect a particular beat (tempo/pace). This way, no matter the type of song or how different the lyrics or the artist is, people will still know how to dance to it. That’s because the rhythm itself stays the same. What happens when you’re trying to dance and a dubstep song comes on? Most people get annoyed.
Going back to apps, the point is that conventions help users familiarize themselves with an interface more easily – even immediately.
Step 4: Balancing priorities.
In the end, the fact is that optimizations and design can really only take you so far. Realistically speaking, it’s natural to assume that you’ll still have some limitations when developing for mobile platforms. This is where it’s important to list your priorities and make sure that all of the must-have features are there from the beginning.
Here, the key is to gain a good understanding of what your users will care about most, and prioritize those features first. How do you do that? Test, survey, and open up to betas.
Step 5: Testing and iterating.
Whether through a specialized team of QA engineers, user testers or both, it’s important to test your app while it’s in development – and test often.
For one thing, this helps to ensure that everything’s polished and working well ahead of the final submission. It’s also a way to determine whether or not everything is as clear and easy to use in reality, as it appeared to be in the concept phase. And if that’s not the case (it often isn’t right away), it’s important to keep an open mind and make changes as needed.
To sum things up, when you’re designing apps for mobile devices, the top lessons you should keep in mind are:
- It’s important to plan in advance, create your user journeys and set priorities;
- You can use common conventions to help users familiarize themselves with your product more quickly;
- You can use more than just menus and buttons to add features – think about what other user interactions would make sense at any given step in the user journey;
- Finally, remember to test, and test often!