1172673 - Replace Webmaker tiles on mozilla.org homepage

Status: RESOLVED FIXED

(www.mozilla.org :: Pages & Content, defect)

Description

[Kevin Zawacki]

Replace the two existing Webmaker tiles on mozilla.org (ie "Make the Web you want" and "Build an app in seconds.")

The large Webmaker tile ("Make the Web...") can be changed to a Maker Party promotion. Copy: (Hed) Get creative at this year's Maker Party / (Rollover) Join Mozilla and help teach the Web / (Link text) Join the party [teach.mozilla.org/events]

The small Webmaker tile ("Build an app...") can be changed to a Webmaker app promotion. Copy: (Hed) Create. Share. Discover. (+Webmaker logo) / (Link) beta.webmaker.org

Note: Design updates are needed, too.

Comment 1

[Jennifer Bertsch [:jbertsch]]

Thanks Kevin!

Could you please provide some creative direction/assets for the design direction?

Comment 2

[Kevin Zawacki]

Sure! 

For the larger Maker Party tile:
--We can use the very first logo listed here: https://teach.mozilla.org/events/resources/#logo-assets ("Maker Party" in the hexagonal speech bubble.)

For the smaller Webmaker app tile:
--The graphic currently being used on the large Webmaker tile (the "m" with a needle and thread) works just fine.

Comment 3

[Matej Novak [:matej]]

(In reply to Kevin Zawacki from comment #0)
> Replace the two existing Webmaker tiles on mozilla.org (ie "Make the Web you
> want" and "Build an app in seconds.")
> 
> The large Webmaker tile ("Make the Web...") can be changed to a Maker Party
> promotion. Copy: (Hed) Get creative at this year's Maker Party / (Rollover)

I'm a little worried about the length on this one. Let's try it, but if it's too long, I would suggest:

Get creative at Maker Party


> Join Mozilla and help teach the Web / (Link text) Join the party
> [teach.mozilla.org/events]

The rollover state copy should have punctuation:

Join Mozilla and help teach the Web.


Thanks.

Comment 4

[Erika Drushka]

Jen, we're redesigning the Webmaker logo (changing the "m" with needle and thread). Final logo should be done in the next day or two.

Comment 5

[Kevin Zawacki]

(In reply to Matej Novak [:matej] from comment #3)
> (In reply to Kevin Zawacki from comment #0)
> > Replace the two existing Webmaker tiles on mozilla.org (ie "Make the Web you
> > want" and "Build an app in seconds.")
> > 
> > The large Webmaker tile ("Make the Web...") can be changed to a Maker Party
> > promotion. Copy: (Hed) Get creative at this year's Maker Party / (Rollover)
> 
> I'm a little worried about the length on this one. Let's try it, but if it's
> too long, I would suggest:
> 
> Get creative at Maker Party
> 
> 
> > Join Mozilla and help teach the Web / (Link text) Join the party
> > [teach.mozilla.org/events]
> 
> The rollover state copy should have punctuation:
> 
> Join Mozilla and help teach the Web.
> 
> 
> Thanks.

Hi Matej, the shortened version is OK by me. Thanks.

Comment 6

[Kevin Zawacki]

A brief update -- the copy on the small Webmaker tile should be reordered to read: "Discover. Create. Share."

Comment 7

[Erika Drushka]

Attachment: Webmaker-lockups.ai

Comment 8

[Erika Drushka]

Attachment: webmaker-lockup.png

Comment 9

[Erika Drushka]

Attachment: Webmaker-ICON.svg

Comment 10

[Erika Drushka]

Attachment: Webmaker-ICON.ai

Comment 11

[Erika Drushka]

I've attached our new logos. Please flag me if you need these in different sizes/formats. Thank you.

Comment 12

[Craig Cook (:craigcook)]

(In reply to Erika Drushka from comment #11)
> I've attached our new logos. Please flag me if you need these in different
> sizes/formats. Thank you.

To be clear, is this replacing the stitched m for all of Webmaker? Should we be changing that logo everywhere? (it appears on a few other pages but we can start with the home page in this bug)

Comment 13

[Erika Drushka]

Yes, this new design replaces the stitched M everywhere. We've got a list of assets that need changing here: https://docs.google.com/spreadsheets/d/19v3SW-oX68t4R8uZ9NMkRS36beyKAXIzHS0d3zgU26I/edit#gid=0 Please feel free to add to it.

Comment 14

[Erika Drushka]

Attachment: Webmaker-lockups&color-RGB.ai

Comment 15

[Erika Drushka]

This file (Webmaker-lockups&color-RGB.ai) includes the colour palette.

Comment 16

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/1d2c6e76ac3b7fd5d581eff7dc92691050f393c4
Fix bug 1172673 - replace home page webmaker promos

Plus new Webmaker logo

https://github.com/mozilla/bedrock/commit/1e1d5b8800868fc345be4a6c686e9d0aac798052
Merge pull request #3064 from craigcook/bug-1172673-webmaker-home-promos

Fix bug 1172673 - replace home page webmaker promos

Comment 17

[Craig Cook (:craigcook)]

Attachment: Home promos, Craig's version

So... I managed to completely overlook the mockups attached to bug 1172771 and instead took a my own liberties with these promos based on the design guidance in this bug and following the Maker Party color scheme. I've attached a screenshot of my version (also visible at https://www-dev.allizom.org/en-US/ but not yet in production).

I can easily update the promos to match the design from the other bug before it goes to prod but wanted to run this by Jen and Ty first, just in case you prefer my version after all.

Sorry for the mixup.

Comment 18

[Matej Novak [:matej]]

Hi Craig,

These look good, but I think the big promos are supposed to have a one-color image/logo. The type color isn't consistent on that one either.

The small one looks good to me.

Ty, anything to add?

Comment 19

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/954b6dbb31744b83a03506ac216cc648d752bbd5
Bug 1172673 - update Maker Party promo

Changing the color scheme

https://github.com/mozilla/bedrock/commit/b0284d5408a509a67c7a75f9eebd187d1f49a48a
Merge pull request #3067 from craigcook/bug-1172673-webmaker-home-promos

Bug 1172673 - update Maker Party promo

Comment 20

[Craig Cook (:craigcook)]

Rather than delay any further I played it safe and changed it to match Ty's design that everyone had already seen and approved.

Comment 21

[Matej Novak [:matej]]

(In reply to Craig Cook (:craigcook) from comment #20)
> Rather than delay any further I played it safe and changed it to match Ty's
> design that everyone had already seen and approved.

How does the new Webmaker logo look on the blue background. Could we see a preview before it goes live?

Comment 22

[Craig Cook (:craigcook)]

Attachment: Home promos, final version

I think the new logo works quite well on the bright blue. Screenshot attached and you can see this currently on https://www-dev.allizom.org

Comment 23

[Matej Novak [:matej]]

Looks great, thanks.

Comment 24

[Kevin Zawacki]

Looking awesome! Thanks, Craig.

A quick note on the copy. Per bug 1172771, we updated the "Create. Share. Discover." copy to "Try the new Webmaker."

Comment 25

[Craig Cook (:craigcook)]

Filed https://github.com/mozilla/bedrock/pull/3074 to update the copy.

Unfortunately the previous string was already exposed for l10n and translated in a few locales, so this is a string change with some impact on l10n. We'll end up with two variations of the Webmaker promo with some locales showing the old headline until they can translate the new one (which hopefully won't take long).

Comment 26

[Craig Cook (:craigcook)]

(In reply to Craig Cook (:craigcook) from comment #25)

> Unfortunately the previous string was already exposed for l10n and
> translated in a few locales, so this is a string change with some impact on
> l10n. We'll end up with two variations of the Webmaker promo with some
> locales showing the old headline until they can translate the new one (which
> hopefully won't take long).

Oops, correction: We've removed the old headline entirely, even though some locales had already translated it. So only one version, and it'll just take a little time to get the new one translated in place of the old one.

Comment 27

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/8b6ddf5f6c2adcbfdadf93e45ba1765fde125a64
Bug 1172673 - Update Webmaker promo copy

https://github.com/mozilla/bedrock/commit/67bfe0a030c8f86bcaf68c3a9ddae72358472111
Merge pull request #3074 from craigcook/bug-1172673-webmaker-home-promos

Bug 1172673 - Update Webmaker promo copy