1

On a touch screen cash register, the user has an always visible onscreen touch pad to enter currency amounts. In some cases the register may show more than two fields, but here is a screen shot of our current solution in a situation where only "Amount" and "Tip" may be entered:

interface

As you can see, the focused field is dark and bold, and the unfocused field is grayed out, and has a note to indicate that a tap will focus it (this screenshot was taken on a desktop, but on the touch devices where it's typically used the text reads "(Tap to Edit)")

Tapping toggles the focus:

toggled

While this interface works well enough in the field, there is something that strikes me as clunky about having to explicitly say "(Tap to Edit)" to ensure that users know the input focus may be changed. I feel that with a better design it would somehow be obvious.

Is there a way to improve this?

NOTE: Using the native keyboard (ie, one that isnt always visible) was tested in the field and failed: switching focus was too slow for the fast-paced register environment, and the buttons weren't big enough and caused mistypes. So that is not an option.

  • Is the a way to automatically switch focus when a certain action is performed? Like tapping 00 or when cents are inputted. What are the issues for the mistypes? Aren't the waiters accustomed to the phone's keypads? What device are they using? – Nicolas Hung Aug 13 '17 at 13:50
  • I recall that ones on credit card machines in our country have a yellow triangle with a pencil in it on the right hand side of the field, pointing to it. They're larger tablets, though, so I can't say. – TernaryTopiary Aug 21 '17 at 13:15
3

As your description, user's goal is to fill in the currency amounts. And there are 2 states of your text field, focused and unfocused.

I would like to add one more as empty state likes placeholder of text field. The empty state encourages user to fill number in and easier to determine between two filed. That means if there is number $00 initially, the fields will looks similar and the usability may be reduced.

I simulated a draft as below:

enter image description here

Added another point, I placed fields horizontally instead of vertically to avoid situation that user might touch by mistake.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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