Even tech giants make UX mistakes — and this one could cost PayPal some users
It doesn’t matter if you are a bleeding edge startup working on your first MVP or a seasoned tech giant like PayPal, UX mistakes happen, but would you really expect them from a tech giant like PayPal?
To give you all some preface to this story, I simply wanted to withdraw some money from PayPal and was shocked that it was not as simple as it should be.
I decided to write this article to highlight a UX mistake that even PayPal has made and to show you how you can carry out some usability testing.
Generally speaking, I like PayPal and how they go about their UX/UI, they are pretty clean and minimal and things are pretty user friendly, but this time I was quite disappointed to find that withdrawing money became a confusing experience.
After selecting the “Withdraw money” option from the home screen and the account I wanted to withdraw the funds to, I was presented with the following screen with a “Transfer amount” title and an editable field below for the amount that I wanted to withdraw. You can see it below:
This input field for the amount is what caused the problem. There was a blinking cursor at the end of the $0.00 and whenever I see a blinking cursor in an editable field, word processing software, etc I instantly reach for the backspace key, because it’s a natural thing to do. Whenever there is input I don’t want, I want to try to delete it. I found that I could not delete the $0.00 by pressing the Backspace . Instead there was a small animation where the input shook from side to side and turned red and then the cursor returned to the end of the $0.00 input. Fair enough.
I realised by this point that it was one of those annoying inputs where you type the numbers and they are then entered from right to left like an old pocket calculator, which I have not used in many years. Unfortunately, the inherent problems from this calculator have carried over to the UX of PayPal!
After seeing this being used by PayPal, I decided that it would be interesting to give this input field a little UX stress test.
I carried out a series of usability tests to see what would happen in different situations. Here are my results:
Test 1 — Highlight and Delete (blank input)
I first decided to test this with the blank input that was there ($0.00) and I highlighted all the numbers and pressed “Backspace” to see what would happen. The numbers changed to red and moved from side to side just like before to show that this was an invalid input. Fancy, but a little cumbersome especially if you made the same assumption about how it should work (like I did).
On top of this, can you see that the text stays highlighted? This was confusing because it didn’t default back to the flashing cursor on the end. So how do you go back from here? The answer is to press the right arrow key, click the field or simply type numbers, but how do I know this? I had to find out the hard way.
But what if you hit the left arrow key?
Amazingly this allows you to input numbers in the tens and hundreds, which is not at all possible any other way for this type of input.
As you can see too, there is enough money in the account ($112.06) to take out, but an input of 1 and 0 after pressing the left arrow (which makes $100) through this method returns an error. This was very confusing and was rectified by clicking somewhere else on the screen. Imagine you weren’t just testing this!
Test 2 — Highlight and Input
I then decided to highlight the numbers again and press a number and see what would happen. I pressed 4 and then somehow the input showed $40.00. How is that in any way logical? Imagine you were a user like me and you assumed that you needed to highlight the entire input and then wanted to withdraw $4. In order to get the correct result from here, you would only need to press the Backspace key once to get to the right amount, but what if you wanted to go back to $0.00? For this you would need to press Backspace a total of 4 times! Imagine the number was much higher than this!
Test 3 — Highlight and Delete (with input)
I decided to put in $100.00 and test it. I started by highlighting all the numbers inside and then pressed the Backspace key, only to find that only one zero was removed from the end of the amount. This is especially annoying because there is absolutely no way to clear the field if you made a mistake.
Imagine you needed to put in $200 rather than $100, in order for you to change this you need to press Backspace 5 times to clear the input back to $0.00 and then you would need to type another 5 characters (2,0,0,0 and 0) in order to get to your desired $200.00. This is absolutely horrible for any user looking for a seamless user experience. PayPal should be preempting that users make mistakes (if they are even aware of these bugs in the first place) and give them a solution to quickly fix the mistake and not “penalising” them for making the mistake in the first place.
What I would have done better
As you can see, this input is all over the place. In fact, I found even more errors, but this article isn’t long enough for all of them! Aside from the obvious bugs, which need to be fixed ASAP, the biggest thing here is that it is really confusing for someone if they make a mistake and in a way they are ultimately “punished” by an even more frustrating experience. If you did it correctly the first time, then you definitely got off easy!
One of the biggest things that is missing here is a simple and user friendly way to clear the entire input and reset everything back to $0.00. This would cause so much less headaches for users, especially if they get things wrong. I would have added an option to delete the whole input, something like a small “x” near the numbers or some underlined words underneath saying something like “Clear”. This would allow users to reach their goal as quickly as possible and in turn, improve the usability and perceived usability of PayPal, which could potentially translate into more customers and better customer retention.
What PayPal cannot rely on is hoping that their users will get it right on the first try. It really was alarming that I was able to recreate such scenarios and this is all coming from a huge company that describes its UX team as the “forefront of PayPal’s mission to change money for the better”. Does anybody test these things? I think they went a bit overboard here in trying to create something that looks better than it functions. Best practice and usability are paramount here and not the look.
PayPal, please fix this for the sake of your users and do get in touch if you want to know the other errors I found :)
Looking for advice with your own UX problems?
Sebastian Tan is a UX designer with a passion for digital products that just work.
You can find him at his website sebastian-tan.com or send him an email at s@sebastian-tan.com.
