1124826 - design for small net neutrality homepage promo. live february 5

Status: RESOLVED FIXED

(Marketing :: Design, task)

Description

[Jennifer Bertsch [:jbertsch]]

Hi-

Could you please create a small "net neutrality" promo for the homepage?

To be live Feburary 5.

Thx,
Jen

Comment 1

[Jennifer Bertsch [:jbertsch]]

Hi Andrea and MJ-

Could you please provide any addition creative direction?  Do we know what the copy will be?

Thx,
Jen

Comment 2

[M.J. Kelly]

Hi Jen,

I will have copy by next Thursday. Will that work for creative direction, too?

Thanks!

Comment 3

[Jennifer Balaco]

Jen, 

When do you need the final promo files? 

M.J., 
I'm a little worried that getting copy/direction on Thursday only leaves a couple of days to get design done.

Comment 4

[Jennifer Bertsch [:jbertsch]]

Hi-

To reiterate what the other Jenn B said in the comment above, this one is at risk without some design/creative direction asap.

Thx,
Jen

Comment 5

[M.J. Kelly]

Here's copy: Protect net neutrality before it’s too late.

For a visual, we're thinking an hourglass with the sands running out. 

CTA (sans tracking): https://sendto.mozilla.org/page/s/FCCvote-net-neutrality

Comment 6

[Matej Novak [:matej]]

(In reply to M.J. Kelly from comment #5)
> Here's copy: Protect net neutrality before it’s too late.

That's a lot of words for a small promo. Can we say "Protect net neutrality now" instead? Then the hourglass could communicate the "time running out" aspect.

Comment 7

[Jennifer Bertsch [:jbertsch]]

Thanks, MJ!

Has anyone already created an hour glass visual?  Ty or Lee?

Comment 8

[M.J. Kelly]

Can we try both lines of copy in layout to see how they flow with a graphic?

Comment 9

[Matej Novak [:matej]]

(In reply to M.J. Kelly from comment #8)
> Can we try both lines of copy in layout to see how they flow with a graphic?

We can try, but in general we're trying to keep the small promos to 5 words or fewer. There isn't a lot of space to play with.

Comment 10

[Lee Tom]

Hi all, 
Just wondering you think it might be confusing creating a new graphic to associate with Net Neutrality VS using the "N" icon you see here:
https://advocacy.mozilla.org/

I understand the idea is convey urgency, but the "N" might be a clearer indication of the subject matter on first-glance.


(In reply to Jennifer Bertsch [:jbertsch] from comment #7)
> Thanks, MJ!
> 
> Has anyone already created an hour glass visual?  Ty or Lee?

Comment 11

[Ty Flanagan]

A few things -

1. Which tile will this be replacing? Im just wondering about tile color considerations.

2. We can use an hourglass, but we do have a NET NEUTRALITY image (https://advocacy.mozilla.org/wp-content/uploads/2014/08/Net_Neutrality_Logo_Solid.png) on the advocacy page we can use to. It does feel like a more impactful visual over the hourglass

3. The copy option "Protect net neutrality before it’s too late" is a bit too long for the smaller tile. 
Id also recommend a shorter option like Matej suggested in Comment 6

Comment 12

[Matej Novak [:matej]]

+1 to using the existing logo. Let's not invent something new if we don't have to, especially since this won't be up very long. Thanks.

Comment 13

[M.J. Kelly]

I don't think that logo is getting used in the campaign at this point. I could be wrong, but I haven't seen it in any of our meetings. Tagging Andrea for thoughts.

Comment 14

[Jennifer Bertsch [:jbertsch]]

(In reply to tflanagan from comment #11)
> A few things -
> 
> 1. Which tile will this be replacing? Im just wondering about tile color
> considerations.
> 
> 2. We can use an hourglass, but we do have a NET NEUTRALITY image
> (https://advocacy.mozilla.org/wp-content/uploads/2014/08/
> Net_Neutrality_Logo_Solid.png) on the advocacy page we can use to. It does
> feel like a more impactful visual over the hourglass
> 
> 3. The copy option "Protect net neutrality before it’s too late" is a bit
> too long for the smaller tile. 
> Id also recommend a shorter option like Matej suggested in Comment 6

This will replace the small Advocacy promo.

Comment 15

[Andrea Wood [:andreawood]]

Hi all -- a little background: 

The uniting campaign imagery as established by the coalition is the "loading" icon (see: https://www.battleforthenet.com/countdown/). We discussed internally months ago (incl. Eric Petitt and others) and determined that was not something we wanted to display as it could signal to Firefox users that our products are slow. So, we've been coming up with our own imagery for the campaign.

For our part:
This logo was only used on the homepage: https://advocacy.mozilla.org/wp-content/uploads/2014/08/Net_Neutrality_Logo_Solid.png and while I know studiomofo developed it, it hasn't been used anywhere else because it isn't effective. It doesn't say anything about the campaign itself, it doesn't signal any call to action to a user, and in fact I think it's probably confusing to most people what it actually is.

My strong preference is that we not have icons or logos associated with our campaigns. We want people to see a call to action and act, the "branding" or "marketing" aspect of a campaign is much less important (we're not associating long-term affinity with a particular brand, wordmark, or logo). Using a logo for a campaign like this paints us into a corner and doesn't help get more people to respond (the goal). 

For instance, in this case, it's recycling this design could signal to people who already signed or took action on the previous petition that this is nothing new -- but it is. We do need to reinforce that this is a NEW stage in the campaign and we need past action-takers to act again given the urgency. The consistency across channels comes from two things: 1) the mozilla wordmark; and 2) the urgent countdown to Feb 26th. 

I hope this is helpful -- Matej if Ty doesn't have time or if resources are tight I can try to see if studiomofo can come up with an hourglass or some other signal that this is a very urgent moment for NN.

Comment 16

[Matej Novak [:matej]]

Hi Andrea,

I'm a little confused. You said you don't want a logo or icon, but then you're asking about the hourglass. Maybe it's just a matter of terminology, but I want to make sure I understand what you're looking for.

You also mention the Mozilla wordmark and the date. Are those both supposed to be in the promo as well?

We're dealing with a really small space, so we can really only have two elements: a visual and a CTA.

To help drive the urgency, what if we did a calendar image with Feb. 26 on it (instead of an hourglass) and copy like "Protect net neutrality today"?

Comment 17

[Andrea Wood [:andreawood]]

hi Matej -- by "logo or icon" i mean one image that persists (like a wordmark) during the entire lifetime of a campaign. Imagery should change up based on what the call to action is. hope that helps! 

A calendar is fine, it gets the idea across that 1) this is a new moment; and 2) there's a short time to act. It's too bad the space is so small. The FCC vote deadline is a new moment, where "Protect net neutrality today" doesn't really signal anything new for people who may have already clicked a NN tile in the past. SPace is tight in that block, so i don't think there's much more we could fit in there, so that language fine (i also don't want to belabor this).

Maybe between campaigns we could come up with a standard icon that signals "urgency" regardless of the campaign that we *only* use in moments like this? Something that says (!) but we only use it maybe 2-3 x a year when there's a real (!) policy moment. Something to think about!

Comment 18

[Lee Tom]

Attachment: Screen Shot 2015-01-28 at 2.21.47 PM.png

Here are a few iterations of the calendar image. I thought adding a few red marks, as if someone jotted them down as a reminder to themselves, would help emphasize that it was a good date to remember.  

Let me know what you think.

Comment 19

[M.J. Kelly]

Hi Lee,

I'm answering for Andrea and me, let's go with the first one with the date circled. Thanks!

M.J.

Comment 20

[Lee Tom]

Attachment: net-neutrality_calendar-graphic_256x256.png

I'm not sure what size you need exactly, so I saved this PNG out a bit big so you can scale down if necessary. Let me know if you have any problems with it.

Comment 21

[Mike Alexis [:malexis]]

We'll need final copy and design ASAP in order to get this live on Thursday. Is there any update?

Comment 22

[Matej Novak [:matej]]

(In reply to Mike Alexis [:malexis] from comment #21)
> We'll need final copy and design ASAP in order to get this live on Thursday.
> Is there any update?

I'm not sure where we landed on copy. Here are the two options I suggested:

Protect net neutrality now

Protect net neutrality today

I think they both work with the calendar image, but I'm not sure who needs to approve.

Also, what more do we need from Lee?

Comment 23

[Craig Cook (:craigcook)]

(In reply to Lee Tom from comment #20)

> I'm not sure what size you need exactly, so I saved this PNG out a bit big
> so you can scale down if necessary. Let me know if you have any problems
> with it.

If you have a vector version I can convert to SVG we won't need to worry about sizes or retina. I'm still on an old copy of Illustrator (I know, I know) so if you can save an .ai or .eps a few versions back that'll work.

And if you don't have vectors at all the 256 PNG will work just fine.

Comment 24

[M.J. Kelly]

I think: Protect net neutrality today.

Comment 25

[Lee Tom]

Attachment: net-neutrality_urgency.svg

Heya Craig, here's an SVG for you

Comment 26

[Craig Cook (:craigcook)]

(In reply to Lee Tom from comment #25)

> Heya Craig, here's an SVG for you

Perfecto! Thanks.

I think the only other design input we need is choosing a background color, which somewhat depends on the particular mix of other promos this will appear with. I'll get the page updated and post a screenshot here, then you can suggest a final color for this promo once you see it in situ.

Comment 27

[Craig Cook (:craigcook)]

Attachment: Screenshot, net neutrality home promo

Sorry I didn't get this posted earlier in the day. Here's the promo in situ, using the same blue background as the Advocacy promo for now (which doesn't look half bad, honestly). Do you want to stick with this blue or try something else?

Comment 28

[Andrea Wood [:andreawood]]

Here's a unique tracking link for the homepage promo:
https://sendto.mozilla.org/page/s/FCCvote-net-neutrality?ref=20150205Advocacy_NN&utm_campaign=20150205Advocacy_NN&utm_source=mozilla.org&utm_medium=referral&utm_content=homepage_promo

Let me know if you have any Qs  - a

Comment 29

[Lee Tom]

I think that looks great, Craig. Ship it! 

(In reply to Craig Cook (:craigcook) from comment #27)
> Created attachment 8558822 [details]
> Screenshot, net neutrality home promo
> 
> Sorry I didn't get this posted earlier in the day. Here's the promo in situ,
> using the same blue background as the Advocacy promo for now (which doesn't
> look half bad, honestly). Do you want to stick with this blue or try
> something else?

Comment 30

[M.J. Kelly]

I'd love to get this image scaled for a snippet icon and for a social media graphics (Twitter and Facebook with Firefox logo). Is it OK to make that request here or should I file a new bug?

Comment 31

[Matej Novak [:matej]]

(In reply to M.J. Kelly from comment #30)
> I'd love to get this image scaled for a snippet icon and for a social media
> graphics (Twitter and Facebook with Firefox logo). Is it OK to make that
> request here or should I file a new bug?

Lee, is this simple enough that we could do it here or would you prefer a new bug?

Comment 32

[Jennifer Bertsch [:jbertsch]]

(In reply to Lee Tom from comment #29)
> I think that looks great, Craig. Ship it! 
> 
> (In reply to Craig Cook (:craigcook) from comment #27)
> > Created attachment 8558822 [details]
> > Screenshot, net neutrality home promo
> > 
> > Sorry I didn't get this posted earlier in the day. Here's the promo in situ,
> > using the same blue background as the Advocacy promo for now (which doesn't
> > look half bad, honestly). Do you want to stick with this blue or try
> > something else?

+1 Craig and Lee.  This is looking great.  Ship it! And thank you!!!! :)

Comment 33

[Lee Tom]

I'd prefer these requests in a new bug, please. 

MJ, would you include specific requirements per asset in the new bug. ie: dimensions, file-type, file-size (limitations), and a brief description of the asset. 

I can't imagine these taking a long time to create, but I just want to avoid any unnecessary cycles. For example, "...social media graphics (Twitter and Facebook with Firefox logo)" could be more specific. 

Thanks!



(In reply to Matej Novak [:matej] from comment #31)
> (In reply to M.J. Kelly from comment #30)
> > I'd love to get this image scaled for a snippet icon and for a social media
> > graphics (Twitter and Facebook with Firefox logo). Is it OK to make that
> > request here or should I file a new bug?
> 
> Lee, is this simple enough that we could do it here or would you prefer a
> new bug?

Comment 34

[M.J. Kelly]

Thanks, it'll be very explicit. Filing the bug now. Thanks!

Comment 35

[M.J. Kelly]

Posted here: https://bugzilla.mozilla.org/show_bug.cgi?id=1129509

Comment 36

[Lee Tom]

Thanks, M.J.!

(In reply to M.J. Kelly from comment #35)
> Posted here: https://bugzilla.mozilla.org/show_bug.cgi?id=1129509

Comment 37

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/f588ff8d440359d5d50d55fedfd31ca06a3c0cd0
Fix bug 1124826 - Net Neutrality home promo

Also removing the January 28 privacy day promo, but keeping the longer-running privacy promo for now.

https://github.com/mozilla/bedrock/commit/39bd07c13d1256a74842c2523117962b573e520b
Merge pull request #2707 from craigcook/bug-1124826-net-neutrality-home-promo

Fix bug 1124826 - Net Neutrality home promo