1086950 - year-end fundraising campaign: Homepage promotion design

Status: RESOLVED FIXED

(Marketing :: Design, task)

Description

[Andrea Wood [:andreawood]]

>>Project/Request Title:
year-end fundraising campain: Homepage promotion design

>>Project Overview:
In 2013 we increased revenue from the mozilla.org homepage by over 530% over 2012. Total raised: $65,000 USD+
-- (EOY 2013 designs are in this bug, for reference: https://bugzilla.mozilla.org/show_bug.cgi?id=941249)

This homepage promotion design is one part of our homepage strategy for our fundraising campaign coming up this year. 

Live November 15 - January 3:
Tabzilla image
Tabzilla text link
Homepage promotion (main)
Footer link

Full creative brief for EOY2014:
https://docs.google.com/a/mozillafoundation.org/document/d/1B_aNU2fXJaCE5gXNLEzKaETFdBOuHcpdiLBcXgaeEBI/edit

>> Creative Help Needed:
Copy:    No 
Design:  Yes 
Video:   No 
Other:  No

>>Creative Specs:
**Please use whiteboard [EOYFR2014] on any bugs related to end of year (EOY) fundraising***

Final deliverable: A promotional "block" for EOY fundraising campaign that will be live November 15 - January 3rd on the main front page of mozilla.org. 



>>CTA and Design:
Design References:
EOYFR2014 Tabzilla design by StudioMofo: 
https://bugzilla.mozilla.org/show_bug.cgi?id=1075959

redpen: https://redpen.io/ko4063e3cd3208d818 

Copy direction is very simple:
Protect the open Web. Support Mozilla. Donate Now. (alt shorter version: Support Mozilla. Donate Now.)

If possible we want to include amount selection right on the design, that carries onto the form itself (we did this last year for reference: https://bugzilla.mozilla.org/show_bug.cgi?id=941249#c6) Amounts should be $10 and $25 with default selection $25 (average donation is $28 on homepage).
*Amount selection on the homepage increases conversion rate for donation*

>>Creative Due Date:
2014-11-07

>>Launch Date:
2014-11-17

>>Mozilla Goal:
Org Support

>>Points of Contact:
[e-mail], [e-mail], [e-mail], [e-mail]

Comment 2

[hannah:hkane]

Hi Andrea and Jennifer—just wanted to get a status

Comment 3

[Jennifer Balaco]

Hi Hannah, 

Assigning this over to Ty now. However, he is finishing up the last of the Firefox 10th work. Once that's done, he'll get started on this. Thanks!

Comment 4

[Jennifer Balaco]

Hi Andrea + Hannah, 

Can you provide a little more information on what design assets you need? We're trying to figure out if it is a homepage takeover or if it's a Promo Tile and Tabzilla update? Also it looks like a Tabzilla banner ad was done by Sabrina. How does that relate to this work? 

Thanks!

Comment 5

[Andrea Wood [:andreawood]]

November 17 - December 25:
1. Homepage Promo Tile (is that what you're calling the homepage blocks? Just making sure we're not talking about Directory / Default Tile)
2. Tabzilla image
3. Tabzilla "donate" link (already there)
4. Footer "donate" link (already there)

December 26 - Jan 1:
Homepage takeover, whatever we can get (or just keep what's live on the 25th) 

Sabrina created a Tabzilla design:
https://redpen.io/ko4063e3cd3208d818 and files are in this bug https://bugzilla.mozilla.org/show_bug.cgi?id=1075959 (comment 6 notes some outstanding uncertainty about final color palette and design direction)

Sabrina also did some initial work on homepage promo, but stopped because the specs weren't in stone and I didn't want her to waste more time:
https://redpen.io/gt23b2b2036ec5460d (scroll left and right to see her variations)

We needed to get started on assets or we'd run out of time by the time the campaign started. Appreciate your help in 1) finalizing the homepage promo tile design; and 2) homepage takeover design.

Jen was also going to double check to see if we could add "DONATE" during the campaign to the main navigation here: http://note.io/1tGD6NU

Comment 6

[Andrea Wood [:andreawood]]

another reference redpen is our campaign blog:
https://redpen.io/vhac2b475988e038e3

It will be at fundraising.mozilla.org (no action needed, just sharing for design reference).

a

Comment 7

[Jennifer Bertsch [:jbertsch]]

Hey-

Just wanted to see if I could help move this forward.  Do we have final copy somewhere?  I thought we did but I can't find it.

Did we decide that Ty should make the promo because they are so new?

I totally don't remember where we left this.

Thx,
Jen

PS  Do you have the urls you want us to link to?  Also, is Nov 17 the live date?

Comment 8

[Andrea Wood [:andreawood]]

Yes, my understanding is that Ty / Matej were game to make the promo.

Copy was discussed in a way-back email thusly:

(from Matej):
I would suggest something like "Help Protect the Open Web" as the headline (or "Help Us Protect…") and then something along the lines of "Support our non-profit mission" on the hover state, with a "Donate now" CTA.

I also would say that "Donate now" should be visible without having to hover or click. That's what we know people look for when they land on the page and want to give.

Comment 9

[Andrea Wood [:andreawood]]

on the URLs -- no we don't yet have them. Can you tell me the date when you'll need them?

Also, this should be localized at minimum we will fully localize our primary form for: DE, FR, PTBR, ID, LA-SP (USEN version here: https://sendto.mozilla.org/page/contribute/givenow-1page)

We also are aiming to have a simple PayPal form for the following:
Hong Kong Dollar (HKD)
Philippine Peso (PHP)
Australian Dollar (AUD)
Hungarian Forint (HUF
Polish Zloty (PLN)
Brazilian Real (BRL)
Israeli New Shekel (ILS)
Russian Ruble (RUB)
British Pound (GBP)
Japanese Yen (JPY)
Singapore Dollar (SGD)
Canadian Dollar (CAD)
Mexican Peso (MXN)
Swedish Krona (SEK)
Czech Koruna (CZK)
New Taiwan Dollar (TWD)
Swiss Franc (CHF)
Danish Krone (DKK)
New Zealand Dollar (NZD)
Thai Baht (THB)
Euro (EUR)
Norwegian Krone (NOK)

(SEE example: https://sendto.mozilla.org/page/content/2014-donate-MXN/)

These forms will be able to stay live after the campaign closes.

Comment 10

[hannah:hkane]

Wondering if there are any blockers preventing this one from moving forward?

Comment 11

[Jennifer Bertsch [:jbertsch]]

(In reply to hannah from comment #10)
> Wondering if there are any blockers preventing this one from moving forward?

Just time!  What is the target live date?  November 17?

Comment 12

[Jennifer Bertsch [:jbertsch]]

Matej, MJ and I are meeting later today and then we'll be ready to move forward.  Please let us know the live date for this one.  Thx.

Comment 13

[hannah:hkane]

November 17th. Thank you!

Comment 14

[Jennifer Bertsch [:jbertsch]]

MJ will write copy for a big promo spot and a small promo spot.

Ty - could you think about an icon for for a big Donate promo tile?

Comment 15

[Jennifer Bertsch [:jbertsch]]

Ty- and an image for a small one?

Comment 16

[Ty Flanagan]

promo tile images - will do!

Will there be a need to do a homepage takeover too?

Comment 17

[Jennifer Bertsch [:jbertsch]]

Hi Flod and Pascal-

Please see comment 9.  We'll have copy this week.  And can roll out localizations as they come in.

Thx,
Jen

Comment 18

[Jennifer Bertsch [:jbertsch]]

Hi Ty-

We could do a homepage takeover for the last 5 days of the campaign.  Do you have time to design something?  It is totally optional.

Thx,
Jen

Comment 19

[Ty Flanagan]

I can definitely put something together. We could use this creative to create the takeover:  http://cl.ly/image/1e0M2y2O312i

Andrea, do you know where I can get the PSD for this artwork?

Comment 20

[Andrea Wood [:andreawood]]

Sabrina can share with you, flagged for need info.

Comment 21

[Sabrina Ng [:sabrina]]

Here is the .psd file for the crowd graphic: https://www.dropbox.com/s/axnxt0k96a3sjrf/MozillaCrowd_EOYVersion.psd?dl=0


It was adapted from the firefox affiliates graphic and the original version can be found here if you need it as well: https://www.dropbox.com/s/x3cz53knbh4v4kq/firefox_affiliates_home_crowd_940.psd?dl=0

Comment 22

[Ty Flanagan]

Attachment: MozOrg_Homepage_EOYFundraiser2014_Takeover.jpg

Thanks Sabrina!

Andrea and Jen,

Here is a mockup of the takeover window

Comment 23

[Ty Flanagan]

Attachment: MozOrg_Homepage_EOYFundraiser2014_PromoTiles_offState_1.jpg

Homepage promo tile - glyph option A

Comment 24

[Ty Flanagan]

Attachment: MozOrg_Homepage_EOYFundraiser2014_PromoTiles_offState_2.jpg

Home Promo Tile - Glyph option B (re-used from last years EOY campaign)

Comment 25

[Ty Flanagan]

Attachment: MozOrg_Homepage_EOYFundraiser2014_PromoTiles_HoverState.jpg

and the hover/selected state

Comment 26

[Andrea Wood [:andreawood]]

Comment on attachment 8521770 [details]
MozOrg_Homepage_EOYFundraiser2014_Takeover.jpg

I really like this Ty! Is it possible to also pull in the real-time data for the totalizer? We're doing that on fundraising.mozilla.org, just not sure of the back-end requirements. Would be cool!

I also think we could tighten the sub-heading language under "help protect the open web" so it was one short sentence. I can help with that copy.

Comment 27

[Jennifer Bertsch [:jbertsch]]

+ Craig for his thoughts on the data piece.  I'm not sure I want to go to crazy over the holidays when we won't be fully staffed in case the feed breaks.

Comment 28

[Craig Cook (:craigcook)]

If data is available in a reliable form we can certainly display it, though I'm not sure about doing it "in realtime." I don't know that we would be able to watch numbers roll over live as each donation comes in but it could update with a chron job every half hour or so. Where is the data coming from?

If this takeover only runs for the last few days of the campaign, when would that be date-wise? And when does the Fx10 takeover end? I'd worry about the impression of doing another takeover too soon after the previous one. This sort of thing should be rare and special, lest it become annoying and predictable.

Comment 29

[Jennifer Bertsch [:jbertsch]]

Thanks, Craig.  We'll take down the Fx 10 promo before Thanksgiving and the Donate one would go up approx Dec 26-Jan 2.

Andrea - who could we talk to about the source of the data?

Comment 30

[Andrea Wood [:andreawood]]

That would be Mavis or Adam. Flagging both for needinfo.

Comment 31

[Andrea Wood [:andreawood]]

on the takeover: I might also recommend that we report the # of donors vs. the total amount of $ -- that's because we don't actually have a goal, so the information is a bit out of context. We're not using the message "help us reach our goal, we're almost there" next to the total raised, so it's a bit awkward. By the time the takeover goes live we should have over 60,000 donors, so a significant #. That might create peer pressure to give.

on the homepage promo designs:
The heart sign is preferred over last year's "M" -- but did you decide against our new "M" design we've established for tabzilla: https://redpen.io/ko4063e3cd3208d818? Just want to make sure you saw that M and the color palette we established. Let me know if you decided against it, I want to make sure we try to align our look and feel X channels.

On the copy -- the word "donate" needs to be present on the offstate. We know from data people come to the homepage looking for a "donate" word to click on, so we want to make that easy by surfacing it.  I don't think the promo as-is makes it obvious it's intended for donors, it could be about anything ("help support the open web"). Maybe change to "Donate to support the open web"?

Comment 32

[Adam Lofting (:adamlofting)]

(In reply to Jennifer Bertsch [:jbertsch] from comment #29)
> Andrea - who could we talk to about the source of the data?
(In reply to Andrea Wood from comment #30)
> That would be Mavis or Adam. Flagging both for needinfo.

Fundraising.m.o will be pulling it's raw data from PayPal and Google Analytics. I'm not sure if it will be storing a caching a copy of that data as a middle-layer (question for Mavis).

--

As a suggestion that could save on development time, can we (Mavis and any other MoFo devs) build that banner for fundraising.m.o as an embeddable block of code that you can just drop into the homepage? (and any other Mozilla page that wants to support EOY).

It's also worth us noting the volume of traffic to mozilla.org home, as the counters / graphs we build need sufficient caching so they don't fall over. This will be much more traffic that will land on fundraising.m.o

(In reply to Craig Cook (:craigcook) from comment #28)
> I'm not sure about doing it "in realtime." I don't know that we would be
> able to watch numbers roll over live as each donation comes in but it could
> update with a chron job every half hour or so. Where is the data coming from?

I wouldn't expect the homepage numbers to refresh after the page has loaded, but we could have an API end point that reports the current total and this get's used on page load. 

I've run optimization tests in the past that found that even though the page is loading a static number (the current total), it's beneficial to animate the numbers ticking up to the current total on page load. It feels more live that way.

Comment 33

[Matej Novak [:matej]]

(In reply to tflanagan from comment #23)
> Created attachment 8521771 [details]
> MozOrg_Homepage_EOYFundraiser2014_PromoTiles_offState_1.jpg
> 
> Homepage promo tile - glyph option A

Hey Ty,

These look great. I believe the large promo is going to replace the SUMO tile, so we need a horizontal layout (Jen or MJ, is that correct?).

MJ is working on revising the promo headline so it says "donate" as well. Andrea, her and I can also help with the takeover copy, if you like.

We also need a graphic and design for a small promo, per comment 15.

Thanks.

Comment 34

[Ty Flanagan]

(In reply to Andrea Wood from comment #31)
 
> on the homepage promo designs:
> The heart sign is preferred over last year's "M" -- but did you decide
> against our new "M" design we've established for tabzilla:
> https://redpen.io/ko4063e3cd3208d818? Just want to make sure you saw that M
> and the color palette we established. Let me know if you decided against it,
> I want to make sure we try to align our look and feel X channels.

Ah right! Ill switch it to the 'm' for consistency.

Comment 35

[Ty Flanagan]

(In reply to Matej Novak [:matej] from comment #33)
 
> These look great. I believe the large promo is going to replace the SUMO
> tile, so we need a horizontal layout (Jen or MJ, is that correct?).

I heard rumblings that it might be the Open Standard tile... but a horizontal tile is doable either way.
Can you let me know what the 4 large tiles will be when this campaign launches then?

> We also need a graphic and design for a small promo, per comment 15.

Yup, not a problem. I should check to see if theres a copy deck, but does this smaller tile mirror the larger version - content wise?

Comment 36

[Matej Novak [:matej]]

(In reply to tflanagan from comment #35)
> (In reply to Matej Novak [:matej] from comment #33)
>  
> > These look great. I believe the large promo is going to replace the SUMO
> > tile, so we need a horizontal layout (Jen or MJ, is that correct?).
> 
> I heard rumblings that it might be the Open Standard tile... but a
> horizontal tile is doable either way.
> Can you let me know what the 4 large tiles will be when this campaign
> launches then?
> 
> > We also need a graphic and design for a small promo, per comment 15.
> 
> Yup, not a problem. I should check to see if theres a copy deck, but does
> this smaller tile mirror the larger version - content wise?

I think it will just say something like "Donate now" or "Donate to Mozilla."

Setting a needinfo for MJ to let you know what all the promos will be and to give you final copy when it's ready.

Comment 37

[Ty Flanagan]

Andrea,

Can you confirm that the yellow background with the grey "m" was the final color option for this campaign?
Im working with Webdev to ready the visual assets and I just want to make sure were on the right track.

Comment 38

[Andrea Wood [:andreawood]]

Correct! The other alternate colors are secondary options if yellow was not optimum in context.

Comment 39

[M.J. Kelly]

I've talked with Andrea about what works from a giving perspective. Here's what I've come up with, keeping the character count similar to the other home page promos. Matej, Jen... thoughts?

LARGE PROMO: 

[HEADLINE]  Donate to Mozilla

[COPY] Your gift helps us build the Internet the world needs. 

[CTA] Make a donation today 



SMALL PROMO:

Make a donation 

--OR--

Donate to protect the web

Comment 40

[Matej Novak [:matej]]

(In reply to M.J. Kelly from comment #39)
> I've talked with Andrea about what works from a giving perspective. Here's
> what I've come up with, keeping the character count similar to the other
> home page promos. Matej, Jen... thoughts?
> 
> LARGE PROMO: 
> 
> [HEADLINE]  Donate to Mozilla
> 
> [COPY] Your gift helps us build the Internet the world needs. 
> 
> [CTA] Make a donation today 

Would the CTA still work if it just said "Donate today"? I'm a little worried about how much copy there's going to be on the hover state.


> SMALL PROMO:
> 
> Make a donation 
> 
> --OR--
> 
> Donate to protect the web

Are we OK just talking about the "Web" vs. the "Open Web"?

On the whole I think these look great, but I notice that they have a different focus: One talks about building, the other about protecting. I don't think these two promos will ever be live at the same time, but are we OK with that?

Thanks.

Comment 41

[M.J. Kelly]

(In reply to Matej Novak [:matej] from comment #40)
> > 
> > LARGE PROMO: 
> > 
> > [HEADLINE]  Donate to Mozilla
> > 
> > [COPY] Your gift helps us build the Internet the world needs. 
> > 
> > [CTA] Make a donation today 
> 
> Would the CTA still work if it just said "Donate today"? I'm a little
> worried about how much copy there's going to be on the hover state.

Yes, we can shorten the CTA. 



> > SMALL PROMO:
> > 
> > Make a donation 
> > 
> > --OR--
> > 
> > Donate to protect the web
> 
> Are we OK just talking about the "Web" vs. the "Open Web"?
> 
> On the whole I think these look great, but I notice that they have a
> different focus: One talks about building, the other about protecting. I
> don't think these two promos will ever be live at the same time, but are we
> OK with that?
> 
> Thanks.

Andrea, what are your thought here?

Comment 42

[Matt Thompson (@OpenMatt :OpenMatt)]

* [nov14] is past -- please update to [nov28] train or later

Comment 43

[Jennifer Bertsch [:jbertsch]]

Questions:

1.  Is copy final?  If not, when will it be final?

2.  When can we expect the url to link to?

Thanks!

Comment 44

[Andrea Wood [:andreawood]]

Our campaign language is consistently "help build and protect the web" so either or both works great. +1

"protect the Web" is fine, we aren't sticklers for "open Web" -- especially because a lot of people don't know what "open Web" means. So for fundraising it's OK to drop 'open'.

Comment 45

[Jennifer Bertsch [:jbertsch]]

Hey Matej and MJ-

With the recent homepage updates, maybe we can just keep donate in one large tile and gear store in another?

What do you think?  https://docs.google.com/a/mozilla.com/spreadsheet/ccc?key=0Aj3C356pEHIcdDRxeVhWM0JCVF9OVHdhVFFxNHplLVE&usp=drive_web#gid=1

Thx,
Jen

Comment 46

[M.J. Kelly]

I agree with that Jen, pending the gear store going live publicly.

Comment 47

[Matej Novak [:matej]]

(In reply to Andrea Wood from comment #44)
> Our campaign language is consistently "help build and protect the web" so
> either or both works great. +1

Great. And you're OK with both Internet and Web?

> "protect the Web" is fine, we aren't sticklers for "open Web" -- especially
> because a lot of people don't know what "open Web" means. So for fundraising
> it's OK to drop 'open'.

Perfect, thanks. 


(In reply to Jennifer Bertsch [:jbertsch] from comment #45)
> Hey Matej and MJ-
> 
> With the recent homepage updates, maybe we can just keep donate in one large
> tile and gear store in another?

I'll defer to you guys on that, but it sounds good to me. Might be good to keep the small one around, though, in case something unforeseen comes up and we need to juggle things around.

Thanks.

Comment 48

[Andrea Wood [:andreawood]]

Internet is fine!

Here are URLs -- we are still optimizing this form (will be completed today), so ignore the longish load time for the moment. The URL itself is not going to change.

small block promo:
https://sendto.mozilla.org/page/contribute/givenow-1page?preset=2&source=mozillaorg_smallblock&ref=EOYFR2014&utm_campaign=EOYFR2014&utm_source=mozilla.org&utm_medium=referral&utm_content=mozillaorg_smallblock

large block promo:
https://sendto.mozilla.org/page/contribute/givenow-1page?preset=2&source=mozillaorg_largeblock&ref=EOYFR2014&utm_campaign=EOYFR2014&utm_source=mozilla.org&utm_medium=referral&utm_content=mozillaorg_largeblock

takeover:
https://sendto.mozilla.org/page/contribute/givenow-1page?preset=2&source=mozillaorg_takeover&ref=EOYFR2014&utm_campaign=EOYFR2014&utm_source=mozilla.org&utm_medium=referral&utm_content=mozillaorg_takeover

Comment 49

[Craig Cook (:craigcook)]

So, to confirm final copy for the large promo:

[HEADLINE] Donate to Mozilla
 
[COPY] Your gift helps us build the Internet the world needs. 
 
[CTA] Donate today

Correct?

Comment 50

[M.J. Kelly]

Yes, Craig, that is correct. Thanks!

Comment 51

[Jennifer Bertsch [:jbertsch]]

Thanks Craig and MJ.

So for this week, we just need the large promo and the link in the header for the homepage.

(Aren't you at a conference, Craig?)

Comment 52

[Craig Cook (:craigcook)]

(In reply to Jennifer Bertsch [:jbertsch] from comment #51)

> So for this week, we just need the large promo and the link in the header
> for the homepage.

Correct. The gear store promo is in progress but obviously blocked by the gear store actually launching.

> (Aren't you at a conference, Craig?)

There's wifi ;)

Comment 53

[Craig Cook (:craigcook)]

Attachment: Github pull request https://github.com/mozilla/bedrock/pull/2502

Comment 54

[[github robot]]

Commits pushed to master at https://github.com/mozilla/bedrock

https://github.com/mozilla/bedrock/commit/c1fcc14dd5c83a2da8b21dd6e0cfb81bc5c6623c
Bug 1086950 - donate home page promo

Bug 1094494 - donate link in top nav

https://github.com/mozilla/bedrock/commit/e6d37ad8f7652267517e56c066a867d6e33fd3bd
Merge pull request #2502 from mozilla/bug-1086950-fundraising-promos

Bug 1086950 - donate home page promo

Comment 55

[Jennifer Bertsch [:jbertsch]]

Hey Craig-

Are these ready to push to prod today?  Do they need review?

Thx,
Jen

Comment 56

[Craig Cook (:craigcook)]

(In reply to Jennifer Bertsch [:jbertsch] from comment #55)
> Hey Craig-
> 
> Are these ready to push to prod today?  Do they need review?

Yup, it's merged and ready to push.

Comment 57

[Kohei Yoshino [:kohei]]

This is live on prod.