I'm gathering feedback on the best way to show a keyboard on screen that will provide different keys depending on the input needed.

The user will have to input 3 different values in three different steps of a process: 1- enter code (numeric password) 2- enter amount to pay (money with decimals) 3- enter additional amount (money also)

For each input, the keyboard may change a little, since the Code, for example, does not allow dots, but the Amounts will need dots for decimals and double zeros in the keyboard could help...

I need the keyboards to be consistent for the whole flow, despite the specific rules per entry, and to be compact (visually), since the space is limited in the last input (#3 does not need a field above, since the entry field is on the side). I clearly don't want to reinvent the standards, so I'll like the "0" to be centered, right below the "8".

Here are some options to help you imagine it. Hope it makes sense.

The set I like the most is shown as Row 1. What do you think?

keyboard options for a single flow

  • why in the 3er colum you have deleted de preview of the input? Commented Apr 14, 2015 at 18:56
  • Hi, it's because it will appear on the left side (multiple entry fields), and the trigger button below other components ;)
    – redux
    Commented Apr 14, 2015 at 20:36

1 Answer 1


A1, B1, C1. But shouldn't the keyboard be flipped vertically? Here's what I would expect to see serving the purpose, without further knowledge of your usage... tres keyboards Too, I would expect a Back button.

  • Thanks Jedi, well I'll like to understand what's the reason behind your flipped keyboard? The order suggested: 1-2-3, 4-5-6, 7-8-9,0 is kind of a standard for calculators, telephones and many other devices in North and South America at least. Thanks for your answer!
    – redux
    Commented Apr 15, 2015 at 14:30
  • Also, the third button is at the end of the page, which is not near to the keyboard and that's why I didn't put that last button. And the Back button is general to the full application.
    – redux
    Commented Apr 15, 2015 at 14:36
  • 1
    @redux gotcha! my calculators all have 1-2-3 at the bottom like my PC keyboard numpad. but your needs may differ. sure, the third button is on "the left side of the fields" and you just need these three numpads in a modal sense. i don't see any advantage in a "00" key or in moving the "back-erase" key away from the position you've given it. Commented Apr 16, 2015 at 4:43

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.