Last Comment Bug 734197 - [3.6 EOL/Start Page Migration][tracking] Create new version of start page
: [3.6 EOL/Start Page Migration][tracking] Create new version of start page
Status: RESOLVED FIXED
[tracking]
:
Product: Marketing
Classification: Other
Component: Design (show other bugs)
: unspecified
: x86 Mac OS X
: -- normal (vote)
: ---
Assigned To: Ty Flanagan
:
Mentors:
Depends on: 737619
Blocks: 734203 771732 771734
  Show dependency treegraph
 
Reported: 2012-03-08 11:31 PST by Laura Forrest
Modified: 2013-12-27 14:21 PST (History)
13 users (show)
See Also:
Due Date:
QA Whiteboard:
Iteration: ---
Points: ---


Attachments
FFx 3.6 EOL Start Page - Message 1 (281.25 KB, image/png)
2012-03-22 09:12 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - Message 2 (254.17 KB, image/png)
2012-03-22 09:12 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - Message 3 (117.63 KB, image/png)
2012-03-22 09:13 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - Message 4 (79.37 KB, image/png)
2012-03-22 09:14 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - Message 5 (122.95 KB, image/png)
2012-03-22 12:14 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - Revised - Ver1 (85.09 KB, image/png)
2012-03-26 07:07 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - Revised - Ver2 (75.73 KB, image/png)
2012-03-26 07:07 PDT, Ty Flanagan
no flags Details
FFx 3.6 EOL Start Page - PSD (1.20 MB, application/zip)
2012-03-29 11:59 PDT, Ty Flanagan
no flags Details
Alert Icon replacement (4.54 KB, image/png)
2012-04-12 09:08 PDT, Ty Flanagan
no flags Details
Updated CSS (4.13 KB, text/plain)
2012-04-12 09:09 PDT, Ty Flanagan
no flags Details
screen shot of latest CSS/graphic changes (55.26 KB, image/png)
2012-04-16 09:55 PDT, Jon Petto [:jpetto]
no flags Details

Description Laura Forrest 2012-03-08 11:31:40 PST
Project Overview:
https://wiki.mozilla.org/Engagement/Product_Marketing/3.6_Upgrade/StartPage#Project_Overview

Visual Design Requirements: 
https://wiki.mozilla.org/Engagement/Product_Marketing/3.6_Upgrade/StartPage#Visual_Design_Requirements

Timing: 
Would be nice to have mockups of a couple different approaches within the next two weeks, by 3/22.
Comment 1 John Slater 2012-03-09 15:53:16 PST
Assigning the design to Ty, but to do this really right it would be nice to collaborate closely with WebDev to make sure the solution includes both design and technical thinking (for example, some slick overlay).

Can we get a developer assigned to this and then have a kickoff meeting to discuss?
Comment 2 Laura Forrest 2012-03-13 13:11:04 PDT
(In reply to John Slater from comment #1)
> Assigning the design to Ty, but to do this really right it would be nice to
> collaborate closely with WebDev to make sure the solution includes both
> design and technical thinking (for example, some slick overlay).
> 
> Can we get a developer assigned to this and then have a kickoff meeting to
> discuss?

I filed Bug 735411 for Webdev and will setup a meeting asap to discuss. Because we'll need l10n, time is very tight.
Comment 3 John Slater 2012-03-13 17:37:09 PDT
Sounds good. Be sure Ty is in that meeting!
Comment 4 Laura Forrest 2012-03-14 09:17:45 PDT
(In reply to Laura Forrest from comment #2)
> (In reply to John Slater from comment #1)
> > Assigning the design to Ty, but to do this really right it would be nice to
> > collaborate closely with WebDev to make sure the solution includes both
> > design and technical thinking (for example, some slick overlay).
> > 
> > Can we get a developer assigned to this and then have a kickoff meeting to
> > discuss?
> 
> I filed Bug 735411 for Webdev and will setup a meeting asap to discuss.
> Because we'll need l10n, time is very tight.

Hey Cmore - I think this is a good idea. Can you recommend someone from the WebDev team so we can start this design process. Timing is pretty tight here, so it would be great to have this kickoff ASAP. Thanks!
Comment 5 Chris More [:cmore] 2012-03-14 09:30:41 PDT
> Hey Cmore - I think this is a good idea. Can you recommend someone from the
> WebDev team so we can start this design process. Timing is pretty tight
> here, so it would be great to have this kickoff ASAP. Thanks!

Hi everyone. Christie Koehler is going to be the technical project manager on this project and we will work together on determining who can do the development. 

Stay tuned!
Comment 6 Laura Forrest 2012-03-16 09:24:18 PDT
Hi Ty - We had the kickoff meeting for this overall project yesterday and decided that when it comes to design, please feel free to design as you'd like. Fred can help from the dev side in case a certain aspect of the design can't be implemented, etc, but for the most part we should be able to push anything you come up with. 

That said - have at it!
Comment 7 Ty Flanagan 2012-03-22 09:12:18 PDT
Created attachment 608355 [details]
FFx 3.6 EOL Start Page - Message 1
Comment 8 Ty Flanagan 2012-03-22 09:12:42 PDT
Created attachment 608356 [details]
FFx 3.6 EOL Start Page - Message 2
Comment 9 Ty Flanagan 2012-03-22 09:13:05 PDT
Created attachment 608357 [details]
FFx 3.6 EOL Start Page - Message 3
Comment 10 Ty Flanagan 2012-03-22 09:14:14 PDT
Created attachment 608359 [details]
FFx 3.6 EOL Start Page - Message 4
Comment 11 Ty Flanagan 2012-03-22 12:14:39 PDT
Created attachment 608423 [details]
FFx 3.6 EOL Start Page - Message 5
Comment 12 Laura Forrest 2012-03-23 07:45:14 PDT
Fred - from a technical perspective, can any of the above not be done? 

Next Steps: We're working with stakeholders to reach consensus on final copy/design mix from the options above. We'll have that by 3/26 or before, posted here.
Comment 13 Laura Mesa [:lmesa] [:lvmesa] 2012-03-23 09:08:31 PDT
Hi guys,

Got feedback from Patrick and talked it over with Slater. 

In terms of graphics, we want to do two versions of comment 7, but with a few tweaks. 
-Patrick mentioned that he still felt like the notice felt a bit too "spam" like.  John suggested trying to make the shapes of the graphics feel a bit more like they are part of the browser. One suggestion was using the shapes of Tabzilla for the shapes of the notice. The shapes should also be more thematic, as opposed to trying to copy the browser chrome exactly because this notice needs to be able to be shown to Windows, Mac and Linux users and still feel like part of Firefox. 
-In terms of the two versions, I think we like the idea of using a blue palate for the first version and using a redder palate for the more urgent version. 

In terms of copy, we agreed on using the following for version 1:
"This version of Firefox is out of date.
Upgrade today for the latest in speed and security.
[Download button]" 

Copy for version 2: 
"Important: Your Firefox is out of date!
Please download the latest version to continue.
[Download button] "
Comment 14 Fred Wenzel [:wenzel] 2012-03-23 10:02:21 PDT
(In reply to Laura Forrest from comment #12)
> Fred - from a technical perspective, can any of the above not be done? 

Nope, from looking at the mockups, there's no reason for concern. We'll essentially have the well-known start page in the background and put an overlay over it alerting users of a pending upgrade?

> Next Steps: We're working with stakeholders to reach consensus on final
> copy/design mix from the options above. We'll have that by 3/26 or before,
> posted here.

Excellent. I think Jon Petto should be able to pick up the frontend implementation for this. Looks like we'll put this on bedrock, so this sounds like it'd be a good start.
Comment 15 Ty Flanagan 2012-03-26 07:07:19 PDT
Created attachment 609310 [details]
FFx 3.6 EOL Start Page - Revised - Ver1
Comment 16 Ty Flanagan 2012-03-26 07:07:45 PDT
Created attachment 609311 [details]
FFx 3.6 EOL Start Page - Revised - Ver2
Comment 17 John Slater 2012-03-26 15:21:06 PDT
Thanks Ty! 

LoMo & LoFo, what do yo uthink?
Comment 18 Laura Forrest 2012-03-27 14:42:35 PDT
I think they look great. Emailing Patrick now for his final approval. Will update here, hopefully, in next 24 hours.
Comment 19 Laura Forrest 2012-03-29 11:50:48 PDT
These are good to go. Here are the copy strings that will need to be localized for this dialog box. I'm not sure if any new l10n will be needed for the core page underneath.


Version 1:

Your browser is out of date.

Upgrade today for the latest in speed and security. 

Firefox Free Download

No thanks, I'll risk it. 


Version 2:

Important: Your Firefox is out of date!

Please download the latest version to continue. 

Firefox Free Download

No thanks, I'll risk it. 


l10n alternatives for the "No thanks, I'll risk it." line in case "I'll risk it" does not localize well:

I decline this upgrade.
Comment 20 Laura Forrest 2012-03-29 11:51:59 PDT
Ty - Can you post the final PSDs?
Comment 21 Ty Flanagan 2012-03-29 11:59:49 PDT
Created attachment 610633 [details]
FFx 3.6 EOL Start Page - PSD

contains both layouts separated by grouped layers.
Comment 22 Laura Forrest 2012-04-02 14:18:08 PDT
Thanks Ty!

Looks like Pascal hasn't gotten the copy yet from Comment 19, so I'm putting it in a text file and emailing it now.
Comment 23 Ty Flanagan 2012-04-12 09:08:55 PDT
Created attachment 614396 [details]
Alert Icon replacement
Comment 24 Ty Flanagan 2012-04-12 09:09:45 PDT
Created attachment 614397 [details]
Updated CSS

Went through the stylesheet and made changes to the gradient and positioning of divs
Comment 25 [github robot] 2012-04-16 09:54:04 PDT
Commit pushed to master at https://github.com/mozilla/fx36start

https://github.com/mozilla/fx36start/commit/0504bea4e0d5c921f866f2b3b00ae0c08fb694a8
implemented Ty's CSS changes & new alert icon. bug 734197
Comment 26 Jon Petto [:jpetto] 2012-04-16 09:55:37 PDT
Created attachment 615367 [details]
screen shot of latest CSS/graphic changes

Note You need to log in before you can comment on or make changes to this bug.