Your Mobile Apps Look Bad and You Should Feel Bad

Posted in HowTos, Tips, Usability, Web Design, WordPress • Posted on 1 Comment

Mobile application design and development has been ‘the thing’ as of late. With the growing prominence of smartphones, more and more applications are developed. It’s like, we have an app for everything, right?

What makes it even more amazing is that this year, the projected number of smartphone users will be 1.75 billion. This staggering number resulted into 2.6 million apps in app-stores (iOS, Android, Blackberry and Windows phones combined).

If there is one thing certain about these huge statistics, it would be that mobile application development and design is a big and newly-discovered gold mine to plow. There are a lot of opportunities waiting for developers as mobile apps continue on growing as the age of smartphones conquer the market.

store-wars

Having said so, we go to the topic of the day. You may have raised your eyebrows when I said that app development is still a relatively new and untapped gold mine. You may have thought of going to the app design and development battlefield.

But, before going to the war, let me brief you with some of the things you should avoid doing.

While you’re at it, you might want to look into previous articles:

Cramming Too Many Items within the Screen

This is a friendly reminder to app designers. You are designing for a smartphone screen, not a 1366 x 768 desktop monitor. It only means that you have limited spaces to put content.

Do not try to put everything in one place. Trying to compress information within a small screen will be tantamount to suicide. You need to understand how to use elements properly  to your advantage.

social-media

Here’s some tips you can do in order to avoid over placement of content:

  •         When in doubt, page it out. Use swipe-able pages to put all the content you want without cramming the pages.
  •         Make sure elements are tappable. Reserve enough spacing for the user to interact with the element. Remember, you are dealing with non-tactile devices most of the times, so using small elements is a no-no.

 

Preserve tappable control sizes to around 44×44 points.

  • Facilitate focus by elevating important content or functions. The most important items should be placed on the upper left half (for left to right cultures) of the screen.
  • Apply balance and visual weight to make readers understand the hierarchy of element importance. Larger elements are perceived to be more important than smaller ones. You may also want to enlarge CTAs and buttons so that the users can understand that they are tappable.
  • Align elements properly. It makes your app look classy and professional.
  • Use relative sizes. Texts shouldn’t be scrolled horizontally and images that are of utmost importance should be large enough so that the user won’t go into troubles of zooming.
  • Be consistent. Preserve one brand of design in your app. You wouldn’t want to confuse the users, right?

Using Illegible Fonts

best-app-ever

Legibility of texts supersedes other concerns. If you create an app that nobody can read, it will be worthless. Typography has always been a major concern in any field of digital design. Make sure that fonts and the text can be understood properly.

Readability

When we speak of ‘being understood properly’, we mean that the texts should always be readable.

  • Proper use of proper font faces, sizes, colors
  • Use of understandable words, good grammar and superb copywriting

A lot of apps sometimes disregard texts, but mind you, they are important because they are the main delivery agents of the messages of your apps.

Here are a few tips to improve the legibility of your texts:

  • Always prioritize the content when tending to text-size adjustments. Not every text falls into the hierarchy of importance. Normally, when users select a large text size, they to make the content easier to read. However, they don’t want everything in the app to be larger.
  • Make sure that all fonts are legible. If you can’t read it, don’t use it.
  • Never use a font size lower than 11pt. Always put in mind that users may adjust the accessibility text sizes and app font-size should still be 11pt or higher even if they do.
  • Headlines and Body texts can use the same size. You can add some distinction on the font weight.
  • Use only two weights, regular or medium. Never use bold or light-font weights.
  • Use simple words. Never add fancy and highfalutin words. Follow basic app copywriting guidelines.
  • Be sure to be direct in instructions. Users don’t want to read your novel, buddy.

Atrocious Color Combinations

Colors play an important role in app design. Some app designers tend to just choose the color they want and then design the app. That is a wrong practice. Colors should always help and enhance interactivity and visual continuity in every app.

When choosing the colors for your app, make sure that they jive together. Here is one article which can help you with color combinations.

Over-the-top-colorful-outfit-in-green-purple-mirrored-sunglasses-with-reading-glasses

Focus on color contrasts in different circumstances. Some inexperienced app designers usually make mistakes by not putting enough contrast in the navigation bar background and the bar button tiles. This makes the buttons difficult to distinguish.

Here are a few tips to avoid this pitfall:

  •         Use colors with at least 50% contrast differences. Then test the results on a device under different lighting conditions such as indoors and outdoors.
  •         Try looking at the app in grayscale (or desaturated) form. If you have difficulties in differentiating the interactive and the non-interactive elements, then, you need to increase the contrast between them.
  •         Never use the same color in both tappable and non-tappable elements. You should always keep in mind that UI elements that need interaction should always be different from elements that don’t. Make your users know where to tap.
  •         Colors should always enhance the flow of information. Never use it as a distraction.

Wrong Ad Placements

full-screen-ads

Now, let’s talk about ads. As developers and designers, we would love ads. They make our apps earn without sending the burden to the users. But for regular users who have no idea about mobile app design and development, ads can be very irritating bugs in the UI. Some ads just pop out and shazam!, you’re redirected to the App Store. Now, this is common mistake for new app creators. So, what do you do?

  •         Never use pop-out ads. These are the advertisements that just pop over the entire page. This disturbs the proper flow of information and could distract with the user tapping on the interactive CTAs.
  •         Place ads on creative places. Usually, ads are placed in the least important part of the screen. Normally, a small portion of the lower part of the screen is set for ads. You may want to free up a small space there.
  •         Some ads, especially in games, give bonuses to the players. I guess this, too, is creative.

Making the User Wait

loading

Nobody wants to wait. But some apps need a few moments to load. But you have to be careful about this. Splash screens are risky elements to place in your app. They are normally annoying because you are accessing the content while someone is waiting for you or the device. If you place a splash screen, make it is short as possible. While you’re on it, make it creative.

Notifications

notify

As the designer, you want your app to be noticed and used by people, right? So you might think that you should always remind them that you haven’t used the app in a while? Right? Have you thought of this?

Well, if you are thinking about even doing this, don’t. Notifications, unless they are essential to the users, turn the latter away from your app.

Think of t like this: no matter how nice you try to be, there’s always this one guy who thinks you’re best friends and sends you emails about his life every single hour. Do you even like that random guy? Hell no, right? Then if you don’t like annoying people constantly reminding you, begging for your attention, don’t put them in your apps.

I suggest that you remind them to check your app out using the following ways:

  • If your app is a game, provide bonuses for users who regularly check your app out.
  • Try to design a better app. Improve your errors; make it more exciting.
  • Be nice with the ads. Don’t clutter the pages.
  • And lastly, follow the guidelines stated in this article.

Or else, you might end up falling prey to this app-blocker setting.

Conclusion

App design is not a walk in the park. Like web design, it has its pitfalls. If you continue to keep on committing these mistakes and not even learning from them at all, then you won’t be any good at all. Remember that you should learn from these mistakes and create a better app next time. Happy designing!

94 Written ArticlesWebsiteGoogle+

Rudolph is a geek. He loves reading: books, blogs and even nutrition facts found at the back of products. He loves to read interesting internet stuff. Since joining 1stwebdesigner last year, Rudolph has written several articles that concerns Typography, Wordpress, Freelance Lifehacks, Graphic Design and Showcase of Beautiful Web Designs. He also write poems, movie reviews and he puts them in his blog together with rants and some daily life updates.

Join Discussion Now!

One Comment
  • Marko Petkovic

    Saturday, August 2nd, 2014 22:37

    1

    “Never use pop-out ads.”

    Very brave statement.

    Did you know that over 50% of apps don’t make enough profit to cover development cost? Screenshot you have as a reference for this rule is top converting ad network (Chartboost) which brings 75-95% of revenue for average freemium app on App Store.

    It’s not just about design you know…

    Anyway, good tips except this one.

    Regards,
    Marko

    0 Reply
  • Marko Petkovic

    Saturday, August 2nd, 2014 22:37

    1

    “Never use pop-out ads.”

    Very brave statement.

    Did you know that over 50% of apps don’t make enough profit to cover development cost? Screenshot you have as a reference for this rule is top converting ad network (Chartboost) which brings 75-95% of revenue for average freemium app on App Store.

    It’s not just about design you know…

    Anyway, good tips except this one.

    Regards,
    Marko

    0 Reply
54.87.88.52 - unknown - unknown - US