Page MenuHomePhabricator

Donation form Other amount field: 'minimum amount' error message
Closed, ResolvedPublic

Description

We've been following up with about a dozen donors over the past two weeks, trying to isolate what's causing these errors:

ZD395544.png (541×555 px, 60 KB)

ZD390821.jpg (1×1 px, 548 KB)

So far they seem to be using up-to-date versions of Chrome, and responding to banners rather than email links. Could it be related to the KeyboardEvents mentioned in T173431: Safari issue with Other amount option in banner: mask currency code letters?

If there are more specific details we can ask for, please let me know. So far no one's mentioned anything like using the Back button, the error seems to occur on first go.

Event Timeline

Adding @Pcoombe and @schoenbaechler as subscribers to this too.

Just based off the screenshots, it might be a confusing design choice on our part, more than a bug . Those screenshots come from our desktop small banner, where the Other button is actually an input field, requiring the user to type an amount before pressing Continue. Based off the screenshots, perhaps donors are simply selecting Other and expecting they can continue to enter an amount on the next screen.

Does that sound like a logical explanation @MBeat33, or am I missing something? We've been using this button style for a few months, so not sure why it'd just be coming up now.

But we could:

  1. Make the error popup more descriptive.
  2. Make the Other input more obvious - for ex, on donate.wikimedia.org the selection of the Other field keeps the input bknd white and makes the blinking cursor much clearer.

I agree that confusion about the input seems most likely. If you click outside the input after selecting it, it looks just like any other selected button. The desktop large banner (below) is clearer. And on mobile it's very clear as clicking the button opens up a keyboard for input.

Screenshot 2017-11-17 19.41.37.png (294×686 px, 25 KB)

It might be worth thinking about alternative designs, and running a few through usertesting. Another thing we could try is after an amount error, place the cursor into the "Other" field, which we already do on donatewiki.

Thanks, @spatton & @Pcoombe Looking at the Zendesk tickets, I think you're both right that the donors simply don't see that they can enter the amount inside the button.

I like the suggestion about removing the default blue input bknd inside the Other box, once it's been clicked into, as it may obscure the cursor. Maybe making the background white at that point would prompt donors to see the field as an active place to specify the amount, rather than something that will load a new page.

Yes, I think it's confusing in the current state. If it looks like all the other amount options, we should probably change the interaction model to something like this: https://en.wikipedia.org/wiki/Apple?banner=robin_20171114_dsk_lg_your_donation&force=1&country=US&uselang=QQ

Or here's another example with a clearer «Other» field: https://en.wikipedia.org/wiki/Albert_Einstein?banner=robin_complete_responsive_banner&force=1&country=US&uselang=QQ

I will add a card to my Trello stack that addresses the «Other» field in Desktop Small and come up with some improved designs.

@spatton @Pcoombe @MBeat33

In the course of Big English, we've ran a test yesterday that featured an improved “Other” field in the Desktop Small banner. We decided in a call today, that we’re going to adopt it as our control. Glad to receive your get your feedback as well @MBeat33. You can check it out here:

https://en.wikipedia.org/wiki/Apple?banner=B1718_112820_en6C_dsk_p2_sm_frm_otherfld&force=1&country=US

CC @spatton @Pcoombe

Thank you, @schoenbaechler - I like the new Other field a lot, and think it will be more intuitive to donors.

We've been using the new style linked above for a while. @MBeat33 Are you still getting reports of this or do you think we can close this task?

MBeat33 claimed this task.

Thanks, @Pcoombe. I think the new style is working, as the trickle of errors we still see sounds like simple donor errors, so I will close this task.

Digidietze added a subscriber: Digidietze.

Not sure if this is the correct place and action, but there is a similar problem on this year's donation request pop-up.

There is a radio button selection named "Other amount"; selecting this and clicking "Next" gives an error about a "zero amount". I can see no field to enter an amount in the pop-up.

For reference here's our current banner designs

desktop large
desktop small
mobile large
mobile small

All of them have an underline for the text input. On desktop it shows the blinking text cursor when Other is selected. On mobile, it should automatically open the device keyboard. Is this not happening for you? Can you think of any way it could be made clearer?

I was referring to the German banner. I wasn't aware that there are such significant differences between the language versions.

I recently found the entry field only by accident in the German banner

I certainly wouldn't have run into problems with the US desktop design. And now it turns out that even the German banner has been changed. It's a little better now but I'm still missing the frame that appears in the US banner when selecting "Other".

Earlier versions didn't show any difference between the other radio button captions and the one that's supposed to be an entry field.

Anyway, I'm in contact now with the German Wikimedia foundation. Please consider this report obsolete. Thanks!

wikispende.png (89×1 px, 2 KB)