1072476 - Design Fall Campaign promo to Webmaker.org homepage carousel

Status: RESOLVED FIXED

(Webmaker Graveyard :: Design & UX, defect)

Description

[hannah:hkane]

Creative brief TK, but wanted to get this on Cassie's radar. We're hoping we can have a spot on the Webmaker homepage to promote our fall contributor campaign.

Please await further information. :)

Comment 1

[Cassie McDaniel [:cassiemc]]

Hannah, any further requirements for this? Are there any existing design assets for the fall campaign? Not sure how it is being branded or messaged to users. 

Would also love some copy that matches the length/style of existing banners.

Comment 2

[paulj]

Let me put together a creative brief. Should be able to send your way by tomorrow.

Comment 3

[paulj]

Skipping the formal creative brief because not sure it's totally necessary. Copy/Design direction below with a quick overview first: 

Objective: Create a homepage banner that will allow us to direct traffic through new event wizard tool (default/generic landing page version). Intended outcome is more contributors towards our 10K goal. 

At the same time, it will give us feedback on the new flow's effectiveness outside of an audience otherwise made up exclusively of partners. 

The creative challenge is to create some kind of "teaching filter" via copy and design, as the tool is intended to serve mentors/teachers and not individual learners. That's all to say, the desired audience is potential webmaker mentors and the desired action is a click thru to the event wizard.  

Copy: 
[Headline] Unlock your inner teacher with Webmaker
[Subhead]  We've got tools to help you create a more web literate world
[CTA/button] Get started 
* Not sure if we have any data on best CTA/button language. If we do I'd defer to that and use whatever works best at getting people to click. 

Design: 
I think any of the existing treatments with photos as a background element would work here. Something from a Maker Party showing someone mentoring a learner. Ideally, informal and not a classroom. We want to emphasize this is easy for anyone and that you are able to do it from anywhere. 

Other note: existing carousel has a Maker Party banner that is out of date. We could probably just use this new banner to replace, though I'd like to at least test making this banner be the initial default (instead of appmaker).

Comment 4

[Erika Drushka]

Tiny copy tweak since it's a compound adjective before a noun (adding hyphen).

[Headline] Unlock your inner teacher with Webmaker
[Subhead]  We've got tools to help you create a more web-literate world
[CTA/button] Get started

Comment 5

[Matt Thompson (@OpenMatt :OpenMatt)]

* The [oct3] train has now left the station. So please update the whiteboard with [oct17], or whatever train you're now planning to put this on. Thanks!

Comment 6

[Matt Thompson (@OpenMatt :OpenMatt)]

* Flagging Lainie cuz she has ideas here as well.

Comment 7

[Cassie McDaniel [:cassiemc]]

Thanks for the brief, this was helpful!

I'd suggest we tweak the lower CTA's as well. There is a typo in the 'get together' cta up now (oof).

We could replace 'training' with 'resources' (see design) or a second cta to the event wizard?

https://redpen.io/p/ok3aac2284bf837916

We could use the photo from the 'training' feature banner, since we are not using that now.

Comment 8

[paulj]

Thanks! Looking good. 

On the lower CTA's I like replacing training with resources. For the new(er) users I think resources landing page is much easier to grok than training and you also maintain consistent main nav. I'd go ahead and make this change along with fixing the typo.

For Fall Campaign promo, I think the headline looks great but I'm not totally loving the subhead ("We've got tools to help you create a more web-literate world"). It's just not strong or compelling enough IMO. 

Looking to Erika and others for input/additional thoughts. What about something like: 
"Explore some simple ways to share your webmaking skills with others" or "Explore some simple activities to help you create a more web-literate world"

Comment 9

[lainie]

Share your webmaking skills with others.
Help us create a more web-literate world.
Find inspiration to...
Try our simple activities to...

Comment 10

[Cassie McDaniel [:cassiemc]]

+1 the idea of 'simple things' (as it most directly relates to where are they being directed, what the task will be in the event wizard). Since we have "Explore" below, I might go with a stronger verb there.

Could also reference something about 'creating an event' but I'd guess that might lose some people. Raising curiosity is probably better here.

Comment 11

[Erika Drushka]

I prefer "activities" over "things"
So:
Explore simple activities to create a more web-literate world
Explore simple activities to share your webmaking skills with others

Comment 12

[paulj]

+1 "activities" 
+1 a different/stronger verb to replace "explore"

So: 
Try some simple activities to create a more web-literate world
Try some simple activities to share your webmaking skills with others

Comment 13

[Erika Drushka]

How about this as the final?

Unlock your inner teacher with Webmaker
Try these simple activities to help us build a more web-literate world.
Get started

I think this fits best with the copy in the 2nd banner:
We teach the web
We're a global community dedicated to teaching digital skills and web literacy. We explore and create together to build a web that's open and made by everyone.

Comment 14

[paulj]

Works for me. Thx!

Comment 15

[Cassie McDaniel [:cassiemc]]

Attachment: https://redpen.io/eb7f39f677c808f0be

Flagging Paul for copy/content review.
Flagging Ricardo for design review.

Paul, just to confirm, this 'get started' button links to the event wizard right? If so, we need to make sure implementation for this blocks on that.

Comment 16

[Ricardo Vazquez [:ricardo]]

It's looking awesome Cassie, very small tweaks!

Comment 17

[Cassie McDaniel [:cassiemc]]

Thanks for the quick review! Should have been more clear about the review scope here, sorry Ricardo! We're really just looking at the feature banner, headline and subhead. They will be keeping the same styles as the other banners to avoid creating extra work.

Given that, seems like there wasn't anything else and we should be okay to move ahead once we get Paul's review. I'll file some followup implementation bugs.

Comment 18

[Ricardo Vazquez [:ricardo]]

My bad :) R+ all the way then!

Comment 19

[paulj]

Looks awesome. Yes, let's link directly to the event wizard and make sure that's up and running before this goes live!

Comment 20

[Matt Thompson (@OpenMatt :OpenMatt)]

* Gorgeous. Can we mark this resolved now that we're R+?

Comment 21

[Cassie McDaniel [:cassiemc]]

Great, closing now. 

Have filed the followup implementation bug here (which is blocked on the event wizard): bug 1083474

Final assets:
Final design for reference: https://redpen.io/eb7f39f677c808f0be
Photo asset: https://www.dropbox.com/s/8by1swieqms3d5g/img-home-training.jpg?dl=0
Resources illustration svg: https://www.dropbox.com/s/g3pukt4juwv78wu/resources-illustration-01.svg?dl=0

Comment 22

[Michelle Thorne]

Suggest evolving this ticket to: 

Design wm.org banner for "collect your skill share badge" 
https://bugzilla.mozilla.org/show_bug.cgi?id=1093734

per chats with Andrew & Paul.