Thursday 10 February 2011

How not to ask for a phone number

A real life lesson in simple usability improvements that can improve conversion rates.

My wife and I love the movies, so to celebrate Valentine's Day this weekend we'll be going to our local cinema to see "The Kings Speech".  I've heard it's very good.

I booked online with at the cineworld.co.uk site (@cineworld) and only just managed to book thanks to a rather horrible usability hurdle.  Here follows what I wrote to them using the contact pages after the experience.

Dear Cineworld

"...I wanted to share with you a usability problem I had with the payment pages.  If my experience is anything to go by it will be seriously hampering your conversion rates and if you fix it should improve your bottom line immediately...


It's to do with the validation of the mobile phone number.


I initially put in my number as follows;
077XXXXXXXX


The error message told me to add the country code. So I did;
+4477XXXXXXXX


The error message told me to only use digits.  So I did;
004477XXXXXXXX


Then the was another error message.  Can't remember exactly what it said.  To get through the validation process I needed to actually type;
4477XXXXXXXX


4 attempts!
From someone who works building websites for a living and has done so for the last 11 years!


It's quite possibly the worst validation experience I've ever  had.


Suggestions;
1. If you want to capture the data in that format tell them so in the form up front 
2. Alternatively have a drop down of country codes to select from with UK as default.  Then ask people to enter their number as normal in the field and get your programmers to remove the first zero and any spaces.


In essence - you're making it way too complicated.


Hope you find this useful..."

What's happened here?

I've seen this happen many times.

The developer says, "In order to send SMS confirmation messages, my system needs clean and correct numbers.  I need the country code, then the mobile number in the following format; [XXYYYYYYYYYY] (where X is the country code, no zeroes, no symbols and Y is the number, no spaces, no zero up front)".

The developer does not say, "How do people usually type in their mobile numbers?  How can I help them enter it in a way that is obvious for them and still helps me get the data in the format I need"

Don't blame the developer though.  The producer / product manager should be on top of this during the design process and the interaction designer should instruct the developer.

Cineworld, to be fair have built a pretty intuitive website and it's very easy to find and select a movie to book.

Funnily enough, Cineworld did populate the form with a suggestion format in the field.  I didn't see it, the light grey was so light it didn't register.  Then, when I got it wrong, I didn't have obvious instructions on what the format should have been.


The only way top really test this is to watch real people using it.  People with nothing to do with the design process. Learn from idiots like me, tweak the form, then measure the results.  How many more visitors converted into bookings did I make as a result of that change? Sounds obvious.

Be your own customer.

No comments: