Page MenuHomePhabricator

🎬️ mobile-de-05 | Put anchor amount into button label | ⏰ September 27th
Closed, ResolvedPublic8 Estimated Story Points

Description

We want to test the effect of putting the anchor amount into the button label.

Acceptance Criteria

  • The banners are based on the control banner of mobile-de-04.
  • The button label on the mini banner of the variant is changed to "Jetzt 5 € spenden".
  • A link is added at the right of the button ('Jetzt anderen Betrag spenden').
  • In low resolutions the link uses two lines and the font size is reduced to .85em.
  • Clicking the button
    • expands the banner as usual, selecting the amount of 5 € in the banner form.
    • is logged as a mobile-banner-amount-button-clicked in WMDEBannerEvents, passing the slide count data.
  • Clicking the link
    • expands the banner, not selecting an amount in the banner form.
    • triggers the usual mobile-mini-banner-expanded event.
  • Screenshots of the banners are created and uploaded to Shutterbug.

Design

320px360px414px
Screenshot from 2022-09-23 10-01-09.png (337×306 px, 26 KB)
Screenshot from 2022-09-23 10-04-29.png (317×348 px, 28 KB)
Screenshot from 2022-09-23 10-03-34.png (294×462 px, 30 KB)

Event Timeline

screenshots are generated on shutterbug ( they're on the server now, I hope the UI will also show them at some point...)

There are a few issues with the banners:

  • When clicking the €5 button in the variant banner, the amount is selected in the form. But clicking the submit button shows an error message that asks for selecting an amount.
  • Apparently a remainder of the "Hi" test (mobile-de-03), the sentence "Vielleicht kommen wir gerade ungelegen..." should start with a capital letter.
  • The content of the use of funds overlay is broken:

Looks like this:

Screenshot from 2022-09-26 12-34-58.png (476×334 px, 52 KB)

Should be:

Screenshot from 2022-09-26 12-34-47.png (476×334 px, 44 KB)

@CorinnaHillebrand_WMDE Sorry, but not quite. The capital V needs to be in the expanded banner as well. And the use of funds overlay is mostly fixed, but the font size of the categories is still too small:

Screenshot from 2022-09-27 08-52-47.png (452×401 px, 38 KB)

Screenshot from 2022-09-27 08-52-42.png (452×401 px, 46 KB)

Since the start is delayed by one day, can you change the campaign parameters? Everything else looks good.

CorinnaHillebrand_WMDE renamed this task from 🎬️ mobile-de-05 | Put anchor amount into button label | ⏰ September 26th to 🎬️ mobile-de-05 | Put anchor amount into button label | ⏰ September 27th.Sep 27 2022, 8:14 AM
CorinnaHillebrand_WMDE moved this task from Doing to Review on the WMDE-FUN-Sprint-2022-09-19 board.

question for @kai.nissen:
appearantly the font family for our current mobile banners is
$banner-font-family: 'Lato', 'Arial', 'Helvetica', 'Verdana', sans-serif;

I don't know how it got in there or what was the exact reason for adding Lato (google font) as the first default font.
Abban discovered that the mobile banners look different on his device because he has Lato installed.
For me (and I guess for testingbot too) it falls back to using "Arial".
For people who have Lato installed, the font-size makes the banner look a bit broken.

As far as I could find out, roboto was the new default typeface on android devices at least starting from 2016.

Should we support the Lato font?

Oh, that's what the screenshot was about?

Screenshot 2022-09-29 at 07.26.00.png (371×318 px, 34 KB)

I added a nowrap style to the orange button now, shutterbug should show the changes in 30-60 minutes.