In Two Days I Improved Conversions By 28%. So What Went Wrong?

At National CineMedia, when it was noticed that our regional clients were only able to successfully upload their media files to us 40% of the time, I was asked to take a look.

Upon initial examination, I couldn’t understand why the completion rate would be so low, but I did have some ideas. The first thing I noticed was that the layout of the form was difficult to read, and also didn’t seem to have logical grouping, leading to user confusion. For example, is the confirmation email supposed to be for the agency or for the account director? Maybe I should just use the help bubble to find out?

Um, maybe not.

The other immediate issue was the difference between Order Number and Job Number. Does a client know the difference? It turns out, not always. In fact, on their paperwork, Job Number is actually listed as Creative Number. Also, these are both required elements. If a customer skips one because they can’t find it, the process fails. And why it fails is because we have an automated system that reads this data coming in and filters media into the right bucket. Incorrect fields break this system.

Should we use the help bubble?

Ah, and there’s another issue with the Order and Job Numbers. They have a specific format, which is not followed consistently in all of the paperwork. Put it in wrong and, yeah, you get the picture. So here’s the first step I took – redesign the form.

The first piece to this was make it vertical. If the space is available, which is is here, I always suggest this. It created a natural “step” process for the user. Look back at the old form. Do you go left to right and back to line 2, or column 1 and then 2? That kind of mental challenge is alleviated here.

Next, I put in the understanding of grouping. The top is all NCM information, the bottom is all client information. Do you wonder who’s email to use now?

Thirdly, the most common questions clients had about each field were answered in short sub-label form with each of the field labels where it made sense. Order Number and Job Number are required, and not just because we ask, but because you may miss your start if not done properly. And to ensure they are done properly, watermark text was also inserted into the field as a simple design affordance for the user.

Next, the hint bubbles were kept, but rather than some ambiguous text, they were populated with screenshots taken right from a client contract. No more wondering where to find things. Oh, and I changed the title from Job Number to Creative Number. That makes a little sense, eh?

And lastly, in the case someone still needs help, I “unhid” the ability to do so. On the old version, if you had trouble, here’s what you could see:

Not only is this really bad grammar, and slightly hidden, but it doesn’t let you know what you’re going to find. Do I really want to click this? Will it take me away from this page and delete the work I’ve already done? Overall, just a bad experience. So I brought it up into the page where it needed to be, and gave it some context.

I also added a link to a new .PDF that was a nice, visual, step-by-step guide to completing this form, just in case there was still confusion. And this was placed before the phone number, in hopes that a call was the absolute last resort. Turns out, the calls went WAY down. In fact, when related to filling out the form, they all but disappeared.

And now, the results!

Before the updates, the success rate for media uploads was around 40%. After the above changes, which were researched, designed, and developed over a two-day period, the success rate jumped up to 68%. If you were to ask me, “Hey, Brad, is a 68% success rate something to write home about?”, I would have drop my shoulders and mumble “well, no”. So what went wrong?

It’s fairly simple, actually, and I’m not going to take the blame. This site utilizes the Aspera High Speed File Transfer Software, which is a browser plugin, and a very difficult one at that. I know this is the reason for the majority of issues on the new design because we have a help desk, and those are now the calls we receive. The good news is that we identified a new tool created by Upload Care and tested this last year with our Cannes Lions contest page, where hundreds of large media files needed to be uploaded and automatically placed into folders. The success rate for this tool was 100%. It is now planned to be the replacement company-wide for Aspera.

UX Design: Displaying Multi-Tiered Pricing and Discounts

The decision by management to start offering multi-tiered pricing to customers, as well as in-stock pricing sparked months of debates. When I received a project that required me to present management with over 35 different ways to present this pricing information to our customers, I realized it was time to stop debating and take it to our customers for the real answer. I sent out two surveys to over 300 users that had signed up for the MyArrow Impact Group and quickly solved the problem before it was time for the UI team to implement the new features.

The first immediate problem identified was the format for offering in-stock pricing:

Question: If Arrow owned inventory that it could offer for a lower price, how would you interpret the following image?

  • What price would you expect to pay per part if you were ordering:
  • 60 pieces? Correct 39/45 ($1.35)
  • 120 pieces? Correct 16/45 ($1.85)

As you can see from the answers, most users understood how this pricing would work for a purchase of 60 pieces, however, as soon as the order jumped outside the quantity range, only 16 of the 45 respondents selected the correct answer. The solution had over 93% correct answers; still not perfect, but much closer.

Now the fun part is how this solution was found. The process was a combination of surveys and competitor research. The majority of Arrow’s main competitors already used multi-tiered pricing on their websites (but not in-stock pricing). I took a look at each of their presentations and used them to customize Arrow’s pricing scheme, which I then took to the customer.

Question 1: In your opinion, which of the following methods best displays products with quantity breaks?

In question 1, I took the most common multi-tiered pricing displays and found that option C had over 78% of the vote. No debates there. I then catered question 2 to whichever option they chose in question 1 (using the most popular answer for this explanation).

Question 2: In your opinion, which of the following methods best displays products with quantity breaks?

As you can see, in question 2, I showed the quantities in that users’ favorite style and introduced alternate methods of displaying all the pricing information. In this scenario, 80% of respondents chose option B.

For the 3rd and final question regarding display of multi-tiered pricing, I wanted to find out if availability or pricing was more important to the users.

Question 3: In your opinion, which layout provides the best information for making your purchasing decision?

67% of users selected A as the preferred display helping them to their purchasing decision. The multi-tiered pricing project was a resounding success, providing very solid data from users surveyed as to how this information should be presented.

So why all this work for one simple display of pricing? Simple! This is where sales are made. Pricing is displayed in the search results, in a bill of materials, on 3rd party websites, and most importantly, in the cart where the purchase is made. In the example above, if only 35% of users even understand what they will be charged for a purchase, how many of them will still want to go through with it? The power of the data collected in this project is enough to assure management that there will be a solid return on investment.

To solidify the reasoning for multi-tiered pricing, additional questions were asked:

Would seeing a price difference on the next highest quantity break lead you to increase your quantity for that part?

How important is it to know quantity breaks when buying components?

It seems that even though this type of pricing may not lead to more sales, in a competitive market where other companies are offering this service, users have grown to expect it.

This is an example of validating the need and usefulness of a value added service. View the risk management UX project post for an example of when to kill a project.