742737 - April 2012 Firefox & You Graphics

Status: RESOLVED FIXED

(Marketing :: Design, task)

Description

[Carmen]

Attachment: Tabs screenshot

Deadline: Final graphics needed April 16th please.

I need a 150x150 image for the Intro: The theme of the intro and the email is International Earth Day and going "green" with Firefox. I'd like to feature the Earth image that Lee is working on in Bug 733503

FEATURE 1 
No more than 300 px wide

I'd like to use the attached screenshot of tabs from the SUMO page. Can the designer help me shrink that to 300 px wide, or help me get a new (PC) screenshot of some tabs?

FEATURE 2
140 X 140 
Print/edit Add-on 
https://addons.mozilla.org/fr/firefox/addon/print-edit/?src=external-newsletter

The icon for this add on is super small. Can we get a print button? Or should we just use the toolbox image associated with Add-ons (can someone provide a clean image of the toolbox if that's the direction we go?)

Feature 3
140x140 or up to 300px

Firefox Flicks screenshot. (We attached the one we used on Facebook. However, can someone add the video playback button for us? Or take a new screenshot from this video: https://firefoxflicks.mozilla.org/en-US/video/dance/

Add-ons - 172x121:
[COPY]
Tab Badge
Get an alert on any one of your open tabs letting you know when there’s something new on that page.
https://addons.mozilla.org/en-US/firefox/addon/tab-badge/?src=external-newsletter

Simple Timer
Put a clock in your statusbar that either displays the time and date or functions as a timer.
https://addons.mozilla.org/en-US/firefox/addon/simple-timer/?src=search

Turn Off the Lights
Fade the backgrounds of Web pages to darkness so you can focus on whatever video you’re watching.
https://addons.mozilla.org/en-US/firefox/addon/turn-off-the-lights/?src=external-newsletter
 
Themes - 172x121:
https://addons.mozilla.org/en-US/firefox/addon/green-bamboo/
https://addons.mozilla.org/en-US/firefox/addon/olivencia-leave-green/
https://addons.mozilla.org/en-US/firefox/addon/go-green-17726/
Thanks!
Carmen

Comment 1

[Carmen]

Attachment: Screenshot of Firefox Flicks Dance Video

Comment 2

[Tara (musingt)]

Rhonda, could you help us with these?  With the exception of the earth Icon, we'd love your help with the rest.  Please let me know


(In reply to Carmen from comment #0)

> 
> I need a 150x150 image for the Intro: The theme of the intro and the email
> is International Earth Day and going "green" with Firefox. I'd like to
> feature the Earth image that Lee is working on in Bug 733503

Got it, Thanks.  Lee is going to get to this early next week. He's heads down on something else right now but he's got this on his radar. 

> 
> FEATURE 1 
> No more than 300 px wide
> 
> I'd like to use the attached screenshot of tabs from the SUMO page. Can the
> designer help me shrink that to 300 px wide, or help me get a new (PC)
> screenshot of some tabs?

Resizing is pretty straight forward.  Rhonda please help!
> 
> FEATURE 2
> 140 X 140 
> Print/edit Add-on 
> https://addons.mozilla.org/fr/firefox/addon/print-edit/?src=external-
> newsletter
> 
> The icon for this add on is super small. Can we get a print button? Or
> should we just use the toolbox image associated with Add-ons (can someone
> provide a clean image of the toolbox if that's the direction we go?)

I'm not sure if I understand what a print button would be or look like, can you share a reference?  Is it okay that we'd use a different image in place of the actual add-on icon? The toolbox graphic can work, sure... though I believe that has generally been used for the AMO SDK and Builder (perhaps it doesn't matter but just noting that).  


> 
> Feature 3
> 140x140 or up to 300px
> 
> Firefox Flicks screenshot. (We attached the one we used on Facebook.
> However, can someone add the video playback button for us? Or take a new
> screenshot from this video:
> https://firefoxflicks.mozilla.org/en-US/video/dance/

Yup. 

> 
> Add-ons - 172x121:
> [COPY]
> Tab Badge
> Get an alert on any one of your open tabs letting you know when there’s
> something new on that page.
> https://addons.mozilla.org/en-US/firefox/addon/tab-badge/?src=external-
> newsletter

And what is the ask here, a resize of the existing icon or a new graphic? Another potential option is to take these small add-on icons and place them in a stylized box vs. trying to re-do them.  Just a though, may not work...

> 
> Simple Timer
> Put a clock in your statusbar that either displays the time and date or
> functions as a timer.
> https://addons.mozilla.org/en-US/firefox/addon/simple-timer/?src=search
> 
> Turn Off the Lights
> Fade the backgrounds of Web pages to darkness so you can focus on whatever
> video you’re watching.
> https://addons.mozilla.org/en-US/firefox/addon/turn-off-the-lights/
> ?src=external-newsletter
>  
> Themes - 172x121:
> https://addons.mozilla.org/en-US/firefox/addon/green-bamboo/
> https://addons.mozilla.org/en-US/firefox/addon/olivencia-leave-green/
> https://addons.mozilla.org/en-US/firefox/addon/go-green-17726/

----------

Not sure why the title says "April 3012"  :) my time flies fast...

Comment 3

[Rhonda Spencer]

No problem, I'll take a look and let you know if I have any questions.
:)
--rhonda

Comment 4

[Carmen]

(In reply to Tara (musingt) from comment #2)
> Rhonda, could you help us with these?  With the exception of the earth Icon,
> we'd love your help with the rest.  Please let me know
> 
> 
> (In reply to Carmen from comment #0)
> 
> > 
> > I need a 150x150 image for the Intro: The theme of the intro and the email
> > is International Earth Day and going "green" with Firefox. I'd like to
> > feature the Earth image that Lee is working on in Bug 733503
> 
> Got it, Thanks.  Lee is going to get to this early next week. He's heads
> down on something else right now but he's got this on his radar. 
> 
> > 
> > FEATURE 1 
> > No more than 300 px wide
> > 
> > I'd like to use the attached screenshot of tabs from the SUMO page. Can the
> > designer help me shrink that to 300 px wide, or help me get a new (PC)
> > screenshot of some tabs?
> 
> Resizing is pretty straight forward.  Rhonda please help!
> > 
> > FEATURE 2
> > 140 X 140 
> > Print/edit Add-on 
> > https://addons.mozilla.org/fr/firefox/addon/print-edit/?src=external-
> > newsletter
> > 
> > The icon for this add on is super small. Can we get a print button? Or
> > should we just use the toolbox image associated with Add-ons (can someone
> > provide a clean image of the toolbox if that's the direction we go?)
> 
> I'm not sure if I understand what a print button would be or look like, can
> you share a reference?  Is it okay that we'd use a different image in place
> of the actual add-on icon? The toolbox graphic can work, sure... though I
> believe that has generally been used for the AMO SDK and Builder (perhaps it
> doesn't matter but just noting that).  
> 
I'm okay using the add-on image, but it's teeny tiny. I was thinking the standard print icon that we use in the browser. But I can work with the toolbox graphic as well. 
> > 
> > Feature 3
> > 140x140 or up to 300px
> > 
> > Firefox Flicks screenshot. (We attached the one we used on Facebook.
> > However, can someone add the video playback button for us? Or take a new
> > screenshot from this video:
> > https://firefoxflicks.mozilla.org/en-US/video/dance/
> 
> Yup. 
> 
> > 
> > Add-ons - 172x121:
> > [COPY]
> > Tab Badge
> > Get an alert on any one of your open tabs letting you know when there’s
> > something new on that page.
> > https://addons.mozilla.org/en-US/firefox/addon/tab-badge/?src=external-
> > newsletter
> 
> And what is the ask here, a resize of the existing icon or a new graphic?
> Another potential option is to take these small add-on icons and place them
> in a stylized box vs. trying to re-do them.  Just a though, may not work...

The add-ons section is three boxes side-by-side, 172x121. The first one is pick of the month, and I think you guys add an icon onto that one. They can be the add-on icon, or a screenshot. Last month's images look to be all screenshots.
> 
> > 
> > Simple Timer
> > Put a clock in your statusbar that either displays the time and date or
> > functions as a timer.
> > https://addons.mozilla.org/en-US/firefox/addon/simple-timer/?src=search
> > 
> > Turn Off the Lights
> > Fade the backgrounds of Web pages to darkness so you can focus on whatever
> > video you’re watching.
> > https://addons.mozilla.org/en-US/firefox/addon/turn-off-the-lights/
> > ?src=external-newsletter
> >  
> > Themes - 172x121:
> > https://addons.mozilla.org/en-US/firefox/addon/green-bamboo/
> > https://addons.mozilla.org/en-US/firefox/addon/olivencia-leave-green/
> > https://addons.mozilla.org/en-US/firefox/addon/go-green-17726/
> 
> ----------
> 
> Not sure why the title says "April 3012"  :) my time flies fast...

Well, we are planning in advance now. :) Tardis? :) I edited it back to present day.

Comment 5

[Rhonda Spencer]

Attachment: Tabs at 300 p wide

hey guys--
I wanted to show you the tabs at 300 pixels wide. It is so small that you cant see detail of all of the tabs at this width. We could make it 300 p wide and not show all of the tabs (fade to the side) which would show some of the tabs but not all. Let me know what you would like to do with this.
:)
--rhonda

Comment 6

[Carmen]

Or, we could just take another screenshot (on a PC) of fewer tabs open. I don't have access to a PC - is that something you guys might be able to do? Not sure the process to get PC screenshots.

Comment 7

[Rhonda Spencer]

hey carmen--
anyone who has a PC can do that--Im afraid I work on a mac.
Tara--can someone with a PC do this with maybe only 3 tabs open?
--rhonda

Comment 8

[Tara (musingt)]

Hey guys, i don't have a PC either.  Carmen does someone on your team work with a PC that could help?  and just so I'm clear which article is this graphic for? (trying to see if there's something else we can use instead)

Comment 9

[Carmen]

I don't know anyone with a PC on our team. 

This is for the 1st feature. Teaches users how to load tabs one at a time. I took the attached screenshot from the SUMO Website. 

Someone has to do PC screenshots for the product team and the SUMO team. I'll have to do some digging.

Comment 10

[Carmen]

Hey all

I spoke with Laura Mesa about how she gets PC screenshots for product stuff on the Web. She told me she usually files a creative bug and asks for a PC screenshot. I guess I'm a bit confused - should I file another bug? I can track down someone to take a screenshot, but I'm guessing the quality won't be as good (when I try on my husband's PC it's all blurry.) Suggestions? Advice? Thanks. :)

Comment 11

[Tara (musingt)]

Okay.  I guess that's a very tough graphic to squeeze into 300 px width. 
Screenshots usually (to my knowledge) go through silver orange. Does it have to be a specific screenshot? are there specific tabs you want opened?  I'll file a separate bug and cc you.

Comment 12

[Carmen]

I think we just need screenshots of tabs. I would say we have 1-2 tabs pinned as app tabs (Facebook and Gmail?) and then have the open tab be the Mozilla home page, and then maybe Wikipedia as the 2nd full tab. 

Though - if you have another angle without a screenshot, I'm not married to the idea. I just thought it would be easiest, since it's from an article that's a bit of a how-to.

Thanks for ccing me on the bug, Tara. Appreciate it. I didn't realize it was a separate bug.

Comment 13

[Tara (musingt)]

No worries.  would you mind sharing that bit of direction on the bug I just filed?  Hopefully S.O. can knock it out quickly.  I emailed them as well.

Comment 14

[Rhonda Spencer]

Hey guys--
here is a link to the rest of the newsletter graphics (just waiting on the tabs screenshot to finish the other one)
http://dl.dropbox.com/u/36432639/Moz_April_news_PNG.zip

:)
--rhonda

Comment 15

[Tara (musingt)]

Rhonda, does this help?
https://bugzilla.mozilla.org/show_bug.cgi?id=743792

Comment 16

[Jessilyn Davis]

Hey Rhonda - this is great! Thank you!

2 quick edits:

1) Can you remove the border from add-ons guy?
2) Can you add the "Pick of the Month" orange blurb to the Tab Badge image?

Thanks so much!

Comment 17

[Rhonda Spencer]

Attachment: Add on feature

Here is the add on feature with no border.
:)
--rhonda

Comment 18

[Rhonda Spencer]

Attachment: Add on promo with burst

here is the add on promo with burst.
:)
--rhonda

Comment 19

[Jessilyn Davis]

beautiful!

Thanks Rhonda!