If you think a bug might affect users in the 57 release, please set the correct tracking and status flags for Release Management.

Design Business Partners section for devhub

RESOLVED FIXED

Status

Marketplace
Developer Pages
RESOLVED FIXED
5 years ago
5 years ago

People

(Reporter: ednapiranha, Assigned: mmaslaney)

Tracking

x86
Mac OS X
Points:
---
Dependency tree / graph

Details

(Whiteboard: u=biz c=design p=3 s=2013.2, URL)

Attachments

(16 attachments, 12 obsolete attachments)

139.96 KB, image/png
Details
165.25 KB, image/png
Details
162.97 KB, image/png
Details
68.04 KB, image/png
Details
15.92 KB, image/png
Details
555.48 KB, image/png
Details
1.60 MB, image/png
Details
1.66 MB, image/png
Details
1.28 MB, image/png
Details
1.12 MB, image/png
Details
151.32 KB, image/png
Details
317.95 KB, image/jpeg
Details
137.34 KB, image/jpeg
Details
558.88 KB, image/png
Details
1.23 MB, image/png
Details
1.71 MB, image/jpeg
Details
(Reporter)

Description

5 years ago
Hey Daniel, I'll need some content and the call-to-action details for this page: https://marketplace.mozilla.org/developers/partners

When you have it ready, can you also update it on the Functional Specs in https://docs.google.com/document/d/1--E8zdyU8hEJIpEId-RBt8f9JLD42WJBvs6NRvqqgLk/edit ? Thanks!
(Reporter)

Updated

5 years ago
Blocks: 788689

Updated

5 years ago
Blocks: 800134

Updated

5 years ago
No longer blocks: 788689
CCing Daniel and Diana. This bug is about what Diana mentioned in bug 794266 comment 17:

"2. We need a (...) 'Business Partners' section.  This section will be sales focused for BD purposes and requires information on partners/carriers/OEMS, target markets, rev share, marketing opportunities

3. We also need a link/button to a Technology section for partners that provides info on device specs, APIs, emulators etc.

For points 2 & 3 it would be great to have our new UX superstar jump in."
Assignee: dbuchner → nobody

Updated

5 years ago
Depends on: 794266
Diana, a few notes:

#2 - I am questioning to what extend we want to include carriers/OEM-targeted partner content in the Developer Hub. Those are very high level, low volume targets that may seem out of place among developer tutorials and code-level docs. In my gut, it feels like we should be catching and redirecting these sorts of partnerships to a more central partnership-specific hub, just a thought.

#3 - "device specs, APIs, emulators", the latter two items will be presented within the Developer Hub's existing content flow under the Build section, does this section differ in approach enough to warrant content duplication?
Shall we discuss this in the Devhub meeting on Tuesday? I personally actually do think that all these topics are interesting to business-interested developers.

The concern for duplication is valid, but if it's more of a technical topic, we could always cover it in more detail on the dev side and link to it from the business side.

Diana is this something you can draft in a little more detail for Tuesday?

Comment 4

5 years ago
(In reply to Fred Wenzel [:wenzel] from comment #3)
> Shall we discuss this in the Devhub meeting on Tuesday? I personally
> actually do think that all these topics are interesting to
> business-interested developers.
> 
> The concern for duplication is valid, but if it's more of a technical topic,
> we could always cover it in more detail on the dev side and link to it from
> the business side.
> 
> Diana is this something you can draft in a little more detail for Tuesday?

Fred, I will be on PTO until Oct 27.  As agreed, this is not a P1 ask for this iteration, however, will need to be addressed in an upcoming iteration.  

Happy to discuss tomorrow or Friday if possible with the two of you.  I will send out a meeting request.

Comment 5

5 years ago
(In reply to Daniel Buchner [:dbuc] from comment #2)
> Diana, a few notes:
> 
> #2 - I am questioning to what extend we want to include
> carriers/OEM-targeted partner content in the Developer Hub. Those are very
> high level, low volume targets that may seem out of place among developer
> tutorials and code-level docs. In my gut, it feels like we should be
> catching and redirecting these sorts of partnerships to a more central
> partnership-specific hub, just a thought.

I agree with Fred that this kind of information would be of use/interest to developers as well. I am fine to redirect to a partner hub, but this will need to be done in a way that does not appear dislocated as was the original partner page on Mozilla.org to the current page on the devhub.  My vision is a clean and intuitively designed one-stop shop.  If a redirect occurs, we need to maintain consistency of look and feel. 

> #3 - "device specs, APIs, emulators", the latter two items will be presented
> within the Developer Hub's existing content flow under the Build section,
> does this section differ in approach enough to warrant content duplication?

Good points both of you.  A link to the technical topics from the Business partner hub would work very well.  Thanks Fred.

Comment 6

5 years ago
Here is a link to an OEM presentation that our new UX superstar can access for ideas on how to display the content on our Business Partner page.  A lot of this information is useful for developers as well.


https://mozilla1.box.com/s/rjrndw1w8ulmsqfuoi4c

It would be great if she can take a stab at design and when I'm back on Oct 29 we can refine?  

Thanks!
(In reply to Diana Livits from comment #6)
> It would be great if she can take a stab at design and when I'm back on Oct
> 29 we can refine?  

Thanks - just to set expectations, our new designer will likely not be working on this but I will find other resources for it.

Updated

5 years ago
Assignee: nobody → bram
Summary: Provide content / call-to-action for Business Partners page → Design Business Partners section for devhub
Besides the material linked to by Diana, we also need to find a spot for "success stories" (actual term TBD) that can hold the ever-growing list of partner videos (15 and counting). Current list in bug 800974.

Updated

5 years ago
Blocks: 804376
No longer blocks: 800134

Updated

5 years ago
Blocks: 805113

Updated

5 years ago
No longer blocks: 805113
Depends on: 805113
Created attachment 676047 [details]
DevHub business section

Here are some page templates for the business partners section that I did earlier today.

This project is part-design and part content strategy. Because the two is intertwined so closely, I am going to make content and design recommendations all at once.

So, In addition to designing several page templates, I am trying to expand the sales tools PowerPoint slides into a coherent and user-centric story.

I wrote in the email that this section will need to convince two audiences:
1) People who make business decisions
2) Developers who need to convince people who make business decisions
PS. Sometimes, one person has both roles.

Every piece of copy in this mockup was written with them in mind, to answer these questions:
1) Why should I invest my time and money in Firefox Marketplace?
2) Why can I trust Mozilla as a business/dev partner for my app?



Entry point and language:

First of all, the front page has been dramatically reduced to 4 statements:
* See the reasons to develop for Marketplace
* Design: learn principles, patterns and elements
* Build: get tools, documentations and references
* Publish: submit and distribute your apps

Having a few actionable items that aligns with what users want to achieve (and an IA that supports it) will result in a higher chance of the user getting to the information that s/he needs faster: a win for usability. Other informations might be added to this page, but I think that they should serve secondary purpose and be placed to the bottom of these four call to actions.

The entry point to the business section has a wording that’s direct and less corporate-sounding. On the main page, it says “See all the reasons to develop for Firefox Marketplace” rather than “Firefox Marketplace for your business”. The section itself is called “Why?”, rather than “Business” or “Partners” to help reinforce the user-centered stance we are taking.



Dividing sections:

I’ve chosen to dedicate two sections towards developers, and another two towards business decision makers. This has two reasons: a) the business cases that were presented on the slides aren’t many, and b) I think it’s important to address questions from developers as well as business decision makers. However, this would steer away from having a pure “Business Partners” section, so let me know what you think of this.



Pictures and videos:

One of the sections called “Developers <3 us” will have the videos we shot with Evernote, box.net, airBnB, etc. Is it a good idea to combine all the videos in one place, or to spread it all over the section?

Our Marketplace will be the newest player in the market, and we’ll need to convince nearly everyone, so a refresher on why Mozilla is reliable will be important. We’ve created some infographics in the past that highlighted our achievements (I made a space for a timeline), and it’s important to highlight them here.

Updated

5 years ago
Blocks: 808158
Created attachment 678642 [details]
DevHub partnership page

Per my conversation with Diana this morning, and our meeting last week, the partnership page has been redesigned with these features:

* Everything is merged into one page. No more multi-page layouts
** It’s going to have a lot of scrolling, but plenty of white space to aid reading

* Contents from the latest version of the Marketplace pitch deck has been integrated

Enjoy!
Attachment #676047 - Attachment is obsolete: true

Comment 11

5 years ago
Bram - looks great!  Here are a few copy edits please: 

HTML5 Section

Remove "Your" start with the word "Developers"

Copy: 

Adopting open Web standards to create great app experiences and then delivering them across multiple platforms, devices and operating systems is awesome.  Saving money on the cost of development and monetizing your apps from a competitive open marketplace — even better!  

The Firefox Marketplace gives developers full control over their content, functionality and  distribution, including  access to hundreds of millions of  Firefox users.

When you write for the web, the only thing you're going to miss are the proprietary codes.



Global Partners, Local Contents Section

Replace copy with:  The worlds most popular brands and all your favorite apps are building their experience on Firefox Marketplace. 

[spot for video]

Another Firefox Marketplace priority is providing users in Firefox OS launch markets,like Brazil, with relevant, local content. Keep an eye out for more local apps that make life more efficient and entertaining.
Created attachment 679032 [details]
DevHub partnership page

Updated to reflect comment 11. My next step is to turn this layout into high fidelity prototypes.

While I do this, should we get sanity check and approval from people: legal, developers, copywriter (Matej?).
Attachment #678642 - Attachment is obsolete: true
This is lovely. I agree that sanity checks make sense. (CCing) Edna, can you take a look at the mockup and point out if you see any concerns from an implementation point of view (or any other POV, for that matter)?
(Reporter)

Comment 14

5 years ago
From what I can see, it looks good. My only question is about the top navigation links and how it will work with the existing structure on https://marketplace.mozilla.org/developers/docs/tutorial_general for example.

As you can see, there are the three tabs for 'design', 'build' and 'publish'. Would 'partnership' be a fourth tab or would it be where 'submit an app' is at the very top?

Keep in mind once we also include other languages, this may increase the text width and reduce the real estate (especially for the three tabs).

Comment 15

5 years ago
Thanks Bram!  

I will also socialize this with other members of PMM & BD!  Stay tuned for some feedback.  We will likely have to make some tweaks.

Nice work!
Bram, Diana, I reviewed the wireframe and have a few questions/concerns:

- As a viewer, I don't get a sense of what actions the page offers or wants me to do unless I wade through a great deal of content.

- There is a *ton* of stuff on this page - we're mixing introductions to public-facing sites and Mozilla products, with videos from partners and general developer-targeted language.

- The only CTAs are at the very bottom of the page

- I would like to forgo the addition of a "Partnership" entry in the global navigation of the site. Statistically, the target audience of this page - Content, OEM, and Carrier partners (these are the groups you identified, right?) - will make up a tiny fraction of views to the Developer Hub.


In my opinion, we should refactor this page to be more punchy, while clearly identifying actions we would like each target group to take.

Comment 17

5 years ago
Daniel - completely agree.

- CTAs need to exist in each section.  Specifically: 

Introducing Firefox OS -  Link for OEMs / Carriers to contact us <text link to email> to for partnership opportunities 

Introducing Firefox Marketplace - (please refer to the last paragraph on the Hacks Blog https://hacks.mozilla.org/2012/10/firefox-marketplace-aurora/).  

Please insert the same sentence (with links):  We need your feedback, and we need your Apps! Get Firefox Aurora for Android, learn about the Marketplace, and post your Apps to the Firefox Marketplace.

Developers are about to get a lot happier -  Insert the following:

The Mozilla Developer Network (MDN)<link to MDN homepage> and the DevHub <link to DevHub homepage> contain extensive documentation, FAQs and emulation tools to help you get started building your App. If your app is ready to go Submit it now <link to submit>

- Also agree that the "Partnership" entry does not need to exist in the Nav

Updated

5 years ago
Whiteboard: u=biz c=design p=3
Created attachment 679843 [details]
DevHub partnership page

(In reply to Jen Fong-Adwent [:ednapiranha] from comment #14)
> From what I can see, it looks good. My only question is about the top
> navigation links and how it will work with the existing structure on
> https://marketplace.mozilla.org/developers/docs/tutorial_general for example.

Hi Jen, from the feedbacks, it sounds like the Partnership section will be located at the auxiliary navigation area (top right corner). I am thinking that it will be the next link after “Submit an App”.

So the order of links would be something like:
* Submit an App
* Partnership
* [Username]
* Back to Marketplace

So the three tabs for Design, Build and Publish will still remain.


(In reply to Diana Livits from comment #17)
> - CTAs need to exist in each section.

The attachment has been updated with CTA in every section.
Attachment #679032 - Attachment is obsolete: true
(Reporter)

Comment 19

5 years ago
Looks good! I can start implementing if someone can provide the assets for the graphics in the mock?
Created attachment 680508 [details]
everything.me
Created attachment 680509 [details]
everything.me social
Created attachment 680510 [details]
everything.me music
Created attachment 680512 [details]
Brazilian online service logos

Folha
http://f.i.uol.com.br/folha/furniture/5.2/images/sprite-general.png

Terra
http://s2.trrsf.com.br/atm/3/core/apps/headerfooter/_img/general_content_v2.png

SporTV
http://s.glbimg.com/es/ge/static/sportv/img/logo-sportv.gif

buscapé
http://image.buscape.com/bui-bp7/logo-large-header2.png

Baixaki
http://www.baixaki.com.br/img/v10/logo-baixaki.png

Abril.com
http://www.abril.com.br/css/img/logoAbrilGd2011.png

sonora
http://sonora.terra.com.br/Content/Images/Trial/sprites.png

UOL
http://h.imguol.com/v2011/uol-o-melhor-conteudo.png
Created attachment 680513 [details]
HTML5 + technology logos
(In reply to Jen Fong-Adwent [:ednapiranha] from comment #19)
> I can start implementing if someone can provide the assets for
> the graphics in the mock?

Hi Jen, the assets can be found on comment 20 onwards, plus these two:

Screenshot of Marketplace:
https://marketplace.cdn.mozilla.net/media/img/ecosystem/marketplace-landing.jpg

Firefox OS phone:
http://www.mozilla.org/media/img/firefoxos/firefox-phone.png

I still don’t have a good graphic to represent the very first paragraph. It has a heading that says “we’re still building a better internet”. Suggestions are welcome!

Updated

5 years ago
Blocks: 810977

Comment 26

5 years ago
I have socialized this page with a number of stakeholders and they have provided very insightful feedback. 

Ultimately there is too much info on the page and quite a lot of it would serve better on the Mozilla.org page dedicated to Firefox OS.  

Bram, I will send you a meeting invite to discuss.  If anyone else is interested in joining the meeting please let me know.
So what is happening with this page? Are we targeting anyone for partnership here? If so, what groups will that be?
(Reporter)

Comment 28

5 years ago
Two quick questions:
1. Is this the final copy (from the Devhub Partnership page attachment)?
2. What is the actual link for 'Learn more about Firefox OS'?
(In reply to Jen Fong-Adwent [:ednapiranha] from comment #28)
> Two quick questions:
> 1. Is this the final copy (from the Devhub Partnership page attachment)?
> 2. What is the actual link for 'Learn more about Firefox OS'?

Pursuant to Diana's latest comments, trailed by my own questions, this page may be in major flux.

Diana, please advise as to the rough change set we're looking at for this page.

Comment 30

5 years ago
This page is aimed at Partners & Developers where partners are described as important content providers, popular brands, agencies/large dev houses and Developers refer to the long tail.

The consensus is that the page needs to maintain a very obvious sales focus that highlights distribution.  

Thus, partner logos, the section on everything.me and the partner videos are more appropriate to OEMs & Carriers who would be more interested in the Firefox OS page on Mozilla.org.

Also, it was suggested that the first paragraph "we're still building a better internet" is not necessary here.

Bram and I are meeting in my Vidyo Room in at 16:30 ET / 13:30 PST if anyone would like to join and discuss.

Updated

5 years ago
No longer blocks: 808158
I am working on this bug and should have something ready by later today.
Created attachment 680940 [details]
DevHub partnership page

The DevHub partnership page has been updated per my conversation with Diana earlier today.

Notable changes:
* “Introducing Firefox Marketplace” section is renamed
* The HTML5 section is also renamed
* “Introducing Firefox OS” section is removed
* Device compatibility is made more prominent
* Firefox OS is linked to inside device compatibility
* Added actionable CTAs on the bottom of the HTML5 section
* Added 3 resources below the CTA: Marketplace Blog, Marketplace DevHub & MDN
* Removed local Brazilian partners and Everything.me
* Replaced wall of partner logos with one line of curated, well-known brands
* Clicking on these brands will lead user to the list of partners page
Attachment #679843 - Attachment is obsolete: true

Comment 33

5 years ago
Thanks for the updates Bram.  I have sent you an email with a few design tweaks. We're almost there!
Created attachment 681375 [details]
DevHub partnership page

Updated with Diana’s recommendations on comment 33.

Comment 35

5 years ago
Thanks for making those changes Bram! 

I would like to give some love to the section for submitting an app-  lots of content but not a lot of flow.  

Can we find a way to make it more colourful / easier to read?  It would be great to spread the section out, call certain parts out and include some colourful graphics (at least arrows) to guide the reader across the steps. 

Want to take a stab at it?
Created attachment 683884 [details]
DevHub partnership page

The partnership page has been updated to give the “Submitting an app is really easy” section more organization.

Notable changes:
* Numbered steps are replaced with actionable links
* Links are grouped within two categories: if user have an app ready, or doesn’t have one yet
* Estimated times are revised to be more specific
Attachment #680940 - Attachment is obsolete: true
Attachment #681375 - Attachment is obsolete: true
Created attachment 683890 [details]
DevHub partnership page - list of partners

This is the page that will contain videos that we have made for each partner, as well as a curated list of partners.

User will be able to access this page by going to the “Global partners” section of the partnership page (attachment 683884 [details]), and then either click on the logo banner, or the link labeled “Meet our partners”.

Keep in mind that the bottom part of this page may be a list of icons, but it is not designed as a replacement for the Marketplace front page. This page will only showcase the most important partners. These are the ones that we don’t have the video for, but are nonetheless important to showcase. Smaller apps won’t be here. Ideally, we’ll have no more than 50 selected partners, but if there are more, there is a pagination feature.

This page will do the job that a big wall of apps does. It will help give a sense that many big brands have allied with Firefox Marketplace.

Comment 38

5 years ago
Hi all.  Please be advised that Jennifer Bertsch, Website Product Manager is looking at the page and will provide her feedback for any last changes.  It is for our long term interest -- even at the risk of slowing this down some.  Stay tuned.

Comment 39

5 years ago
Thanks for your patience everyone.  Please find the summarized feedback and my own last recommendations for the page below:

1. Please remove the HTML5 Section Completely

2. New Content Order for the page should be:
   a.Introducing Firefox Marketplace
   b.Distribution Opportunities (New Section. See Below)
   c.Global Partnerships
   d.Submitting an app is really easy
   e.More developer resources (this needs to stand out more)
   f.You + Mozilla = Awesome

3. “Distribution Opportunity” (instead of “Apps built for Marketplace will run on 
   these devices”
   a.Separate Mobile icon from Tablet icon 
   b.Remove all desktop browsers and leave only Firefox Desktop 
   c.Copy Change: Firefox OS – Default App Store on Min. 1M handsets (Coming in    
     2013)
   d.Copy Change: Android Phone – Min. 1.5 Million Downloads
   e.Copy Change: Tablet (coming in 2013)
   f.Copy Change: Firefox Desktop – 500+ Million Users in over 80 Languages (Coming 
     in 2013)

4. Update Introducing Firefox Marketplace Section with new content: 

Using open web standards and Mozilla-designed APIs, Mozilla has created an ecosystem that delivers a truly cross-platform and cross-device app experience.  


The Firefox Marketplace is a new channel for you to distribute your HTML5 apps and content.   

The Mozilla team has optimized the Firefox Marketplace for developers.  This has many benefits: 

[Bram: please include appropriate iconography]

a.	Simple to create & publish your apps
b.	No mandated business model
c.	Full control over content, functionality and distribution
d.	Fair revenue-sharing model = More money in your pocket 
e.	Multiple payment & monetization options


5. “Submitting an app is really easy” is really important and needs to Pop! Needs 
    buttons? colour?  Leave it to you to work your magic.

6. Incorporate Blog & Twitter links into the page:
   a.https://blog.mozilla.org/apps/
   b.https://twitter.com/firefoxapps


7. I had a few comments that the ‘Partnership’ header seems out of place.   
   Anything we can do to improve that?
Created attachment 687577 [details]
DevHub partnership page

(In reply to Diana Livits from comment #39)

Diana, I am able to include almost all of your recommendations, with a few exceptions.

> 3. “Distribution Opportunity”
>   d.Copy Change: Android Phone – Min. 1.5 Million Downloads
>   e.Copy Change: Tablet (coming in 2013)

Do we only include Firefox Beta? If yes, then the 1.5 million downloads figure is accurate. But when apps go out of beta presumably in a month or so, we will want to modify this figure.

Having three devices be captioned with the text “coming in 2013” sounds bad, because it sounds like we’re ill prepared. My proposed solution is to:

* Specify what we mean by “2013”. “February 2013” or even “Q2 2013” is much better
* Avoid writing “coming in 2013”. Instead, we write “Available now!” under Android phones


> [Bram: please include appropriate iconography]

The rewritten intro section is great. But I am against designing new icons, for these reasons:
* They’re a fairly small part of the website
* They have to be designed from scratch, which is fairly expensive in terms of time
* We will not use these icons anywhere else in DevHub or MDN
* The icons will not help clarify what the text means

However, if we can prove the these icons will:
* Not cost that much to design (for example, by reusing elements from existing icons we already have)
* Be used somewhere else inside the DevHub or MDN knowledge base articles
* Help explain the concept of the text, rather than obscure it

Then I think having icons is a good idea.


> 6. Incorporate Blog & Twitter links into the page:
>   a.https://blog.mozilla.org/apps/
>   b.https://twitter.com/firefoxapps

These has been incorporated under the “Developer Resources” section.

The old section was comprised of these links:
* Apps blog
* Marketplace DevHub
* MDN

I thought that linking back to DevHub is redundant, since user is already at DevHub, and to return, s/he would simply hit the “Back” button.

So the new section now has these links:
* Apps on MDN
* Apps blog
* Firefox Apps on Twitter


> 7. I had a few comments that the ‘Partnership’ header seems out of place.   
>    Anything we can do to improve that?

Is this a naming problem (ie. calling this page “Partnership” is inaccurate), or a design problem (ie. the header needs to be positioned differently)?
Attachment #683884 - Attachment is obsolete: true
Created attachment 690636 [details]
DevHub partnership page

Mockups updated. Feedbacks would be awesome!
Attachment #687577 - Attachment is obsolete: true

Comment 42

5 years ago
Thanks for the updated design Bram, 

Can we please change the Introducing Firefox Marketplace paragraph section so that the paragraph starts above the Marketplace image and run for the width of the page (just like "Global Partnerships")? 

Below the introductory paragraph lets put the Marketplace Image and lined up the  "Why Choose Firefox Marketplace" directly to the right of the image.

Can we remove the word "Partner" entirely?  We can simply start the page off with "Introducing Firefox Marketplace".

Also, is there a way to brighten up the "submitting an app is easy" section?

Once the changes are done I will seek approval from the team.  

Thanks again!
Created attachment 691221 [details]
DevHub partnership page

Diana,

The DevHub partnership page has been updated with all your suggestion. I also designed a high res prototype that will give you an idea of what it would look like inside a browser window (I’m using Safari as an example interface.)
A couple of caveats about this mockup:

* The navigation header isn’t final yet (so the order of items there might be changed)
* Under the “Why choose Firefox Marketplace” section, the list items are missing numbers (I wasn’t able to do it from the web inspector)
* The product logos don’t look clear, either
* It would be awesome to get a report on the progress of our partner introduction video (the one that will showcase all partners and serve as an overview)

Comment 45

5 years ago
Hi Bram, 

As per your request here is V2 of our partner video.  It doesn't showcase all partners, but rather acts as a sales tool to attract developers to our platform.
This is still a work in progress, but it gives you an idea of what we are after:

https://www.dropbox.com/s/mbxdi3hkiyqmj5a/OS%2BMarkeyplace%20overview-2ndDraft-HD%20720p.mov

Feedback is appreciated.

Comment 46

5 years ago
Bram - I love the look of the page!  Nicely done.

To address a couple of your caveats:  
* no worries on navigation - I'm sure the final version will be great
* under "why choose FF Marketplace" I'd like to remove the divider lines between each of the points? 
* I provided a link to the work-in-progress Marketplace video

Two additional Items:
* under "more developer resources" please space out the icons.  Currently the Firefox Apps Blog icon looks a bit too close to the left
* under "you + Mozilla = Awesome" please ensure the copy spans the width of the page as well

Thanks
Hi Diana,

The video looks great to me (I loved that it blended footages from MozCamp Asia, which is super relevant and has lots of energy from the participants), and all your changes seem minor enough, that I feel like we can go ahead and start implementation. What do you think?

Comment 48

5 years ago
Thanks for the feedback Bram, but unfortunately we can not start implementation yet.  The Video is still being edited and we have asked for less FFOS content and more Marketplace.  Also we have to include some partner video snippets.  Hopefully this will be ready to go this week.  Also, my director has provided some feedback on the page that we will need to incorporate.  I will provide that info shortly.  Almost there...
Great. Let me know what the feedback is, and I’ll try to make it. I’m on holiday break starting on Thursday, so the earlier, the better!
Created attachment 693758 [details]
DevHub partnership page

Diana sent me a set of feedbacks via email yesterday, and the mockup has been revised to reflect that.

Notable changes:
* New header, along with new way of indicating selected item. This matches what we have on the consumer side of Marketplace
* The page is now called “Firefox Marketplace – Always Open”
* Almost every headlines had been reworded to be more specific
* Links to blog, Twitter, YouTube, etc. has been reorganized
* Video has been revised to include a screenshot from the actual video we are making (see comment 45 for the video link)

The Photoshop source file that I worked on is located at:
http://people.mozilla.com/~bpitoyo/marketplace/introducing-firefox-marketplace.psd
Attachment #690636 - Attachment is obsolete: true
Attachment #691221 - Attachment is obsolete: true
Created attachment 698915 [details]
Updated Partners Page

Please find the following link to the updated partners page:

https://www.dropbox.com/s/alnpcs0edm8vv61/introducing-firefox-marketplace_mm.psd

Let me know if you have any questions.
Attachment #693758 - Attachment is obsolete: true
Created attachment 701200 [details]
Updated Partners Page

Link:

https://www.dropbox.com/s/alnpcs0edm8vv61/introducing-firefox-marketplace_mm.psd
(Reporter)

Comment 53

5 years ago
What's the status with this bug? Is the design final yet? Or is it still going through iterations?
(Reporter)

Updated

5 years ago
Assignee: bram → mmaslaney
(Reporter)

Comment 54

5 years ago
Are the links in the footer official links that someone can provide? e.g. Youtube, Twitter, etc. If not, can we remove them for the next sprint if we want to push this live at least in some sort of iteration?

Comment 55

5 years ago
Hi All, I've had to hold off on approvals while helping to the the mozilla.org  partners page for MWC ready and all partner logos collection.  We nearly finished which means we can provide updates on the DevHub page and ensure consistent messaging.

Please expect this by end of today (time permitting) or Monday.
Created attachment 706545 [details]
Slimmed-down partner page with API CTA

I have slimmed the page down and added a CTA at the top for our aggregate publishing API - also, I've changed the H2 text up top to make a bold, in-your-face claim about our target install base (if this is not ok, we can remove it)

I removed the submission-button-flow-chart-thing, it was too narrowly scoped for the end-developer - we have places under Publish that will walk end-developers through that flow, no need for it here.

I'd like to see the three paragraphs next to the Firefox Marketplace screenshot reduced in length a bit. If that's not possible, it's not a deal breaker, see what you can do Diana.

Our hard date to have all commentary closed on this version of the page is this coming Tuesday, January 29th @ 11AM - after that date/time, we will be taking what we have from this point/revision and having Jen implement it.

Comment 57

5 years ago
I am still waiting on Creative from Maria and a finalized marketplace video, but the following are the last changes that I will make to this version based on my group feedback:

1)  Replace "Most pro-developer distribution channel available" with "Bringing the next 2 billion users online"

2)  Replace the mock-up of the Firefox Marketplace store with the picture attached.

3)  Eliminate text on the right of the marketplace mock up and replace with the following:

The web is the platform:  
•	Write once and distribute HTML5 apps on across the entire web

Seamless Payments: 
•	Firefox Marketplace offers flexible business models, and multiple payment processors
•	Carrier billing makes payments easy and frictionless in across multiple geographies/currencies 

Massive Audience: 
•	Tap into Firefox’s audience of over 450M passionate web users
• Reach relatively untapped markets

4)  Please put the partner logos & Video section above the device images

5)  Remove submit now button under partner logos

6)  Remove 'submitting an app is really easy' section entirely.

Comment 58

5 years ago
Daniel - we were working on it at the same time.

My comments pertain to Michael's last version, but incorporate some of your changes as well.

Michael, please note both sets of changes.

I owe you:  
1.  New Marketplace mock-up (awaiting new design from Maria Sandberg)
2.  New Marketplace Video (awaiting updates from Spencer Hui)

Can't wait to push this live at last!

Comment 59

5 years ago
(In reply to Jen Fong-Adwent [:ednapiranha] from comment #54)
> Are the links in the footer official links that someone can provide? e.g.
> Youtube, Twitter, etc. If not, can we remove them for the next sprint if we
> want to push this live at least in some sort of iteration?

Hi Jen.  We have solid partnerships with these partners, but some of the apps are not ready.  I suggest for this sprint.  Push the logos live but do not include the links yet.

Thanks!
(In reply to Diana Livits from comment #57)

> 2)  Replace the mock-up of the Firefox Marketplace store with the picture
> attached.

Was there supposed to be a new attachment to the bug?

Comment 61

5 years ago
apologies - followed up with comment 58 saying I'm awaiting new Marketplace mock-up from Maria. If necessary we can push with the current, but it would be best if we can wait a little bit.
Created attachment 706671 [details]
Updated, slimmed page

I've updated the slimmed down mock to keep our visual thinking in step with Diana's recommendations on content - I'll certainly defer to Maria on any final draft.
Daniel, 

Are finishing up the mocks, or is this in development?
(In reply to Diana Livits from comment #61)
> apologies - followed up with comment 58 saying I'm awaiting new Marketplace
> mock-up from Maria. If necessary we can push with the current, but it would
> be best if we can wait a little bit.

Is Maria designing this page, with visual design from Michael? Just to clarify.

Comment 65

5 years ago
Maria is only creating thw mock up of the marketplace homepage.

Comment 66

5 years ago
Created attachment 706779 [details]
Marketplace Homepage Mock Up

Just to clarify once more - this is the only part of the page that Maria is updating.  Once complete we can add it into the page that Michael is designing.  

Thanks!
Created attachment 707339 [details]
Partner Safe Homescreen

LINK:

https://www.dropbox.com/s/48i8yjjvvaen7g1/Homescreen-safe_v3.psd
Could someone update the dropbox with the latest comp.
(In reply to Michael Maslaney from comment #68)
> Could someone update the dropbox with the latest comp.

Here's the PSD for that simplified page, updated with Diana's content recommendations - but not that latest Marketplace Homepage screenshot: https://www.dropbox.com/s/j8jjfppw4pv51cc/partner-page.psd

Michael, can you give it a once over and CRUD anything that needs to be changed to conform to the content Diana suggested above? (like adding in the Marketplace Home screen)
Created attachment 707386 [details]
Updated

Link:

https://www.dropbox.com/s/k9b45gcxj85nelz/Homescreen-safe_Partner_Safe.psd

Comment 71

5 years ago
Update: I will have the firefox marketplace video link to you tomorrow.
Whiteboard: u=biz c=design p=3 → u=biz c=design p=3 s=2013.2

Comment 72

5 years ago
Hi Michael, 

The video is ready!  Here are links for the video which are now hosted on the CDN.

http://videos-cdn.mozilla.net/serv/Marketplace-videos/OS+Markeyplace%20overview-4thDraft.webm

http://videos-cdn.mozilla.net/serv/Marketplace-videos/OS+Markeyplace%20overview-4thDraft.mp4.mp4

Comment 73

5 years ago
UPDATE - please do not post the video.  Have found a few flaws in the video.  Please wait to upload.

Thanks.
(Reporter)

Comment 74

5 years ago
Daniel or Michael, I need the final PSD for this sprint that contains the updated content - specifically, I don't see the PSD file that contains the cloud graphics around the rocket. The original PSD does not have this and I would rather have them on a separate layer from the background.
(Reporter)

Comment 75

5 years ago
Wait! Nevermind! Found it. :)
(Reporter)

Comment 76

5 years ago
Michael, do you have a version of the Marketplace logo that is standalone on PSD or is a transparent png?
(Reporter)

Comment 77

5 years ago
Also, is this new header supposed to replace all Devhub headers or is it an exception for this particular page? Specifically the 'Design, Build, Publish' that was recently changed.
(In reply to Jen Fong-Adwent [:ednapiranha] from comment #77)
> Also, is this new header supposed to replace all Devhub headers or is it an
> exception for this particular page? Specifically the 'Design, Build,
> Publish' that was recently changed.

That link-list header nav was before the switch to the more compact header nav and iconified sub nav text links, just ignore that part.
Jen, 

The mockup can be done by EOD. 

I have a transparent png, but not within the psd file. You can find all assets here:

http://www.mozilla.org/en-US/styleguide/identity/marketplace/branding/
(Reporter)

Comment 80

5 years ago
Michael:

What font is underneath the Firefox Marketplace logo where it says 'Developer Hub'? That isn't available in the assets page. 

Thanks, let me know.
(Reporter)

Comment 81

5 years ago
Hey Michael - it turns out I may need your png from your mock after all, as a layer for the logo (if this is officially to change and replace the current one on http://marketplace.firefox.com) 

The assets on mozilla.org are assuming a light background with dark text and not vice versa.
Created attachment 708197 [details]
Meta Pro
Created attachment 708200 [details]
Marktplace Logo (White type)

Please find the following attached logo.
Jen, these are in zamboni if you need them:

https://github.com/mozilla/zamboni/blob/master/media/img/mkt/logo.png
https://github.com/mozilla/zamboni/blob/master/media/img/mkt/logos/large.png
https://github.com/mozilla/zamboni/blob/master/media/img/mkt/logos/large-2x.png
(Reporter)

Comment 85

5 years ago
Hey Michael - I'll need the layer for the clouds and the rocket (so that they have a transparent background) 

Thanks!
Created attachment 708341 [details]
Updated Partners Page

Please find the following update of the Marketplace Partners page:

https://www.dropbox.com/s/alnpcs0edm8vv61/introducing-firefox-marketplace_mm.psd


Let me know if you additional updates.
(In reply to Michael Maslaney from comment #86)
> Created attachment 708341 [details]
> Updated Partners Page
> 
> Please find the following update of the Marketplace Partners page:
> 
> https://www.dropbox.com/s/alnpcs0edm8vv61/introducing-firefox-marketplace_mm.
> psd
> 
> 
> Let me know if you additional updates.

This looks really good Michael. Let's get this implemented!

Comment 88

5 years ago
I will have video by tomorrow morning.  Its waiting on final sign off.

Michael - one final change to the page.  The heading above all the devices no longer fits (and is repetitive based on the content changes above). 

Let's Change the copy to: 

Firefox Marketplace - a truly cross-platform, cross-device, non -proprietary home for the world's best global and local HTML5 apps
(In reply to Jen Fong-Adwent [:ednapiranha] from comment #80)
> Michael:
> 
> What font is underneath the Firefox Marketplace logo where it says
> 'Developer Hub'? That isn't available in the assets page. 

FF Meta Italic
(Reporter)

Comment 90

5 years ago
Michael, do you have this updated file as a PSD? Specifically, I need the top rocket logo (and the shadow rockets) on a separate layer, and the icons all on a separate later (so that they have a transparent background).

Thanks!

Comment 91

5 years ago
Hello Michael, 

I just got a note from cut the rope and they would like to replace the icon in the marketplace homepage mock-up with the following:

https://www.dropbox.com/s/3btggl5sopz7cte/icon_512x512.png

They suggest using the icon with scissors and a candy which is more recognizable than the simple Om Nom picture.
Created attachment 708665 [details]
Updated Partners Page

Updated PSD files:

https://www.dropbox.com/s/alnpcs0edm8vv61/introducing-firefox-marketplace_mm.psd
The content of attachment 708197 [details] has been deleted for the following reason:

Requested for reasons specified in bug 836830.
(Reporter)

Comment 94

5 years ago
Michael, can you give me a version of the device images with a transparent background? You don't have to send the entire PSD , just a png with those as a single image is fine (firefox os, android smartphones, etc) Thanks!
Bram,

Do you know where you pulled the device icons from? I am having a difficult time finding the source files.
The icons are used on DevHub, and they can be found at:

Firefox OS:
https://marketplace.cdn.mozilla.net/media/img/developers/firefox_phone.png

Firefox for Android smartphones:
https://marketplace.cdn.mozilla.net/media/img/developers/firefox_android_phone.png

Firefox for Android tablets:
https://marketplace.cdn.mozilla.net/media/img/developers/firefox_android_tablet.png

Firefox for Desktop (plain Firefox logo):
https://marketplace.cdn.mozilla.net/media/img/developers/firefox_logo.png
(Reporter)

Comment 97

5 years ago
I am going to set this bug as resolved for now, since I am in the process of completing bug 810977 and any updates to the page in terms of design, copy, etc can be opened as new bugs.
Status: NEW → RESOLVED
Last Resolved: 5 years ago
Resolution: --- → FIXED
(Reporter)

Comment 98

5 years ago
Diana, has the video update been resolved? If not, I will open a separate bug for it.

Comment 99

5 years ago
Hoping to have this by the end of the day. Please open a separate bug and at Rainer C to it.  He will provide the link to the video!
Thanks!

Comment 100

5 years ago
http://youtu.be/FItUlNsCfho   all set!

Comment 101

5 years ago
Could someone please tell me when this page is set to go live?

Also - who needs to be involved for localizing this page (ideally, Spanish & BR Portuguese to start)
You need to log in before you can comment on or make changes to this bug.