Page MenuHomePhabricator

🎬 desktop-de-09 | design of donation form below the text – ⏰ 07.11.
Closed, ResolvedPublic

Description

Here we will be testing the 2 existing designs for the form-below-banner case.

CTRL will be the latest, best-performing banner from test 8
VAR will be the lately evaluated grey-box-design from test 5

Goal is to find the best design to use and improve during the campaign.

Acceptance criteria

  • While obviously different looking on small viewports (form-below), the banners should look indentical on large viewpoints (form-right) this means:
    • In the VAR design the placeholders need to be removed so the radio-buttons move closer together, which also removes the open blue space in the text-area (-> this should also remove the 'free space' at the bottom of the form-below format of this banner)
  • Banners do not need to be of identical height in form-below format
  • Both banners should have the progress-bar implemented
  • Text in both banners should be:

In the clusters for smaller viewports:
"Liebe Leserinnen und Leser, bitte verzeihen Sie die Störung. Es ist ein bisschen unangenehm, daher kommen wir gleich zur Sache. An diesem Dienstag sind Sie in Deutschland gefragt:
{{ campaignDaySentence }} Wikipedia wird durch Spenden von durchschnittlich 23,83 € finanziert, aber 99 % der Leserinnen und Leser spenden nicht. Wenn alle, die das jetzt lesen, einen kleinen Beitrag leisten, wäre unser Spendenziel bereits am heutigen Dienstag erreicht. Schon der Preis einer Tasse Kaffee würde genügen. Über 6 Millionen Mal wird unser Spendenaufruf täglich angezeigt, aber nur 377.589 Menschen haben bisher gespendet. Wenn Wikipedia eine kommerzielle Seite sein würde, wäre das ein riesiger Verlust für die Welt. Wikipedia ist ein Ort des Lernens – Werbung hat darin keinen Platz. Sicher könnten wir mit Werbung eine Menge Geld verdienen. Aber dann wäre Wikipedia komplett anders. Wir könnten ihr nicht vertrauen. Es ist leicht, diese Nachricht zu ignorieren und die meisten werden das wohl tun.Wenn Sie Wikipedia nützlich finden, nehmen Sie sich an diesem Dienstag bitte eine Minute Zeit und geben Wikipedia mit Ihrer Spende etwas zurück. Vielen Dank!"

In the clusters for larger viewports:
"Liebe Leserinnen und Leser, bitte verzeihen Sie die Störung. Es ist ein bisschen unangenehm, daher kommen wir gleich zur Sache. An diesem Dienstag sind Sie in Deutschland gefragt, um Wikipedias Unabhängigkeit zu sichern:
{{ campaignDaySentence }} Wikipedia wird durch Spenden von durchschnittlich 23,83 € finanziert, aber 99 % der Leserinnen und Leser spenden nicht. Wenn alle, die das jetzt lesen, einen kleinen Beitrag leisten, wäre unser Spendenziel bereits am heutigen Dienstag erreicht. Schon der Preis einer Tasse Kaffee würde genügen. Über 6 Millionen Mal wird unser Spendenaufruf täglich angezeigt, aber nur 377.589 Menschen haben bisher gespendet. Wenn Wikipedia eine kommerzielle Seite sein würde, wäre das ein riesiger Verlust für die Welt. Wikipedia ist ein Ort des Lernens – Werbung hat darin keinen Platz. Sicher könnten wir mit Werbung eine Menge Geld verdienen. Aber dann wäre Wikipedia komplett anders. Wir könnten ihr nicht vertrauen. Wikipedia bringt uns alle, die Wissen lieben, zusammen: Beitragende, Lesende und die Spendenden, die uns finanzieren. Das Herzstück von Wikipedia ist die Gemeinschaft von Menschen, die uns unbegrenzten Zugang zu verlässlichen und neutralen Informationen geben. Es ist leicht, diese Nachricht zu ignorieren und die meisten werden das wohl tun. Wenn Sie Wikipedia nützlich finden, nehmen Sie sich an diesem Dienstag bitte eine Minute Zeit. Geben Sie mit Ihrer Spende etwas zurück, damit Wikipedia weiter wachsen kann. Vielen Dank!"

  • application of funds needs to be updated (T237231)

Event Timeline

tmletzko renamed this task from desktop-de-09 | Prepare Banners – ⏰ 07.11. to desktop-de-09 | design of donation form below the text – ⏰ 07.11..Nov 6 2019, 2:30 PM

In the clusters for larger viewports:
[...]21,48 € finanziert, aber 99 % der Leserinnen und Leser spenden nicht.

it should be "23,83 €" here, right?

thanks for spotting. You are totally right.

chrp renamed this task from desktop-de-09 | design of donation form below the text – ⏰ 07.11. to 🎬 desktop-de-09 | design of donation form below the text – ⏰ 07.11..Nov 7 2019, 5:34 PM

@tmletzko
Both banners are on Central Notice for you to review it:

https://de.wikipedia.org/?banner=B19_WMDE_09_ctrl
https://de.wikipedia.org/?banner=B19_WMDE_09_var

What's been implemented:
viewports < 1400px show small text
viewports > 1400px show large text
Please check if this is the desired behaviour or if the change should happen at another (smaller) breakpoint than 1400px.

@CorinnaHillebrand_WMDE

  • The so-called campaign day sentence is missing. I added the needed placeholder to the task description.
  • The progress bar is missing in both banners.
  • campaign day is added in the text ✓
  • progress bar is implemented in both banners ✓

info:
I'm off until the campaign start from now on, please ping @gabriel-wmde or @Tim_WMDE for further changes until then.

Thanks @CorinnaHillebrand_WMDE that's all good now. Super minor thing: Text in right of the progress-bar is usually black but that doesn't screw the test as it's now green in both. So no worries.

@gabriel-wmde @Tim_WMDE update: sorry, can you please quickly switch that text from green to black anyway?

  • progress bar text is German again ✓
  • right progress bar text is black
  • removed &dsn=0 parameter (vestige of old donation page test) ✓

Sorry, unlike what Jan wrote, the label on the right side of the progress bar is supposed to be green (#97b313).

chrp moved this task from Doing to Heap on the WMDE-FUN-Funban-2019 board.
chrp added a subscriber: CorinnaHillebrand_WMDE.

Text in progress bar is green again ✓

@gabriel-wmde @CorinnaHillebrand_WMDE
Some more remarks about the banners:

  • Can you please in var set the font colour in the progress bar to green?
  • There is a difference of font size of the banner appeal between ctrl and var in a certain viewport cluster. In ctrl the font size is decreased at the breakpoint of 1150px (at least on my screen). The same should apply to var (where at the moment the decrease in font size happens at 900px)
  • When the righthand form is displayed between var and ctrl there are several small layout differences: the position of radio buttons, use-of-funds link and the bank account differs. These layout differences would not be a stopper, but if they are easy to fix it would be nice to have it down before campaign start.

Fixed and updated on CN.

When the righthand form is displayed between var and ctrl there are several small layout differences: the position of radio buttons, use-of-funds link and the bank account differs. These layout differences would not be a stopper, but if they are easy to fix it would be nice to have it down before campaign start.

That is not that trivial / nearly impossible to fix across all browsers because the underlying but invisible structure of the banners is different. Since the position differences are really minor

@Tim_WMDE another small thing: could you please delete in ctrl the text break after "... in Deutschland gefragt:" at the breaktpoint of 1500px (as it is in var)?