1449758 - [Growth] Facebook Container landing page

Status: RESOLVED FIXED

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

Description

[Eric Renaud [:erenaud]]

Use the template as for the video a/b test - https://bugzilla.mozilla.org/show_bug.cgi?id=1434764

Fabio will provide assets

- New Copy (legal approval required?)
- New Video

Request is go live Thursday March 29th

Comment 1

[Eric Renaud [:erenaud]]

set URL to: /firefox/facebookcontainer

Remove <noindex> tag so this page can rank in SERP

Comment 2

[Sung Park]

Attachment: Landing page visual example

Comment 3

[Sung Park]

Attachment: BG GRAPHIC

Comment 4

[Craig Cook (:craigcook)]

Stub page on demo https://bedrock-demo-craigcook.us-west.moz.works/en-US/firefox/facebookcontainer/

Copy is a very rough first draft, still being worked on, but it's useful to see it in context.

@sung,

I used the image from the blog post as the video poster but I think we should try something else because the play button is totally lost in the fence icon. I also added the white border because the video just blended into the background, but a different poster image might not need it. Any ideas?

I also think the left edge of the Firefox logo blends into the background and makes the logo look misshapen. Maybe we should darken that wedge of the background a bit, and maybe shift it just a little more to blue?

Comment 5

[Sung Park]

Good point. I've been working on implementing the Facebook blue into the gradient– I'll create several solutions tonight and discuss with Yuliya about this issue.

Comment 6

[Sung Park]

OK. I've got feedback from Yuliya.

Can we change the header background image to a solid background color #3b5998?
Can we change the button color to green #33f70c?
Can we move the Firefox logo to the right, and add the FB Container Ext icon above the headline?

I attached the extension icon and an overall visual example above.

Please LMK if you need anything else.

Comment 7

[Sung Park]

Attachment: FF58_FBContainerExt_LandingPage_v1-06.png

Comment 8

[Sung Park]

Attachment: icon.svg

Comment 9

[Sung Park]

Attachment: icon-256.png

Comment 10

[Sung Park]

Ahh there will be further changes. Please hold on!

Comment 11

[Sung Park]

Attachment: FF58_FBContainerExt_LandingPage_v1-10.png

Comment 12

[Sung Park]

Attachment: FF58_FBContainerExt_LandingPage_v1-10.png

Comment 13

[Sung Park]

Attachment: CTA BUTTON.png

Comment 14

[Sung Park]

Attachment: CTA BUTTON.png

Comment 15

[Sung Park]

Attachment: FF LOGO_1.png

Comment 16

[Sung Park]

Hey Craig, sorry for the bombarded info on the doc, wish I could help. Can we remove the white border on the video and switch the font Open Sans to Circular Pro? Also Yuliya doesn't think the extension icon is necessary anymore. Can you increase the line spacing in the headline, and a little more in the sub-header?

Comment 17

[Sung Park]

Attachment: Poster Image.png

Here's the Poster image

Comment 18

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/bedrock/pull/5547

Comment 19

[Fabio Rios [:frios]]

Confirming we are good to go! Let me know when it's live. Thanks!

Comment 20

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/986566356f3f847cd50274e8d4a483a45a0c0bac
[fix bug 1449758] Landing page for Facebook Container

Comment 21

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/bedrock/pull/5549

Comment 22

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/ab973c772295bf5d54983e0d3f478c1b82a0d660
[fix bug 1449758] Use high res logo on FB containers page. (#5549)

Comment 23

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/bedrock/pull/5552

Comment 24

[Fabio Rios [:frios]]

Hey there, we needed to make a change to the video:
Can we use this version on the page?

https://drive.google.com/open?id=10330U1eYpHfMrLWbODZ54vsKLlCOrcaK

Comment 25

[Craig Cook (:craigcook)]

(In reply to Fabio Rios [:frios] from comment #24)
> Hey there, we needed to make a change to the video:
> Can we use this version on the page?
> 
> https://drive.google.com/open?id=10330U1eYpHfMrLWbODZ54vsKLlCOrcaK

Updated. The video is hosted outside bedrock so this didn't require any code changes or a production push, I just updated the files on the server.

Comment 26

[Fabio Rios [:frios]]

Can we modify the H2 for people that visit via a mobile device?

Can we update the H2 to read: 

"The Facebook Container Extension is not available on mobile devices. Try Firefox Focus, the privacy browser for Android and iOS.

[hyperlink with adjust link]

Comment 27

[Craig Cook (:craigcook)]

Reopening for the mobile update (I suppose we could file a new bug but it's already here...)

Comment 28

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/bedrock/pull/5557

Comment 29

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/1b7745a343713ae99614cc1f147076d2e2491637
[fix bug 1449758] Add Focus CTA for mobile browsers

Comment 30

[Eric Renaud [:erenaud]]

Craig, reopening with the request to add a video with German subtitles, shown to DE visitors to the page.

https://youtu.be/7yLoRVwuZlc

Comment 31

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/bedrock/pull/5604

Comment 32

[[github robot]]

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

https://github.com/mozilla/bedrock/commit/a39918bb1fb43738eb3dbbbf7aa559f4f2baf801
[fix bug 1449758] Add Facebook Container video for German

Comment 33

[Craig Cook (:craigcook)]

Clearing needinfo.

Comment 34

[Craig Cook (:craigcook)]

Let's try that again, this time with the box checked...