usability - In a Verify OTP Modal Box, "verify OTP" button will be first or resend OTP link will be the first [image attached]

In the OTP(One Time Password) Verification Modal card, which will get more preference to be placed first Check the Image bellow

• Option 1 : Validate OTP, Button will be on Top and resend otp will be bellow of it


• Option 2 : Resend OTP , link will be on Top and Validate OTP Button will be bellow of it

which will be better according to Usability test and UX . you can suggest better more than it.

Answer

I would go with Option 1, it makes more sense to place the validate button above the resend option since the majority of the users will receive the password and only a small amount of users will have to use the resend option. (Im assuming your system is doing what it should do).

In my opinion "Validate" is enough for the button and instead of "Resend OTP" write it out and say "Resend One-Time Password".

I would also remove the "X"-marks in the input fields just to make sure the user understands that he needs to input something.

Set focus on the first line and focus on the next line automatically after entering the number for each field.

Also you should give the user to chance to re-enter his number, since if he entered a wrong number your not providing him any solution right now.