How To Design A Mobile App User Interface Like A Pro

While it’s certainly true that mobile apps have come quite a long way in the decade-or-so since Steve Jobs first introduced the iPhone to the world, there is still one important idea that is just as true today as it was in 2007:

The difference between a mobile app user interface and a good mobile app user interface is a significant one, indeed.

In this guide, we will provide an overview of some of the most important principles to follow when designing your own mobile app. This will include a discussion of how you can also not only conceive of and build requirements for designs, but how to then implement those designs and test them moving forward.

Also commonly referred to as heuristics, it’s important to understand that design principles are not necessarily written in stone. Instead, they are loose guidelines that designers can stick to in order to improve the quality of their user interface – all while still allowing room for their own creativity to thrive. They are recommendations, yes, but they are good ones – and ones that will allow you to accelerate your delivery time of a higher quality finished product, as well.

 

1. The Essential UI Design Principles

When taken together, all of the design principles listed below combine to form something much more powerful than any one of them could be on their own – and something that will make your life far, far easier as a UI designer. Collectively, they help remove a lot of the guesswork that normally comes with mobile app design and make interfaces more predictable and, as a result, easier to use for everyone.

 

The most important UI design principles that you should know about include ones like:

• The structure principle. This is the idea that tells us your design choices should always be organized in a purposeful way. Their intent and impact should be clear and everything should be based on the immediate and recognizable needs of end users.
• The simplicity principle. This principle is all about making sure your design is simple, clear, and easy to use. What a button does should be immediately obvious to the user. Common tasks should be grouped together for convenience, etc.
• The visibility principle. This is all about making sure that the core functionality of your app is easily available to end users. Every option that someone needs to perform a task should be front and center, without letting distracting design choices get in the way.
• The feedback principle. This reminds us that designers should always keep end users informed of not only actions or interpretations of functionality, but also states and conditions as well.
• The tolerance principle. This is critical, as it recommends that your design should be every bit as flexible as it is tolerant. By allowing undoing and redoing, you can not only reduce the cost of your initial mistakes – you can also prevent errors whenever possible, too.
• The reuse principle. Finally, this argues for the sake of true consistency – rather than arbitrary consistency. Essentially, the design should reuse internal and external components and behaviors. If you release two apps that include the same feature, that feature should work identically in both instances so that users don’t have to suddenly learn two completely different ways of doing things.

Likewise, testing needs to be done at EACH stage of the user experience design process, provided that you have the time to do so. This means testing not only after thumbnail sketches but also wireframes, high fidelity mockups, prototypes and beyond.

This can be a formal test, sure – but it can also be as simple as asking someone for their opinion. The point is that you test whenever you have the chance to do so as user experience design is all about a delicate balance between A) what you’re trying to do, and B) what the data in front of you is telling you to do.

 

2. “What Are We Actually Building and How Do We Build It?”

Before you ever even think about getting out the sketchbook to mock up some ideas, there are a number of core questions you need to ask yourself.

First, the overall functions of the app need to be based on the answer to the question “what are we building in the first place?” WHY are you designing this app, and what do users need it to be able to do? Every decision you make needs to be dictated by that same core group of people.

It’s a given that your app will have a home screen, for example. But do you need functionality in different languages? Are you dealing with in-app purchases? How can users view content they’ve already purchased easily versus content that they CAN purchase in the future? All of this will be answered by asking yourself “what are we actually building?”

At that point, you can move onto the next most important question – “how do we now build that?”

Again, there is no “one size fits all” approach to this process, but generally speaking you’ll probably use things like:

• Sketching your app on paper.
• Moving those sketches over into a tool to bring them to life in a digital way.
• Onboarding, or getting users to buy into your functionality in the first place.
• Creating a brand style guide for your clients that includes the look and the voice of the app, to make sure that branding is consistent across all channels.

Once you’ve done all this, you can get to work on testing – which is where tools like Sketch and Invision come in handy. Remember that a mobile app user interface needs to do more than just LOOK nice. It needs to be easy to use and enjoyable to engage with. If you don’t test your decision choices based on these core criteria, rest assured that you’re probably going to be making some bad ones along the way.

 

In the End

At that point, a large part of the “hard work” has already been done. You’ve thoughtfully designed, tested and have begun to build that mobile app user design and you’ve mitigated a lot of mistakes along the way. Success moving forward is all about falling back on some of the “tried but true” principles of mobile app design, like:

• Always using right-size graphics.
• Guaranteeing the most responsive design possible.
• Iterating as much as you can.
• Using colors in a smart, thoughtful way.
• Embracing clear typography.
• Beta testing with real users.
• And more.

But above all else, never forget that everything you’re doing is in service of one core group of people: your end users. It’s ALL about the end users, and whatever they’re telling you is something you should listen to – even if it is at odds with your own intentions or even your instincts. Your users have opinions – it is absolutely in your best interest to listen to them. Provided that you’re willing to do that, rest assured you will go far.