510623 - Refresh the visual design of all content area messages

Status: NEW

(Firefox :: Theme, defect)

Description

[Alex Faaborg [:faaborg] (Firefox UX)]

Our content area messages could use a visual overhaul.  We want to make sure that for each platform content area message are visually consistent across the entire product.  So this covers the visual design of pages like:

-server not found
-about:privatebrowsing
-about:sessionrestore
-offline connection

As well as others that are variations on these but with special styling to draw more attention:

-reported Web forgery
-reported attack site

There are a few other bugs that have been in this area before, personally I'm in favor of a very polish but also very bland approach.  So for instance I really like the soft and recessed messages in the app Things, as opposed to some of the mockups features in bug 396407.

Comment 1

[Jennifer Morrow [:Boriss] (UX)]

A bit of background: refreshing these areas was looked at in the Sprint for network error and especially 404 pages, which is in the wiki here:

https://wiki.mozilla.org/Firefox/Sprints/Network_Error_Pages#Introduction

A few placeholder graphics were used in this sprint, mostly based on the visual style of the new Firefox logo.  The logic of using this was that simply placing the Firefox logo on content area messages was a bit heavy-handed and uninteresting, but playing with the design of the curves and textures could create a subtly branded but interesting design.  As you can see in the attachment, Firefox's content area pages right now are extremely plain, and over-branding or over-designing the pages is likely too complicated an approach.  A better solution would be a thoughtful visual refresh, both easy to read and aesthetically pleasing.  Because I've been thinking about this awhile I'll be posting some mockups on this bug for wider discussion.

Comment 2

[Jennifer Morrow [:Boriss] (UX)]

For reference, a chart of the network error page design of all major browsers (Too big for an attachment):

https://wiki.mozilla.org/images/f/fd/404_poster.png

Comment 3

[Alex Faaborg [:faaborg] (Firefox UX)]

Attachment: Content area message in Things

This is pretty subtle, but I love how the surface is slightly textured and seems like it would be soft if you were to touch it.  Also really like the recessed message.

Comment 4

[u428464]

Some of the new in-content area messages can be found here (part of the Australis redesign) : http://people.mozilla.com/~shorlander/files/australis-design-specs/australis-design-specs-windows7-aero.html

Comment 5

[Willy_ Foo_Foo]

A small enhancement
Sites with no fav icons(or manually disabled)
should not have any fav icons(many of us hate them)

else
should have a default icon like Star or something(though can be disabled)

Comment 6

[BugBot [:suhaib / :marco/ :calixte]]

The bug assignee is inactive on Bugzilla, so the assignee is being reset.