I am creating a mobile application that can be used as a counter. This app would be implemented in full-touchscreen phones. Here is part of the screen:


I want to indicate that users can either tap or slide upwards on the translucent black area to add the counter. But I am stumped. Any suggestions?

  • 3
    If you must ask a question like this, it sounds to me like the UI needs to be re-done to make it obvious to users that they can tap or slide. Your current design doesn't have an affordance.
    – Hisham
    Commented Sep 21, 2012 at 17:53
  • that, honestly, is what I thought. thanks for the input.
    – atnatn
    Commented Sep 22, 2012 at 3:14

3 Answers 3


The default behavior from a user will be that they just try to touch anything that looks like it could react to touch. Your mockup only shows the numbers in the first place, so chances are that the first thing users will try is to tap directly on them.

Generally, this is a problem the OS designers also face, so a look at their solutions provides further insight:

The key is, as has already been mentioned, that your design is lacking affordance to slide. In my opinion, it lacks any affordance at all – the user will probably still try to touch the numbers, but that's not because they afford it. It's because there's nothing else they can try.

However, the numbers don't afford sliding. You're going for a split-flap display look – now in theory users could make the connection that these are, mechanically speaking, plates rotating on an axis. On the other hand I'm not so sure how many of today's smartphone users have ever owned a device with a mechanical split-flap display, or have seen any "real world" example of it at all.

So, going by the examples from the OSs you could try to …

Another, more general question: Why is the touch-sensitive area limited to the grey area? Are there other UI-elements above and below it? If so, they may draw users' attention away from the numbers. If not, why is there "dead" area instead of everything above the numbers increasing the value, and everything below them decreasing it?

  • +1 For a much better and more comprahensive answer than mine. Welcome to UX.SE! Commented Sep 21, 2012 at 19:46
  • thank you for your complete answer (with references, too!) I guess I should probably be changing the design entirely, because number picker for a counter is a little strange, I think. Thank you :)
    – atnatn
    Commented Sep 22, 2012 at 3:21

Indicate that a touch-phone needs to be touched in order to change anything? Users know that already. You need to show them when they tap something that they can do something else. Like on Windows Phone, you could tap a number, and you'll get a column of numbers in return. What to do with it? Swipe vertical - maybe? And then, when your satisfied with the number, touch again? Maybe?

enter image description here


That's a relatively simple screen, so a user is more likely to experiment on it. Reward them quickly and easily with the right type of movement and that can do it.

The other possibility would break the styling you have, but if you can give a glimpse that there's more content (quarter of a number, etc.) then a user will more than likely understand (a smartphone convention at this point).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.