Page MenuHomePhabricator

🎬️ ipad-de-01 | Ask for yearly recurring donations | ⏰ November 3rd
Closed, ResolvedPublic3 Estimated Story Points

Description

Acceptance Criteria

  • The banners are based on the control banner of last year's ipad-de-02.
  • Both banners display the campaign progress bar.
  • Both banners include the campaign parameters file.
  • Both banners display the campaign day sentence.
  • Both banners share the same height.
  • The colours of the submit button is changed to #2a4b8d (background) and #ffffff (label) in both banners.
  • The font weight of the custom amount field is changed to bold in both banners.
  • The recent change to the form validation is applied to both banners.
  • Screenshots of the banners are uploaded to Shutterbug.
  • Variant banner:
    • If a user chooses to make a one-time donation, the banner shows a 2nd form page asking to switch to a yearly recurring donation.
    • The design of the 2nd form page is taken from the variant banner of desktop-wpde-03.
    • Submitting the form after checking the first radio button
      • leaves the input data as is.
      • triggers an event named submit-non-recurring in WMDEBannerSizeIssue.
    • Submitting the form after checking the second radio button
      • changes the payment interval to yearly.
      • triggers an event named submit-recurring in WMDEBannerSizeIssue.
    • Clicking the link below
      • changes the payment interval to yearly.
      • triggers an event named changed-to-yearly in WMDEBannerEvents.
      • displays the first form page again.

Slide copy

ElementCopy
Slide #1 headline(i) An alle, die Wikipedia in Deutschland nutzen
Slide #1 paragraphVielleicht kommen wir gerade ungelegen, aber dennoch: Klicken Sie jetzt bitte nicht weg! Am heutigen { currentDayName } bitten wir Sie bescheiden, die Unabhängigkeit von Wikipedia zu sichern.
Slide #2{ campaignDaySentence } Insgesamt spenden 99% nichts – sie übergehen diesen Aufruf. Wikipedia wird durch Spenden von durchschnittlich 22,66 € finanziert.
Slide #3Doch schon mit einer Spende von 5 € kann Wikipedia sich auch in Zukunft erfolgreich entwickeln. { visitorsVsDonorsSentence }
Slide #4Die meisten Menschen spenden, weil sie Wikipedia nützlich finden. Hat Wikipedia Ihnen in diesem Jahr Wissen im Wert einer Tasse Kaffee geschenkt? Dann nehmen Sie sich doch bitte eine Minute Zeit und geben Sie etwas zurück. Vielen Dank!

Implementation details

  • Create a new theme (and name it e. g. "Mr Satan")
  • Create a new form component
  • There might be some wikipedia.de specific style definitions that don't work on wikipedia.org.

Event Timeline

kai.nissen set the point value for this task to 8.
kai.nissen updated the task description. (Show Details)
AbbanWMDE moved this task from Doing to Review on the WMDE-FUN-Sprint-2022-10-04 board.
AbbanWMDE added a subscriber: AbbanWMDE.

Bildschirmfoto vom 2022-10-07 17-02-50.png (205×389 px, 18 KB)

we should think about whether just making the link text blue is enough for users do identify it as a link/button, as the <underlining on hover> won't work on ipads.
maybe we could also make this a secondary style button (white with blue borders)...
so many different looking action options here :D
just some thoughts on this

I agree, there are radio buttons disguised as buttons, a back button disguised as a hyperlink (with added functionality) and the submit button, which might be the only intuitive element on this form page. A secondary style button would be very close to the style of the option buttons, though. I'm very curious about the analysis results of this in the upcoming desktop-de-08.

@AbbanWMDE Some issues here:

  • When submitting the form, the logged event should reflect which of the options was selected.
  • When deciding to donate a different amount, an event should be logged.
  • When displaying the 2nd form page, this should also be logged.
  • Shutterbug only displays an error message for each of the screenshots.

@kai.nissen Ah, this is my bad. I put the banners into acceptance testing in the kanban form without realising you would test them.. They're still all somewhat WIPs as I work through changes to the shared multistep form.

That being said I just got through all that work this morning and re-uploaded this banner to CN and the event issues should be sorted. So maybe (MAYBE!) this is the first banner ready for the campaign launch.

kai.nissen changed the point value for this task from 8 to 3.Oct 17 2022, 10:44 AM

The updated Visitors VS Donors sentence is now also in this banner

The code is fine, but I find the "radio buttons disguised as buttons" design very gross - is this approved by UX? What was their reasoning? Making those 2 choices submit buttons would save 1 click/tap.

@AbbanWMDE

  • The slider should stop on the last slide.
  • The highlighting should be in yellow.

Apart from that the banners look good to go.

Some more change requests:

  • I slightly changed the slide copy in the task description.
  • Same as in ipad-en-01, we should increase the font size and line height of the slide copy. There shouldn't be a need to reduce the font size for <1090px width.

Okay, should be fixed. I also merged the new Use of Funds configuration and updated progress bar.