503324 - Implement new design as HTML/CSS/JS

Status: VERIFIED FIXED

(Websites Graveyard :: byob.mozilla.com, defect)

Description

[Les Orchard [:lorchard]]

Once there's a new design finalized, skin the app with it.

Comment 1

[Neil Lee [:neilio]]

Okay, I've got most of the mockups completed:

http://people.mozilla.com/~nlee/byob/mockups/v1/

The two pages left that I know about are the first-run page and the browser detail / download page, coming by EOD Tuesday. 

I made a few UX-y related changes, Les - hopefully these aren't painful, but let me know if something I've done provokes teeth-gnashing and we can iterate.

My suggestion is we have a short meeting on Monday to go over these - the Profile page in particular may need some explanation and changes as I don't think we have this functionality (to show the current state of where a browser submission is) existing in the app.

Also, the Registration page does not show all of the fields that are in the app - just the key fields, and an example of how some of the other ones (select menu, radio buttons) look like.

Beef, bouquets, withering bags of snakes - throw them my way.

Comment 2

[Kev Needham [:kev]]

Looks good, Neil. I'll pass along some more comments tomorrow am, but just wanted to let everyone know I'm in the air most of the day and will be in MV around 4pm Eastern. Feel free to have the call to keep things rolling, and we can do a quick status on IRC when I get to the office.

Comment 3

[Neil Lee [:neilio]]

Attachment: BYOB mockups

Here be the mockup PSD. As I mentioned on the call, if there are any problems figuring out the layer organization (much of this is in layer sets) let me know and I can break it out into separate files.

Comment 4

[Les Orchard [:lorchard]]

(In reply to comment #3)
> Created an attachment (id=394875) [details]
> BYOB mockups
> 
> Here be the mockup PSD. As I mentioned on the call, if there are any problems
> figuring out the layer organization (much of this is in layer sets) let me know
> and I can break it out into separate files.

Just tried opening this in Gimp - layers work, but not the folders.  Ugh.  So, if you can break these out into separate files, that would be awesome.

Comment 5

[Neil Lee [:neilio]]

(bah, silly Bugzilla attachment size limits)

Okay, I've split each page / modal out into its own PSD and have also updated a few of them (the registration page and the confirm/review modal) based on our discussion today.

Hopefully the layer names make sense - I had everything grouped together in sets so I went through and renamed a bunch of things in these to hopefully make them more sensible.

http://people.mozilla.com/~nlee/byob/mockups/byob-psds.zip

Comment 6

[Les Orchard [:lorchard]]

Still in progress, but just checked in the first steps toward header / footer / home page as r49518

Comment 7

[Neil Lee [:neilio]]

Attachment: Full PSD with completed browser page

Here's the full PSD (layer sets and all) that should work fine in Fireworks CS4. The browser page is now complete.

Comment 8

[Les Orchard [:lorchard]]

I'm going to call this one closed for now, since I think I've gotten through all the mockups.  If additional issues are found, go ahead and file more specific bugs.

Comment 9

[Carsten Book [:Tomcat]]

-> verified