What is the optimum button size of touch screen applications?

I've battled with people quoting this finding on several projects now. The discrepancy, imho, exists because of the researcher's ability to exist in a controlled environment.

When you have complex pages to deal with, you can't make every tapable action the size of a large man's thumb print. If you did, you'd end up with a cluttered mess of a UI. People are more adept with their touch devices than we sometimes give them credit for.

For critical actions, I've found anything from 36 to 48px to work reliably. For secondary and tertiary actions, like small icons or text links, I just make sure there is no less than 24px (48 in @2x terms) of total depth.

Bottomline: With anything other than your "critical path" actions, you have a little wiggle room. People aren't completely haphazard with their devices these days, they're aware of the cost of lazy tapping. When they want to interact with one of your less important actions, they'll be a little more careful with their fingers ;)

The guidelines given for the various platforms are all based on the idea that the minimum size should be 9-12mm. The variation between the guidelines is mostly due to differing pixel densities on the devices, and hence different number of pixels needed to reach the 9-12mm figure.

Note, that this isn't an ideal dimension to make the button easier to use, but what you should never go below. In practice, however, due to space constraints it often ends up being the standard size that is used.

What the 'ideal size' is really depends on the application. I worked on one mobile application where three buttons in a bottom aligned actionbar had to be used very often. By increasing the size of the buttons by about 20% we found a measurable improvement in the UX. This was important enough for this application that we were willing to give up some space for the bigger buttons. In other applications this may not be a good tradeoff.

Yes, size can be an issue. Touch targets need to be bigger than typical desktop targets because the finger precision is worse than the pointer+mouse precision. With this worst precision the odds to do missed taps is bigger (like not touching a button or touching the incorrect one).

Usually, touch studies use as principal study variable the error rate. The suggestions are not for perfect error-prone touch targets, but rather to minimize the number of errors to a practical level while balancing other important variables, like screen information density.

In traditional touch interfaces, like kioscs, targets are usually a lot larger than in mobile phones, because the size of the screen lets the designer do this. In mobile phones some trade-offs need to be made, and this is the reason because some target sizes differ between style guides and past studies.

Any measurement in pixels is not useful to design for touch interfaces. You must consider the human finger size in relation to the screen pixel density. You must know the pixel density of the devices you are designing for and convert the metric units to pixels.

The optimal touch target size, without considering any other variable, would be the theoretical infinite size, but it's usually suggested in style guides to use a general target sizes of 9mm (0,5% missed taps) and 7mm (1% missed taps) as a minimum.

Luke Wroblewski has a good compilation of style guide recommendations, and I would suggest you to have a look at Microsoft recommendations (based in user testing sessions). Missed taps graph is from their studies.