How many elements are too many for one screen of a mobile (iOS/Android) application?

Question

Without scrolling, what would be the maximum amount of centered buttons I could arrange on a vertical axis before it became too cluttered? Interface Builder gives suggested distances between elements, but should there be whitespace on the top and bottom as well?

Specifically, I have a simple utility app with a single screen. On this screen is an ad, two lines of text, two function buttons, and a footer image. I am thinking of adding a third feature. Although this is the specific instance, I'm looking for more general guidelines. When is it too much? When does it all become visual clutter?

Answer 1

The best advice I think anyone can give is just to try it and see what it looks like. It might even be better to ask someone from the target market of you app (a user/potential user).

Answer 2

My UX teacher always said that you should never have more than three elements in a horizontal line, or four elements in a vertical line.

I haven't always abided that rule, but I still think of it. It leaves a one-element-per-halfinch rule in a standard iPhone app.

Answer 3

I would think Interface Builder's suggestion would be a great start as well. If your third feature preserves this suggested distance that's a good sign. Otherwise you might be overusing screen real estate -- don't underestimate the power of white space in visual organization or in making things easy to understand.

This is probably not a candidate for general guidelines, as above try to get someone to use it. Also don't listen to anyone who recommends 7+/-2! :)

Answer 4

Key thing to keep in mind. These are all guidelines/best practices. If it makes sense (meaning intuitive) to add another option (hopefully without scrolling) then you should. However, if you are just going to add an option to add an option I would avoid it.

Also, it all depends on how that element itself is actually designed. For example, the more buttons you have on the screen, the more edges/boxes/lines/etc. you have on the screen. This will only make the screen seem more cluttered and confusing to the user.

Key point ... KISS (keep it simple stupid). If you keep this in mind, you generally can't go wrong.