I am creating an app which includes payments and by following banking regulations I need to ask the users for a four-digit password as well as an OTP (one-time PIN sent to the user's phone) every time they want to pay.

This seems really frustrating to me and I was hoping you good people could advise on the smoothest way to present this to the user.

  • Cannot make a complete answer with sources and wireframes atm, but I would suggest activating two-factor-identification on an gmail account, for inspiration for a similar interface. My second (very general) advice would be to put the authentication as early as possible in the flow, as long as it's not before the user has actually decided to make a payment. Things where the user can fail, like password input, are more frustrating the later they appear Commented Nov 26, 2014 at 13:17

4 Answers 4


Even though you will save space by combining both fields onto a single page, I would be inclined to present each field on it's own screen.

  1. The user elects to pay

  2. The user is prompted for password - the user enters password

  3. The user is prompted for OTP

This way each page could have it's own intro text and help links if required. Otherwise you would need to include a 'forgot password' link and a 'resend OTP' link all on the same page, feels cluttered.

Have a nice animation linking the screens together if possible to ensure a feeling of consistency between the two steps.

Maybe have some light hearted text like, 'just one more step...' on the OTP page or something to smooth over the extra effort required.

  • that feels more like a design challenge than a userflow challenge though.
    – Racheet
    Commented Nov 26, 2014 at 13:28

When they enter all their details and click on pay, show them the password field as well as the OTP field. At the same time you should send the OTP to their mobile. When they click confirm or submit, they should be able to do the transaction.

  1. You are reducing the number of clicks.

  2. You are doing all operations on a single page.

  3. No complexity for the user who is paying.



The user wants to give their credit card info and delivery address (if applicable) and nothing else.

Ecomms on mobile is already bad enough without these extra steps; think how simple a real-world transaction and then go back to this system and you'll see what I mean.

you might find this link useful


  • 2
    Believe me I am fighting the good fight to reduce these restrictions on the user, but when you are working for a large enterprise that "requires" these extra security measures sometimes we need to think how to reduce the pain instead of elimination :/ Commented Nov 26, 2014 at 12:18
  • I feel so sorry for you. They don't understand the internet do they.
    – colmcq
    Commented Nov 26, 2014 at 12:58

Yes,couldn't agree more . Users like to achieve more thing doing less operations in any field as a matter of fact. But I tried to solve the problem with respect to the requirement , that has been mentioned in the question.

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.