User Interface Design Principles That Make Users Happy

 

These days, there’s nothing more annoying than a bad user experience on an app. Think of it this way. An app can have the most informative content in the world. But if it’s hard to find the content you need, would you ever use the app?

Apps are supposed to make our lives easier – so it should be easy to use them. User interface design has evolved tremendously over the last few years, and there are a few key principles of modern UI design that can make a huge difference in user experience and conversion. Here’s a quick overview of good UI and how to make it happen.


Good user interface design: The difference between a good UI and a bad UI

For example, think about some of the more popular games available on the app store. Often, the concept of the game isn’t revolutionary. But they’re incredibly easy to play – and that’s the sign of a good user interface. It’s a smartly designed UX and UI that makes a viral game simple and entertaining. Users don’t flock to games – they flock to a good user interface.

The relationship between UX and UI in mobile apps is unique. When it comes to apps, user interface and user experience (usually just referred to as UI and UX) are really the same thing. In a good UI, function and form come together, but function is almost more important with apps.

There are several hallmarks of a good UI. I’ve found that a good UI boils down to these three principles of user interface design.

 

1. Stay simplistic

When it comes to UI design, keep it simple. As I mentioned above, if you ever have to choose between design and function, choose function. Every time. Unnecessary design has no place on an app – there just isn’t enough screen space to spare. Just keep it clean and simple.

 

2. Employ flat design

This goes hand in hand with staying simplistic. Especially on small screens, flat design will give you a clean UI with clear next steps for users. A good example of this is with calls to action.  Think of using icons instead of photography or complex graphics, solid colors instead of gradients, and other visual details that aren’t imperative to communicating your message.

 

3. Use a graph or an icon to display complex information

If you have a paragraph of information, see how you can show that same information visually. If the screen is still crowded, let users tap on the graph for more details. Typically the less taps the better, but in this case, a few extra taps won’t hurt anything if it cleans up the interface. 


Put it into practice: what modern UI design principles look like

Of course, a good UI is much more than staying simple, flat design, and using graphs and icons to convey complex info. And it’s more than choosing function over form. Here’s what those user interface design principles look like out in the wild.

 

Keep branding to a minimum

Branding on a website is one thing. But on an app, it’s a different story. You only have so much real estate, so with any element that doesn’t contribute to a user flow – i.e. branding – it’s best to err on the minimalistic side.

 

Use photography sparingly

Most apps today don’t use a lot of photography. There are fewer bitmap graphics in general. However there are more SVGs and other small graphics. If there is an image, it should contribute to the user experience or flow of the app.

 

Streamline content

It’s officially time to get over the “above the fold” mentality on mobile. Too much content jammed into that small area is bad for user experience. To put it simply, if you open an app on your phone and you’re overwhelmed with what you see, what do you do? Do you take the time to hunt around for what you need, pressing 8 links you didn’t want to in the process? Or do you just close it and download a different app?

 

Don’t rely on menus for navigation

We’ve all seen the hamburger menus – it’s a popular UI decision on mobile. And if you’re going to have a menu, absolutely use them. But think through your logical user flow first. If you rely on the hamburger menu without linking to appropriate pages in context, your users will be lost. Think: If you don’t want to go to the hamburger menu all the time, your users won’t either. Linking to relevant pages in context simplifies the user flow and creates a better user experience.

 

Keep file size small

There are lots of people using devices that have a total storage of 16gb or less – so any app needs to be pretty compelling to allot some of that valuable space. There is no strict rule of thumb on the maximum size. Just think: What’s compelling users to give space to your app? What makes it valuable? Does it take up too much space for them to keep?

 

Don’t set it so the back button logs you out without warning

Maybe this is just a pet peeve of mine, but when I hit the back button of an app, I expect to go to the previous screen. What I don’t expect is to have to log in again. As a user I expect to only have to log in once – not on every screen, and definitely not if I have to go backwards a bit. Don’t have the back button log you out without warning you.

 

Apps aren’t meant to be difficult to navigate – they’re meant to be simple. Keep your UI as simple and as clean as possible. Your users will thank you. (Well they might not thank you, but they won’t leave nasty reviews. That’s as good as a thank you, right?)

 
design, technologyMichael Kritsch