Closed
Bug 399119
Opened 17 years ago
Closed 14 years ago
Improve the appearance of messages shown in the content area? (netError, feed preview, etc)
Categories
(Firefox :: General, enhancement)
Firefox
General
Tracking
()
RESOLVED
DUPLICATE
of bug 594996
People
(Reporter: faaborg, Unassigned)
Details
Attachments
(16 files, 1 obsolete file)
35.18 KB,
image/png
|
Details | |
44.44 KB,
image/png
|
Details | |
53.12 KB,
image/png
|
Details | |
170.23 KB,
image/jpeg
|
Details | |
85.38 KB,
image/png
|
Details | |
58.90 KB,
image/png
|
Details | |
87.57 KB,
image/png
|
Details | |
117.18 KB,
image/png
|
Details | |
126.61 KB,
image/png
|
Details | |
126.71 KB,
image/png
|
Details | |
62.85 KB,
image/png
|
Details | |
81.29 KB,
image/png
|
Details | |
154.82 KB,
image/png
|
Details | |
161.38 KB,
image/png
|
Details | |
217.67 KB,
image/png
|
Details | |
163.47 KB,
image/png
|
beltzner
:
ui-review-
|
Details |
Do we want to refresh the appearance of messages shown in the content area (no internet connection, RSS preview, SLL errors, browsing an FTP server) in Firefox 3? Also, do we want to theme these messages for each platform, beyond the yellow exclamation point triangle icon being used? Personally I'm in favor of transitioning all of these messages to door-hanger notifications off of the favicon button, to be more consistent with where Firefox addresses the user. But since we probably aren't going to do that, do we want to consider a visual refresh of content area messages?
Reporter | ||
Comment 1•17 years ago
|
||
Reporter | ||
Comment 2•17 years ago
|
||
Reporter | ||
Comment 3•17 years ago
|
||
Reporter | ||
Comment 4•17 years ago
|
||
I should note that I think the new FTP interface is fantastic, I'm just talking about our choice of visual elements that are consistent across the messges: -background color -forground color -curved edges etc.
Comment 5•17 years ago
|
||
the plain-gray backgrounds are boring, can't we make these pretty? Here's an extreme example, but maybe even just a nice solid background color would be nice.
Comment 6•17 years ago
|
||
Thanks, Dan! Pastels make me want to run away screaming.
Comment 7•17 years ago
|
||
Comment 8•17 years ago
|
||
Comment 9•17 years ago
|
||
Reporter | ||
Comment 10•17 years ago
|
||
I was thinking about maybe trying to use SVG to do extremely large high res single color icons in the background, with a slight transparency on the message. I'll try a quick mockup.
Reporter | ||
Comment 11•17 years ago
|
||
Here is what I was thinking of, although I would probably reduce the contrast between the large icon and background even more.
Reporter | ||
Comment 12•17 years ago
|
||
I a little wary of using the Firefox logo since the most common content area message is "can't connect to server". We have also apparently added a bunch of SLL errors in content area messages. Constantly showing the huge logo directly next to failing feels like bad move for the brand.
Comment 13•17 years ago
|
||
Comment 14•17 years ago
|
||
Comment 15•17 years ago
|
||
The problem with transparency is that (after assigning a native color like -moz-field) you would have to get the computed style and convert the background color from rgb($r,$g,$b) to rgba($r,$g,$b,0.7).
Comment 16•17 years ago
|
||
(In reply to comment #15) > The problem with transparency is that (after assigning a native color like > -moz-field) you would have to get the computed style and convert the background > color from rgb($r,$g,$b) to rgba($r,$g,$b,0.7). OK, this is solvable with theme-only code (i.e. -moz-binding with a data: URL).
Comment 17•17 years ago
|
||
I think I like the more vibrant Firefox logo better. It's nice to have a visual clue that separates feeds from similar browser-generated pages, but IMHO the normal-sized feed icon in the foreground already does that better than a faint background image would.
Reporter | ||
Comment 18•17 years ago
|
||
What about something like the iso series icons by Tom Nulens http://www.istockphoto.com/file_closeup/style_and_design/icons/icon_sets/2761968_media_communication_iso_series.php?id=2761968 I really like how he turns normally flat icons into three dimensional shapes. Background image aside, the corners for the Web feed page should be either rounded or straight, mixing feels odd. Also, I'm personally not a big fan of the yellow.
Comment 19•17 years ago
|
||
Another problem with using the logo in this way is that putting things on top of the logo and using the logo in washed-out colors both seem to violate our own trademark logo-use guidelines. The logo was my first thought, too, but I went with the Gran Paradiso poster instead to avoid these issues. Plus, it seemed a shame to let such a nice image go to waste once we shipped. Doesn't necessarily need to be a background image, but there needs to be some design element and color to these pages. The feed page is more complex and more focused on the content, it doesn't need quite as much work (something like the Gran Paradiso poster might be too distracting).
Comment 20•17 years ago
|
||
Comment 21•17 years ago
|
||
Comment 22•17 years ago
|
||
Reporter | ||
Comment 23•17 years ago
|
||
>netError with fading curve
Beltzner and I have been discussing various metaphors we could use for online and offline applications, and I've been arguing for the use of the day/night metaphor. So for instance the popup notification for allowing a web app to store offline data might contain an icon of a crescent moon (a little bit of day during the night). Obviously you can be online at night, but it's just a metaphor to nature folks :) I should note that beltzner still doesn't like the idea that much.
Anyway, the reason I'm bringing this up is because I really like the netError with a fading curve. It is reminiscent of an eclipse, and the entire back of the planet is dark. Perhaps we could use the grey color scheme you have here for XP, and actually use black with white light for OS X and Vista?
Comment 24•17 years ago
|
||
(In reply to comment #23) > Obviously you can be online at night, but it's just a > metaphor to nature folks :) Windows 95 or something like that used the night metaphor for shutdown, as far as I remember. With that in mind, I think your idea *could* work out, although I'm not convinced that it *will*. > Perhaps we could use the grey color scheme you have here > for XP, and actually use black with white light for OS X and Vista? Can you specify this? I actually used pure black and white, but not at full opacity. I must say, even though it was only a sketch, I'm a little bit in love with the globe in its present form. The blue shine feels refreshing and it seems do well on all current browser-generated pages. The curve wouldn't work for feeds and FTP, I think.
Comment 25•17 years ago
|
||
using the Luna theme this time
Comment 26•17 years ago
|
||
Comment 27•17 years ago
|
||
not necessarily the final appearance but good as a starter, imho.
Attachment #284287 -
Attachment is obsolete: true
Attachment #284616 -
Flags: ui-review?(beltzner)
Reporter | ||
Comment 28•17 years ago
|
||
I think this is looking really good. Out of curiosity, could we see what a monochrome globe looks like, using only colors in a range similar to the background?
Comment 29•17 years ago
|
||
(In reply to comment #28) > I think this is looking really good. Out of curiosity, could we see what a > monochrome globe looks like, using only colors in a range similar to the > background? I could create such an image quite easily for a specific background, but in general the background color depends on the OS theme. Let me know if you'd like to see a mockup anyway.
Updated•17 years ago
|
Summary: Improve the appearance of messages shown in the content area? → Improve the appearance of messages shown in the content area? (netError, feed preview, etc)
Updated•16 years ago
|
Attachment #284616 -
Flags: ui-review?(beltzner) → ui-review-
Comment 30•16 years ago
|
||
Comment on attachment 284616 [details]
netError with globe (content background less transparent)
I think that the graphic just adds visual complexity without actually adding any information.
What we want to do here is actually improve the ability for the user to discern the important information from drill-down detail, and promote the actions. We also want to make it look like a system dialog, so perhaps some degree of OS-specific styling is appropriate (and now easier thanks to things like border-image).
I think the best way to approach this is with judicious use of:
- font size & weight
- spacing
- fore and ground shading
Comment 31•14 years ago
|
||
Dup'ing this off to the newer bug since that one links to updated mockups, and has an updated list of pages impacted.
Status: NEW → RESOLVED
Closed: 14 years ago
Resolution: --- → DUPLICATE
You need to log in
before you can comment on or make changes to this bug.
Description
•