Open Bug 1109340 Opened 10 years ago Updated 9 years ago

Marketplace Tiles

Categories

(Marketing :: Design, task)

All
Other
task
Not set
normal

Tracking

(Not tracked)

REOPENED
Due Date:

People

(Reporter: namir, Assigned: mternoway, NeedInfo)

Details

Attachments

(4 files, 1 obsolete file)

>>Project/Request Title:
Marketplace Tiles

>>Project Overview:
Per discussion with Sean Bohan and John Slater, Marketplace is going to utilize 2 types of tiles on new tab page.
1. Marketplace Tile- this will be used to drive traffic to Marketplace and to promote the product in general, specific app collections (i.e apps for Mother's Day/ apps for Coppa America)
2. Tile promoting specific app partners, existing or prospective partners, this can be used as part of partner marketing efforts, to drive app usage or as a way to get prospective partners to either join Marketplace or to buy a tile on new tab page. This type of exposure needs to be labeled in a different way than the regular Marketplace tile. Content Services recommended using "Mozilla recommends" as the verbiage but we are open to suggestions.

As far as process moving forward, as discussed, the Brand team will support the creation of two- three marketplace tiles per month. The creation of partner specific tiles will be outsourced to a freelancer and potentially to the partners.  However we would like the brand team to set the guidelines/ template for the partner specific tiles, the freelancer will then follow such template.

What is needed:
1. Marketplace tiles- create 4 versions to support the below app collections
  a. Great games- https://marketplace.firefox.com/category/games
  b. World Cup Cricket apps
  c. Valentine's Day apps/ Love and dating apps
  d. Productivity apps- https://marketplace.firefox.com/category/productivity 

2. Partner-specific tiles
a. Trip Advisor (prospective partner)
b. FT- existing app https://marketplace.firefox.com/app/ft-web-app
Here we would need to create a template that will be used moving forward, design and copy (Mozilla recommends")

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

>>Creative Specs:
Specs provided by Content Services team, I'll add specs into bug as an attachment.


>>CTA and Design:
The goal is to drive traffic/ users to Marketplace to download apps, in the case of promotion an app collection, the offering should be contextually and timely relevant to users, i,e, apps for Mother's Day.
In the case of partner tile, we need to go beyond the logo, as some logos are not recognizable enough (i.e. games) so the call to action and the copy is critical in driving users to engage with the tile

>>Creative Due Date:
2015-01-05

>>Launch Date:
2015-01-12

>>Mozilla Goal:
Firefox OS

>>Points of Contact:
namir@mozilla.com
Hi Niran, 

Matt is going to work with Sean to create guidelines for partners as well as this first round of tiles. Then he will continue working on these requests going forward.

I'm not exactly sure what will be needed in terms of copy for these tiles. Can you tell us more about how you imagine copy being incorporated into the design?
Assignee: jbalaco → mternoway
Status: NEW → ASSIGNED
Added Sean to bug. Correct me if I'm wrong but the request from CS team was that we identify partner specific tiles with a copy that reads "Mozilla recommends" or something along these lines, which is where your (Brand) input is welcome, this text will be part of the graphic or as an overlay keeping in mind the need to localize the tile into different languages.

Sean- can you pls clarify:
1. Are there are any guidelines regarding the copy under the tile, would it simply be partner name?
2. below the tile, on right side there is "sponsored" to mark paid partners, are you recommending any special call outs for partner specific tiles?


Thansk
Flags: needinfo?(sbohan)
Sorry I missed this:

Our request, however it is laid out, is that every one of these partner tiles CLEARLY indicates the tile is from a partner that Mozilla is recommending. If this is accomplished with an upper or lower 1/3 that says "Mozilla Recommends" or "Firefox Suggests", etc. that is great. 

1. Copy under the tile has a 14-20 char limit. It should be "Mozilla Recommends" so whatever partner is in there cannot be viewed as a sponsored or Mozilla tile. 

2. There won't be a "sponsored" tag with the partner tiles.
Flags: needinfo?(sbohan)
Attached file Tiles Styleguide (obsolete) —
Styleguide for tiles. 

NOTE: for this effort, all Tiles need to have a consistent visual treatment for "Mozilla Recommends" messaging
(In reply to sbohan from comment #4)
> Created attachment 8535230 [details]
> Tiles Styleguide
> 
> Styleguide for tiles. 
> 
> NOTE: for this effort, all Tiles need to have a consistent visual treatment
> for "Mozilla Recommends" messaging

Are these actually things we've selected to recommend? Or are they partners? I just want to make sure we're representing it correctly.
As far as content services is concerned, they are not paying sponsors, nor are these Mozilla Tiles (like Webmaker or Customize), so we want to be sure that they are clearly marked as "different". 

I am not trying to wordsmith it. My understanding is these are either bundles or apps we are recommending.
(In reply to sbohan from comment #6)
> As far as content services is concerned, they are not paying sponsors, nor
> are these Mozilla Tiles (like Webmaker or Customize), so we want to be sure
> that they are clearly marked as "different". 
> 
> I am not trying to wordsmith it. My understanding is these are either
> bundles or apps we are recommending.

As long as we're actually recommending them, I think the language works. I just wanted to get a better understanding of what they actually represent. Thanks.
Hey all,

Looking forward to come up with some ideas here.

One thing we need to flag before we start is the default color options for tiles. Curious how the colors were chosen and if we can change them and align with the unified Mozilla color palette. Checked with UX and they are unaware of where the colors came from.

Also, we should probably get the new Firefox logo in that design document. ;)

Thanks!
@ Aaron/ Sean, can you pls reply to Sean re color options
Flags: needinfo?(athornburgh)
Sean, I assume you're talking about the specs doc...

That thing is really out of date, and I'm currently working on a new version.

Ignore those defaults altogether - the intention was more to communicate that a partner CAN change the tile BG from Default White.

Please use whatever colors the brand team has already specified.

Does this answer everyone's questions?

-A
Flags: needinfo?(athornburgh)
Hi Sean,
Checking in on the status of this project.

Thanks!
Flags: needinfo?(smartell)
Hello!

We're going to be doing these today/tomorrow. We're nailing down a system for how to keep them consistent, will get something up here on the bug soon.

One thing - the sponsored tiles - have we worked with those partners to get assets from them re: their branding? We can source it ourselves, but going forward we'd need these assets up front with the creative request.

Just a heads up.
Flags: needinfo?(smartell)
Hey all,

Sorry for the delay on this during our transitions within Creative! Should be able to nail this down asap. 

So reading all of the suggestions and asks above, we've come up with a fairly simple system that cuts down on L10N needs as well as reinventing the wheel for every app partner:

http://f.cl.ly/items/222z3P0e1t3s3i2k3d1k/Screen%20Shot%202015-01-07%20at%203.30.38%20PM.png

- one color Firefox Marketplace branding across all the tiles for consistency and calling out source for tile offering 
- no custom text on the rastered graphics, we can lightly expand on visual within the space below (text labels seen here are PLACEHOLDER until I can align with Matej on potential string offerings)
- text labels would use the "Recommended by..." or "Mozilla recommends..." text vs. within the graphic to save on L10N multiple graphics needs.
- 1) using the category icons for the main Marketplace tiles that associate with specific categories
- 2) create custom art in the category icon style for specific app package callouts (Ternoway is working on a cricket glyph to show this - will add tomorrow am)
- 3) partner tiles will have the main artwork or logo of the partner/app + dominant brand/app color (I'm assuming there would be an approval stage for this?)

Let us know any feedback on this and we can make edits within the next few days. Copy suggestions to follow soon.
That link doesn't seem to want to work. Let's try this: http://cl.ly/image/1b0i2a1b3S1d
Hi all, following up with Sean's post...I've worked in the last tile (World Cup Cricket apps). One thing you'll notice is, we've changed the 'Productivity apps' tile to a blue background, since Sean and I felt that the green worked better to represent 'World Cup Cricket apps'...it ties into their current colour scheme for this year. 

http://cl.ly/image/3W1P052t2u2K

Thanks,
Matt
Hi Matt, Sean,
Thanks for sharing the designs, I like the system and simplification if offers. Few comments
1. I would defer on this to Sean/ content services team for final blessing but it seems to me that the proposed system deviates from current format where the product name is shown in the text below graphic, this could work great for partner specific tiles like trip Advisor where we show Mozilla recommend/ trip Advisor but less so for Marketplace collections, where with the proposed system we'll have "great games" listed under graphic instead of "Firefox Marketplace"

2. Per above I like the partner specific treatment, the only thing I was struggling with is that for some of the partners additional copy will be needed, for example if we're promoting a specific game like Hex Race, just showing the logo and the name will not be enough to entice users to click, so additional text spelling out the value of the app with some call to action i.e. enjoy a ride into the future. The issue is that makes localization more complex, any thoughts?

3. As far as Marketplace tiles- I like the idea of using unified graphic for each category (i.e. Games) I was wondering how can we differentiate where in month a we are going to run- fun holiday games and in month 2 Retro games or casino games, right now the graphic stays the same but the copy below changes, I'm just concerned we'll have user fatigue after a while since we are going to over use game collections. Thoughts?

Regarding your question on approval- yes we would need to secure partner approval and ideally assets.

From a frequency POV, this was discussed with John Slater but I wanted to clarify in case things got lost in transition. We are going to have 2-3 Marketplace collections running per month, some are region specific, for example in Feb we have Carnival apps (Brazil and LatAm), World Cup of cricket (India, South Africa) and potentially Valentines apps (US EU). Not all will be promoted via tiles but that's our overall Marketplace plan.
As far as partner specific tiles the thought process was to create a pool of 20 or so tiles, localize as needed and provide these to content services team so they can use as inventory is available.
Hope that makes sense.

Thanks!
Hi,
any thoughts/ comments on the feedback I provided?

Also FYI -the MP team launched today desktop marketplace with a new promo area that somewhat resembles tiles, pls check it out, marketplace.firefox.com

Thanks
Heya Namir, 

I'll get responses to this today. Mary Ellen has seen the simple system we proposed and is on board with it, but I'll respond to your questions in a bit.
Also, don't mind me using your username as your name - only one cup of coffee today. Apologies. :P
Responses! :)

1. I'd hope that by putting the Firefox Marketplace branding within the tile itself, we could have the flexibility of allowing the localized text within the label. I know we're limited on character count there, so this would rely on being brief with that label. If that doesn't work, we'd have to rethink adding text into the tiles themselves which - as mentioned - would create the need for many versions per graphic due to localization.

2. This would be tricky under the current setup if we were trying to avoid multiple localized graphics, yes. It may turn out that we do need to add text to certain tiles for stronger awareness, but that could perhaps be one-off deviations as we see fit from the simpler default system here.

3. If we're specifically calling out the category itself, without a specific sub-genre, we can use the default icon. When something more specific - holiday, retro, etc - is needed, we can make custom glyphs in the same style as shown for World Cup Cricket. Eventually it would become a handy repo of icon assets that could also be used within the Marketplace itself for sub-genres.

I'd really love to connect with the Marketplace team soon on in-store graphics and promos so we can chat about Mozilla's overall brand evolution and share the new color palette and design elements (angled color fields seen in this tile system) for greater visual language consistency across the board!
Hi Sean B.
Any feedback on the above suggestions?
Flags: needinfo?(sbohan)
Hi Seam M,
To quickly recap our last call and next steps:
1. creative is approved, with one caveat, there will be times (specific partners mostly games whose logos don't have strong brand recognition) where we would need a second frame (upon user hovering) that will include text with call to action
2. I working with Sean B on a process to gather all assets from partners as well as waivers to use assets and IO's
3. We are changing "Mozilla recommends" to "Firefox recommends", please weigh in if you/ brand team have any strong feelings one way or the other.

Thanks, Niran
Flags: needinfo?(sbohan)
Adding a needs info for Matej so he can weigh in on the Mozilla recommends vs. Firefox recommends.
Flags: needinfo?(matej)
(In reply to Jennifer Balaco from comment #23)
> Adding a needs info for Matej so he can weigh in on the Mozilla recommends
> vs. Firefox recommends.

If these are from the Marketplace, then I think Firefox is better than Mozilla. Thanks.
Flags: needinfo?(matej)
Hi Matej,
Legal asked that we consider a replacement to "recommends" as there are few other Mozilla products that are using this term (e.g recommendation engine)
Some ideas are below, would love your feedback. Thanks

Suggests
Proposes
Presents
Features
Highlights
Spotlights
Flags: needinfo?(matej)
Did we decide whether this was coming from Firefox or Mozilla.

I like the sound of "Firefox Features" if it's Firefox.

We could also do something like "In the spotlight," which doesn't necessarily need one of the brand names attached to it.

Otherwise "Mozilla Suggests" would be my next pick.
Flags: needinfo?(matej)
Thanks Matej,
Yes, we decided to go with Firefox. Firefox Features sounds good, I'll run by few community members to gauge how it'd sound when localized.
Thanks!
Hi Niran, 

Is there anything additional needed for this request? I believe based on comment 22 that the design is approved and now we have a name. If all is good, please go ahead and resolve this bug. Thanks!
Hi Jen,
Agreeing on design template and wording is just a first phase of this project, now that that's done, we need to create partner specific tiles and MP specific tiles, (5 partner tiles and 3 Marketplace tiles).
For Partner tiles, each partner will need to sign waiver and IO and give us their assets (logo), I'm working with legal and the partners on this now. Once I get assets I'll attached to the bug.
Thanks!
Thanks, Niran. I have a couple of questions.

1. In the project overview you mention that a freelancer will be doing the partner tiles. But now it sounds like you are expecting the Creative team to take these on. Is that correct? I want to make sure that we know the scope for these. 

2. If we do need to create the partner tiles, is there any way to get an estimate on timing and when you'll have everything needed? We are really busy, so a quick turn-around will most likely not be possible without some pre-planning.
Initial plan as discussed with John S is that in house team will handle MP tiles and freelancer will handle partner tiles.
From your comment #1- you mentioned that the team will continue to support beyond the initial phase, based on this I removed this from my budget, let me know if we need to revisit.

The immediate need now that we have agreed on the overall design is:
1. 3 MP tiles
2. 5 partner specific tiles (Pinterest, Tweetdeck, Box, SoundCloud, 8tracks (tbd), I'm working with partners to secure assets and sign waivers


Thanks, Niran
This is an updated spec file. Fundamentally, nothing has changed... but the doc is now a 2-pager with the most recent updates and Mozilla branding.

Hollar if ya'll have questions.

-A
Attachment #8535230 - Attachment is obsolete: true
Niran, 

I'm sorry for the mix-up. But in comment 1, I meant that Matt and Sean would create guidelines for the partner tiles that a contractor/the partner's designers created. And then Matt would work on the MP tiles. Unfortunately we don't currently have the resources not to create all of the tiles.

Are these still the correct collections for the MP tiles? 
  a. Great games- https://marketplace.firefox.com/category/games
  b. World Cup Cricket apps
  c. Valentine's Day apps/ Love and dating apps
  d. Productivity apps- https://marketplace.firefox.com/category/productivity
Hi Jennifer,
It would be great if we can have the first round of partner tiles created in house, we are only aiming for 5 tiles, as this project was set to launch end of Jan I would like to move forward and avoid additional delays, I understand that moving forward partner tiles will be created by a freelancer.

The MP tiles you mentioned are no longer relevant (the Valentine's and World Cup of cricket ones) I'll provide new themes.
Niran, 

That will work for this time. However, since we don't have the themes or the partner assets yet, we will need to put the due date on these to the week of 3/16. 

And then to confirm, going forward, we will take care of the theme tiles and you will find someone to take care of the partner tiles.
Confirming comment #35
8 tracks (partner tile) signed the IO so we can move forward their tile, assets can be found at 8tracks.com/media.

Thanks
hi Jen,
can you pls confirm work has started on the 8tracks tile? thanks
Hi Niran, 

As mentioned in comment 35, Matt has some other work he's finishing up. Also, we really need the assets for all of the tiles before he gets started on this. He should be able to get started as soon as we have all of those though.
Hi Jen,
These are 5 different partners, so I would look at this as 5 separated projects some partners were quick to reply with signed IO and assets, others take longer, if we can start with 8 tracks and work on the others as they come in that would be great, for example- one of the partners declined so we now need to find a replacement partner, test the app and extend an invite to join the program, while I understand it would be ideal for you to create all tiles at once, from our POV it does not make sense to hold off other partners from launching.

Thanks, Niran
hi, good news, I have a freelancer that will be taking this on, what I need to get going is for Seam M/ Matt provide updated style guide that the freelancer can follow. 

Thanks
Flags: needinfo?(smartell)
Flags: needinfo?(jbalaco)
Attached is the latest Style Guide for Directory Tiles, but the same rules apply.

In the case of Mozilla Tiles, the options are:
1.) static = logo, active = logo (NO CHANGE)
2.) static = logo, active = image
3.) static = image, active = logo
4.) static = image, active = same image
5.) static = image, active = NEW image

This will hopefully give you sufficient creative options to explore. Let me know if you have any questions!

-A
Hi Niran, 

This is great news! It looks like Aaron has provided the Style Guide information. 

One quick questions:
1. Will your freelancer start with the 8track tile? Or does Matt need to design this one and the freelancer will start on the others? 

I'm going to suggest we go ahead and resolve this bug. And when you have the first themes that need to be created, you submit a new bug with that information. 

Thanks!
Jennifer
Flags: needinfo?(smartell)
Flags: needinfo?(namir)
Flags: needinfo?(jbalaco)
freelancer will handle all partner tiles. Thanks
Flags: needinfo?(namir)
Thanks, Niran! I'm going to close this. please file a new bug when you have the first collections ready for Tile design.
Status: ASSIGNED → RESOLVED
Closed: 9 years ago
Resolution: --- → FIXED
I have first round of creative from freelancer, I'm POC to secure partner approval, who from brand service needs to review/ approve if at all?
Status: RESOLVED → REOPENED
Resolution: FIXED → ---
(In reply to namir@mozilla.com from comment #45)
> I have first round of creative from freelancer, I'm POC to secure partner
> approval, who from brand service needs to review/ approve if at all?

Please post them here and I'll make sure they get routed to the right people.

When do you need feedback by?
Attached file Partner_Tiles-v2.zip
Added creative for review. Few questions from designer:
1. Can you point to where he can find Marketplace icon as shown on the mock up?
2. aspect ratio- any specifics regarding size of MP mark compared with partner logo

It seems to me that that Firefox trademark is too large.

Thanks
Adding needs info for Sean and Matej to make sure they see that there is a tile to review.
Flags: needinfo?(smartell)
Flags: needinfo?(matej)
Hi Niran,

These look OK to me, but Sean is going to review as well and provide more detailed answers to your questions.

In the meantime, you can find all Marketplace branding here:

https://www.mozilla.org/en-US/styleguide/identity/marketplace/branding/
Flags: needinfo?(matej)
Heya Niran,

Agreed the branding on the bottom is too big. They should be aiming for the weighting Matt and I offered in the previous examples: http://cl.ly/image/2z3r100i1V2b

Here is the PSD used for those tiles to make it even easier (proper branding and sizing included): http://cl.ly/111A1l1X2w43

Enjoy!
Flags: needinfo?(smartell)
Attached file Partner_Tiles-v3.zip
Here are the updated tiles. Thank you Sean for the PSD! Is there a standard size or ratio to the marketplace for the partner logos?
Flags: needinfo?(smartell)
(In reply to Chan Williams from comment #52)
> Created attachment 8583443 [details]
> Partner_Tiles-v3.zip
> 
> Here are the updated tiles. Thank you Sean for the PSD! Is there a standard
> size or ratio to the marketplace for the partner logos?

These look great to me.

Sean, is there an existing rule for the above? Any other comments?
Sean-  can you advise if these are approved and we're good to go?
(In reply to Chan Williams from comment #52)
> Created attachment 8583443 [details]
> Partner_Tiles-v3.zip
> 
> Here are the updated tiles. Thank you Sean for the PSD! Is there a standard
> size or ratio to the marketplace for the partner logos?

No standard, just what looks good and consistent as we make more since each brand could have different dimension. 

These look great! Thanks!
Flags: needinfo?(smartell)
Hi Sean (Bohan)
please confirm in the bug when these are approved by Darren. Thanks
Flags: needinfo?(sbohan)
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: