1299947 - redesign Firefox pre-release download experience

Status: RESOLVED FIXED

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

Description

[Jennifer Bertsch [:jbertsch]]

As a Firefox user who is interested in using a Firefox pre-release build, I want to understand the differences between the builds so that I can pick the best one for me.

This epic maps to different stories based on motivations of users and the products in which they are interested:

Motivations:

1 - So I can help test/report bugs (contribute to community) for (insert product 1,2 or 3)
2 - So I can ensure my code works with the latest builds for (insert product 1,2 or 3)
3 - So I can learn about new features, using and testing them for (insert product 1,2 or 3)

Products:
1 - FF Desktop - Dev/Beta/Nightly/TestPilot (Motivations - All)
2 - FF iOS - Test Flight (Motivations - 1 & 3)
3 - FF Android - Aurora/Beta/Nightly (Motivations - All)

Acceptance criteria:
Page addresses motivations for choosing a pre-release channel, provides information about Firefox pre-release channel options by product, including download buttons, where applicable, or links to sign up/get more info (test flight and test pilot programs).  User can successfully download or go to page to learn more.

Each product's pre-release channels section includes links to the appropriate /all page if it exists so users can find all available versions.

Comment 1

[Jennifer Bertsch [:jbertsch]]

Attachment: work in progress design Sept 1, 2016

Comment 3

[Alex Gibson [:agibson]]

Sketch file: https://drive.google.com/open?id=0Bw8GuIJD9hBMSG0zdnd5dVo4V1E

Related assets: https://drive.google.com/open?id=0Bw8GuIJD9hBMNW5wTnBXMDNINTg

Comment 4

[Alex Gibson [:agibson]]

Final copy: https://docs.google.com/a/mozilla.com/document/d/1mFHwiRlU_s31RktJVONY9_a4jbMfIzSWhw2U1rTFnXQ/edit?usp=sharing

Comment 5

[Michael Ham]

Added mobile viewport visual design, updated 1024px viewport for desktop, added 1024px viewport for Android, and updated 1440px viewport for desktop.

Sketch file here: https://drive.google.com/open?id=0Bw8GuIJD9hBMSG0zdnd5dVo4V1E

Comment 6

[Alex Gibson [:agibson]]

Some notes / questions as I flesh out the template based on the copy & design:

- Firefox Android Nightly downloads links are currently not available on bedrock (same applies for the /firefox/android/nightly/all/ page). It probably doesn't make much sense to have an Android Nightly /all page, as updating would be a pain. In Bug 1241114 we are looking to publish Android Nightly to the Play store, so once this is complete then maybe we can add the Nightly section to the android pre-release page. For now, we'll have to comment it out.

- We don't currently have an /all page for Firefox Aurora on Android. I'm not sure why one doesn't exist, but it's currently 404.

- There is copy in the design that is not included in the copy doc. Strings such as: "Firefox Beta automatically sends feedback to Mozilla. Learn more" have been lifted from the existing channel page, but are not present in the copy doc. Should they be included (legally?), do they need updating at all?

- Do we also need copy for the pages meta information for SEO? We have three separate pages based on platform, but only a single title / description based on the shared header. We could probably optimize each page for higher page rank.

- What should the URL's for these pages be? Currently I am using:

/firefox/channel/desktop/
/firefox/channel/android/
/firefox/channel/ios/

(/firefox/channel/ redirects to /firefox/channel/desktop/)

Comment 7

[Francesco Lodolo [:flod]]

There's bug 1301650 for Android (I'm aware of it mostly because I was pinged in https://github.com/mozilla-releng/ship-it/pull/124)

Comment 8

[Kohei Yoshino]

Yeah, Bug 1301650 might be a blocker for this, even if we don't want to list single-locale builds.

Comment 9

[Alex Gibson [:agibson]]

(In reply to Kohei Yoshino [:kohei] from comment #8)
> Yeah, Bug 1301650 might be a blocker for this, even if we don't want to list
> single-locale builds.

I don't think we should need to block this work on that bug. It can be added later, although it sounds like Bug 1241114 might be a better solution.

Comment 10

[Alex Gibson [:agibson]]

WIP demo: https://www-demo1.allizom.org/en-US/firefox/channel/desktop/

Strings are not yet final, still working on design & responsiveness.

Comment 11

[Alex Gibson [:agibson]]

Michael, it would be really helpful to have some form on visual mockup for the iOS page as it's a little different featuring only Test Flight. Could you please provide something? (just rough visual direction would do fine)

Thanks

Comment 12

[Jennifer Bertsch [:jbertsch]]

(In reply to Alex Gibson [:agibson] from comment #11)
> Michael, it would be really helpful to have some form on visual mockup for
> the iOS page as it's a little different featuring only Test Flight. Could
> you please provide something? (just rough visual direction would do fine)
> 
> Thanks

Hi Alex-

Michael and I looked at this today.  We'd like to use the same style as the desktop and android pages, with the ios image from /products at the image in place of a logo.

Michael said he would look Thursday AM

Thx,
Jen

Comment 13

[Alex Gibson [:agibson]]

(In reply to Jennifer Bertsch [:jbertsch] from comment #12)
> (In reply to Alex Gibson [:agibson] from comment #11)
> > Michael, it would be really helpful to have some form on visual mockup for
> > the iOS page as it's a little different featuring only Test Flight. Could
> > you please provide something? (just rough visual direction would do fine)
> > 
> > Thanks
> 
> Hi Alex-
> 
> Michael and I looked at this today.  We'd like to use the same style as the
> desktop and android pages, with the ios image from /products at the image in
> place of a logo.
> 
> Michael said he would look Thursday AM
> 
> Thx,
> Jen

Ok thanks,

This is blocking localization as I need to know if there should be a link in this string, or if we're missing a CTA on the iOS page:

"Sign up to test beta versions of Firefox for iOS via Apple’s TestFlight program."

Comment 14

[Alex Gibson [:agibson]]

Hi Jen, in the designs we also have information such as this underneath the download buttons:

"OSX 10.9+ | 105MB | .dmg | Firefox 51"

As far as I know we have no way to get information such as file download size automatically. System requirements pages are also handled outside of bedrock, and pulled in similar to release notes. I don't think we should be hard-coding information like this as it will just become out of date and lead to manual maintenance. Also I thought we we're legally required to have the "Firefox Privacy" link underneath the download buttons. I'd like to propose we drop this information and just use whatever is displayed as default by the download buttons the same as any other page.

Does this sound ok?

Comment 15

[Jennifer Bertsch [:jbertsch]]

(In reply to Alex Gibson [:agibson] from comment #14)
> Hi Jen, in the designs we also have information such as this underneath the
> download buttons:
> 
> "OSX 10.9+ | 105MB | .dmg | Firefox 51"
> 
> As far as I know we have no way to get information such as file download
> size automatically. System requirements pages are also handled outside of
> bedrock, and pulled in similar to release notes. I don't think we should be
> hard-coding information like this as it will just become out of date and
> lead to manual maintenance. Also I thought we we're legally required to have
> the "Firefox Privacy" link underneath the download buttons. I'd like to
> propose we drop this information and just use whatever is displayed as
> default by the download buttons the same as any other page.
> 
> Does this sound ok?

Yes.  Let's proceed as you suggest.  Thanks, Alex.

Comment 16

[Jennifer Bertsch [:jbertsch]]

(In reply to Alex Gibson [:agibson] from comment #13)
> (In reply to Jennifer Bertsch [:jbertsch] from comment #12)
> > (In reply to Alex Gibson [:agibson] from comment #11)
> > > Michael, it would be really helpful to have some form on visual mockup for
> > > the iOS page as it's a little different featuring only Test Flight. Could
> > > you please provide something? (just rough visual direction would do fine)
> > > 
> > > Thanks
> > 
> > Hi Alex-
> > 
> > Michael and I looked at this today.  We'd like to use the same style as the
> > desktop and android pages, with the ios image from /products at the image in
> > place of a logo.
> > 
> > Michael said he would look Thursday AM
> > 
> > Thx,
> > Jen
> 
> Ok thanks,
> 
> This is blocking localization as I need to know if there should be a link in
> this string, or if we're missing a CTA on the iOS page:
> 
> "Sign up to test beta versions of Firefox for iOS via Apple’s TestFlight
> program."

Hi Alex-

Let's change the copy to:
Test beta versions of Firefox for iOS via Apple’s TestFlight program.
Sign up now (blue CTA)

Thanks,
Jen

Comment 17

[Alex Gibson [:agibson]]

Attachment: GitHub pull request

Comment 18

[Alex Gibson [:agibson]]

Opening a pull request linked in Comment 17, as I believe we now have all the strings we we're waiting for.

Comment 19

[Francesco Lodolo [:flod]]

Tracking dashboard for l10n
https://l10n.mozilla-community.org/langchecker/?locale=all&website=0&file=firefox/channel/index.lang

Comment 20

[Alex Gibson [:agibson]]

Clearing old needsinfo

Comment 21

[u570438]

Hi Alex,

Can you be sure to put the standard data attributes in the header and footer.

Thanks,

PG

Comment 22

[Alex Gibson [:agibson]]

(In reply to Peter German from comment #21)
> Hi Alex,
> 
> Can you be sure to put the standard data attributes in the header and footer.
> 
> Thanks,
> 
> PG

This should already be in place. If not, let me know what's not right.

Thanks

Comment 23

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/7033691ff7dfaed541e0b756b775029085d3e938
[fix bug 1299947] Firefox pre-release download pages

https://github.com/mozilla/bedrock/commit/8c7cb23c1a3b64859c77c7df51fe9caf9523a691
Merge pull request #4348 from alexgibson/bug-1299947-firefox-pre-release-pages

[fix bug 1299947] Firefox pre-release download pages