How To Design Beautiful Mobile Apps

“You can’t just shoehorn desktop into mobile – less is more. You have to focus on the key features, and that simplicity is great. With a mobile display you’re limited with what you can show, which forces you to think about what is most important.”

– Arash Hadipanah, Rue La La’s Senior Mobile Product Manager

design

Image Source: Flickr, user: Yutaka Tsutano

Hey first-time developers! Designing a mobile app can be overwhelming. Luckily, there are a handful of essential design secrets that will help you create beautiful and intuitive apps. Discover them below and get coding.

1. Know the basics

Before you begin, jot down a few basics goals: your target demographic, their technical abilities, what the app will deliver, its capabilities, etc. Having a clear understanding of your problems and solutions will ensure you adhere to proper design protocol.

2. Map your app

Create a wireframe. This is your blueprint to navigation. When designing the wireframe, keep your app layout minimal by reducing pages. There’s been a raging debate about the “three-click rule” (in which users leave a site when unable to find the desired information in three clicks). While this isn’t necessarily true, it’s a good idea to limit page offshoots from the home screen and keep navigation simple. This way, users will memorize mental maps of your app that they can recall even after they’ve spent significant time logged out.

3. Think about your demographic’s needs

Understanding your market’s core needs is one of the most important steps of designing a successful mobile app. For instance, if you’re designing a game for kids, it’s better to use bright colors and icons in place of words. On the other side of the spectrum, if you’re designing an app that will be used by seniors, it’s helpful to make buttons and fonts larger than usual. Every demographic has their preferences and capabilities. Cater to these.

4. Create an intuitive design

Everyone will advise you to make your app intuitive, but it’s difficult to know how to implement such a vague concept.

Some suggestions:

  • Developers occasionally insert short tutorials to guide first-time users. However, while this can be helpful in games and more complex applications, this doesn’t always have a place in mobile design.
  • Reduce the amount of words and replace with easily understood icons to indicate events within the app.
  • Keep popular tools visible at all times, like the home button and search field. Users feel more comfortable navigating when they know they’re one click away from a familiar page.
  • Follow native control best practices. You want your app to reflect the platform it’s on for a streamlined appearance. Getting too creative and venturing off the beaten path will confuse users; stick with what they already know.

To learn more, here’s a good starter guide on intuitive usability, with five components highlighted: learnability, efficiency, memorability, errors and satisfaction.

5. Understand user experience

User experience (UX) encompasses everything users feel when using an app. It’s vital that users feel the app is easy to use and are happy with its functionality. Your goal as a developer is to make them satisfied with all the tiny details.

Some suggestions:

  • According to Google, 72% of people find it important that an app opens quickly. The recommended loading time is one second.
  • Log-in/Sign up pages should be clean, simple and integrated with social media for maximum ease.
  • User high-quality graphics. Unless you’re designing a game that deliberately invokes 1980s nostalgia, leave pixelated graphics in the past.
  • Power the app to function offline. Users aren’t always connected to WiFi, so they appreciate when apps can run offline without devouring their data. Even if your app must use the internet, consider inputting some functionalities that allow users to access some features of the app offline. For instance, Spotify users can download playlists to rock out to even when disconnected from the internet.

6. Understand user interface

Many guides encourage developers to browse competing apps for inspiration on a color template. While this is okay, it can lead to copycat designs, which, to state the obvious, is not a good idea. Users want a refreshing design; otherwise, they’ll just download the competition’s app. Your user interface (UI) should be consistent with your company branding and reinforce your identity.

Instead, step into the shoes of a designer and let your creative juices flow. Having too many different colors on your app will be loud and distracting, while having too few contrasting colors will actually make it difficult for users to know where to focus their attention. For these reasons, stick to a color palette – Pantone’s color resources are a great intro.

Also remember that less is more with mobile design. Due to the smaller screen space, colors and icons can mash together and be confusing. Design your app with plenty of white space, so the important elements pop and the main buttons are easy to locate.

               DSG previous               DSG next


This is part of Kiip’s ongoing Developer Success Guide.

Kiip is a leader in the field of app monetization. We enable developers to reward their users with advertising they enjoy. We want all developers to be successful in their ventures, so we’ve compiled a comprehensive guide with industry observations, best practices and expert advice.  

To learn more about monetizing your app, visit kiip.me/developers or email us at success@kiip.me.

dev-footer

More from Kiip

  • Creating Mobile Apps on iOS & AndroidCreating Mobile Apps on iOS & Android “Many companies have only focused on iOS and ported over the same app interface and design to Android. When approaching each platform, design for the platform. For Android, excellent […]
  • Best Practices for User OnboardingBest Practices for User Onboarding First impressions are everything. As you learned previously in the analytics chapter of the Developer Success Guide, mobile users focus on one activity at a time. As a developer, there […]
  • Mobile User Acquisition on a BudgetMobile User Acquisition on a Budget “We look at mobile web as top of the funnel for mobile users; it’s the introduction to our product and a critical part of our mobile experience. But our app users engage more deeply with […]