Visual Polish in the Firefox 3.5 Themes


We are now in the process of landing a few refreshed icons for the Firefox 3.5 themes. Across all 4 platforms roughly 25 of the icons are either being tweaked or are entirely new (there were some last minute feature additions, like geolocation). Here are a few highlights of things that either just landed, or are coming soon to your very own nightly build:

Windows: All Secondary Glyphs in the Main Window

Vistaglyphs

Xpglyphs

On Windows (both Vista and XP) we are replacing all of the secondary glyphs in the main window (various small arrows, new tab +, etc) with a consistent etched-in appearance. These etched in glyphs also feature a glowing hit state, which varies color by platform. These glyphs, as well as all of our Windows icons, were created by the Iconfactory.

OS X: Removing Background Etch From the Keyhole

Osxkeyhole

We are also considering doing this on Windows, since it lightens and simplifies the appearance of our UI. Either way, we wanted to get the change landed on OS X, since a lot of people were eager to see the etch go (including myself, as it was my misguided idea in the first place). Visual design of the OS X theme is contributed by Stephen Horlander. Our file system icons on OS X were made by Sofa.

Linux: Last Minute Plugin Icons (used in the event of plugin block-listing)

Linuxplugins

These particular icons were designed by Jakub Steiner (as a very last minute refresh, sorry about that Jakub!). The visual design of the Linux theme is contributed by the Tango team (always friendly, and occasionally featuring overnight delivery :)

As a side note for Linux, can anyone point me in the right direction for contacting the team that works on the default Gnome OS themes? Basically all of our remaining polish points on Linux (related to icons) are things that we would need to improve at the level of the OS themes, like icons not being provided at the right size, and a lack of uniformity with the visual size of some glyph icons. These are things we are eager to get figured out, but right now our teams (and our instances of bugzilla) aren’t really in contact.

Information and Links

Join the fray by commenting, tracking what others have to say, or linking to it from your blog.

Information
May 25th, 2009
30 Responses
Feeds and Links
Comment Feed
From This Author
Del.icio.us
Digg
Technorati
Categories
Uncategorized

Other Posts

Write a Comment

Take a moment to comment and tell us what you think. Some basic HTML is allowed for formatting.

Reader Comments

Comment Number:
1
Written by:
Anders
Posted on:
May 26, 2009 at 12:20 am

PLEASE consider adding the Glasser extension as a default on Vista/7! Consider also making the tab bar background transparent. It looks so much better that way. Please do seriously consider this. The Firefox team goes so far to blend the browser with OSX, I’d like to see a little more effort go into the Vista/7 version. Thank you, and keep up the great work!

Comment Number:
2
Written by:
Lorenzo Orlandi
Posted on:
May 26, 2009 at 12:21 am

hey Alex, while I appreciate the effort for the FF3 OSX theme, I never liked the mac keyhole… time ago I did this based on a Rick Patrick (http://www.vanillasoap.com) mockup: feel free to try it and in case, contact Rick too… I must admit that I’d love to see this as the default theme :)

preview
http://bit.ly/5jSqj

theme jar
http://bit.ly/betterlight

Comment Number:
3
Written by:
Harlefquin99
Posted on:
May 26, 2009 at 3:39 am

Alex, do you have any bug numbers where we can follow these developments?

I already know about the fixed Bug 462644 – Remove etch from the Keyhole for Firelight, but am more interested in following the windows refreshes.

Thanks!

Comment Number:
4
Written by:
Cato
Posted on:
May 26, 2009 at 3:55 am

I like that you are removing the etch on OSX. Next, I’d like to see the home button disappear and a combined stop/refresh button.

Fx3.0 looks too “heavy” for me.
Perhaps you could also make the site button lighter?

Comment Number:
5
Written by:
Lorenzo Orlandi
Posted on:
May 26, 2009 at 4:18 am

while I appreciate the effort put into the OSX theme, I never liked the keyhole design, so time ago I did a modification based on a Rick Patrick’s mockup…
I admit that I’d love to see this used as the default theme :)

here a preview
http://bit.ly/5jSqj

and the theme jar
http://bit.ly/betterlight

Comment Number:
6
Written by:
BobB
Posted on:
May 26, 2009 at 4:43 am

I’d also like to know what the status of aero glass is? Support was added to Gecko 6 months ago in Bug 418454 but then progress seemed to die.

Comment Number:
7
Written by:
Aaron Strontsman
Posted on:
May 26, 2009 at 4:55 am

The Linux-close icon shown in the screenshot attached to the bug is from Ubuntu’s Human theme, which was specially made for Ubuntu by a certain design company you might already know: http://iconfactory.com/design/detail/ubuntu . Since Canonical doesn’t seem to invest in the theme any more, it seems essentially a dead theme. Anyway, in the standard Gnome theme (the blue-dominated Tango theme), the button looks both different and clean.

I like the refreshed Windows glyphs, however don’t they have huge usability problems? Gray etched-in glyphs I’d generally think to be disabled and also the colour choice might not be best for people with sub-standard vision.

Comment Number:
8
Written by:
dao
Posted on:
May 26, 2009 at 5:31 am

+1 for removing the keyhole etch on Windows.

Comment Number:
9
Written by:
Aronnax
Posted on:
May 26, 2009 at 5:51 am

“Alex, do you have any bug numbers where we can follow these developments?”

Theme changes for FF3.5
http://forums.mozillazine.org/viewtopic.php?f=18&t=665138&start=180

Mozilla 1.9.2 / Firefox 3.6 theme changes
http://forums.mozillazine.org/viewtopic.php?f=18&t=975065&start=105

Comment Number:
10
Written by:
Gyrobo
Posted on:
May 26, 2009 at 6:56 am

Since you’re refreshing the themes, why not have the “All Tabs” button only appear on a tab overflow, like in your screenshots?

I thought the purpose of the “All Tabs” button was to provide a list for when some tabs aren’t visible. When there is no overflow, it becomes unnecessary clutter, and duplicates the functionality of the tab bar itself.

Comment Number:
11
Written by:
Ryo
Posted on:
May 26, 2009 at 7:14 am

About “Removing Background Etch From the Keyhole” of Mac OS X.

I like design of original Firelight.

I think that it becomes difficult to understand the existence of the Recent pages button.

——————–
MacBook_Pro 15″ 2.4GHz(Mid 2007) ; Mac OS X 10.5.7

Comment Number:
12
Written by:
mmj
Posted on:
May 26, 2009 at 8:04 am

I strongly agree with post #1, the current vista theme looks a little ugly, looks way better with glasser.

Comment Number:
13
Written by:
xAbhishek
Posted on:
May 26, 2009 at 9:49 am

I wonder whether a new set of buttons for the navigation toolbar is in the cards for Firelight on OS X. I liked the Firefox 2.0 look a lot more somehow.

Comment Number:
14
Written by:
Cato
Posted on:
May 26, 2009 at 10:45 am

That’s a great idea Gyrobo! The “All Tabs” button is not needed when there are just a few tabs.

Comment Number:
15
Written by:
Mr Lizard
Posted on:
May 26, 2009 at 12:52 pm

Nice to see the etch removed from keyhole, as it gave the impression the button was a slider.

Regarding the site info (or ‘ID’) button – would it be a better idea to display an info logo (like an ‘i’) instead of the favicon?

The favicon is already displayed on the tab, so it ends up getting displayed twice.

And it’s not clear that the info button is even a button at all. As it just shows the favicon, it’s not clear that it can be clicked.

And please, please, please… tab close buttons on the left for OS X. This bug is so old it’s ridiculous.

:-)

Comment Number:
16
Written by:
Andy Burns
Posted on:
May 26, 2009 at 1:48 pm

@dao

> +1 for removing the keyhole etch on Windows.

Try the “NoUn Buttons” extension, works in 3.0 and 3.5

Comment Number:
17
Written by:
Patrick Dempsey
Posted on:
May 26, 2009 at 2:27 pm

The new etched icons look great… but I hope they don’t ONLY appear on the tabbrowser, but in the findbar, sidebars and various Tools popup menus. They do have a nice “cross-platform” appearance that should work for both Win and Mac, and not look dated on Vista. Most importantly… thank you for ditching the faux Vista blue for those icons… transparent grey is much much more professional looking.

And yes, ditch the soapdish etch for all OS’s! I’ve read all about the design history, but since the “default” set will hopefully never be locked together, it’s a vestigial design element.

Comment Number:
18
Written by:
liberforce
Posted on:
May 27, 2009 at 4:01 am

To contact the GNOME Art team, use the following mailing list
http://mail.gnome.org/mailman/listinfo/gnome-themes-list

More info:
http://live.gnome.org/GnomeArt

Comment Number:
19
Written by:
Reader93
Posted on:
May 27, 2009 at 7:06 am

Please, don’t give the etch look to Firefox on Windows. I love the current green “add new tab” button on the tab bar. However, I do think the tab scroll arrows are pretty ugly, but I don’t like the etch look any better.

Comment Number:
20
Written by:
leandro
Posted on:
May 27, 2009 at 9:11 pm

+1 to remove the etch in windows

And please, improve the Windows Vista/7 theme. It looks ugly without any glass…
Vista is really old now, we have an awesome extension (Glasser) and i think developers could use that to improve Firefox theme.

Comment Number:
21
Written by:
Tyler
Posted on:
May 30, 2009 at 12:46 pm

Aero glass isbeing considered for implementation in Firefox.next (right now, firefox 3.6). A brand new vista interface (and probably win 7) will roll out with that release.

@Cata, you can remove any of the buttons on the navigation bar 9such as home, refresh, stop, etc) by right clicking on it, clicking customize, then dragging and dropping the elements to renmove or add them.

Comment Number:
22
Written by:
V
Posted on:
May 31, 2009 at 7:15 am

Whoopie doo! Three small etched icons are the start of a much needed UI overhaul.

Here’s some ideas for you:

- Get rid of bulbous, 80’s style Linux control buttons.
- Clean up the mismatched colour scheme.
- Remove the ugly File bar.
- Add animations for dragging/reordering tabs.
- Don’t ask interns to design the icon set.
- Remove the UI colour gradients on the Vista default theme.
- Move the tab bar to the TOP of the page, to minimise visual clutter.

This isn’t 1997. Windows doesn’t use the GTK toolkit. Icons that look like they’re from Amiga Workbench 1.3 are NOT sexy. Please, I understand you have to appeal to the ‘its the functionality that counts’ geek crowd, but please introduce a bit of sexiness!

Comment Number:
23
Written by:
WulfTheSaxon
Posted on:
June 1, 2009 at 2:50 am

I’m with #7 on this – the new buttons look disabled on XP. In particular, I vastly prefer the old green New Tab button…

Comment Number:
24
Written by:
WulfTheSaxon
Posted on:
June 1, 2009 at 3:30 am

For example, compare the disabled stop button that I rotated and resized at http://img21.imageshack.us/img21/6066/sshot1vbb.png – not much different than the new New Tab button.

Comment Number:
25
Written by:
Dave R.
Posted on:
June 9, 2009 at 4:19 am

Please do not use the etched style on buttons that can be pressed. The Windows standard is for grey etched icons to represent disabled buttons. You need to be consistent with the OS and I don’t see how these icons are an improvement over the subtly-coloured existing ones.

Comment Number:
26
Written by:
June
Posted on:
June 9, 2009 at 11:39 pm

it’s GNU/Linux and n-o-t Linux !!!

“…Basically all of our remaining polish points on Linux (related to icons) are things that we would need to improve at the level of the OS themes…”

“…Basically all of our remaining polish points on GNU/Linux (related to icons) are things that we would need to improve at the level of the OS themes…”

I HATE YOUR SHITTY FIREFOX WEB BROWSER. MAKE THIS SHIT FOR WINDOWS SHIT AND MACOSX SHIT ONLY IF YOU CAN’T GIVE TO THE GNU/LINUX USERS A DECENT WEB BROWSER

THIS FUCKING BROWSER WORKS BETTER ON WINDOWS THEN ON OSX

THE XUL GUI ON LINUX IS LACK!!! AND SLOOOOOOOOOOOOW

ARE WE STILL AT “P2″???
https://wiki.mozilla.org/Firefox3/Firefox_Requirements#Platform_Support

FUCK YOU ASSHOOLES

EPIPHANY IS WAY MUCH BETTER
AND ALSO WEBKIT :D DDDD

FUCK MOZILLA

BTW, 3 YEARS AGO, WHEN I WAS A WINDOWS USER… I DONATES MORE THAN 200$ WITH ANOTHER BUDDY

G-O
F-U-C-K
Y-O-U-R-S-E-L-F
T-O-D-A-Y

ONLY TAKING CARE TO YOUR REPUTATION AND A LOOOOOOOTS OF “nepotistic approach”

http://www.chipmark.com:8082/forum/comments.php?DiscussionID=143

FUCK YOU ASSHOLES
AND YOUR FAKE FREE SOFTWARE

WHEN I’LL GO BACK TO DEBIAN (NOW UBUNTU) BE SURE THAT I’LL DELETE YOUR SHITTY “ENEMY” ICECAT.

FUCK NEPOTIST MOZILLA!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Comment Number:
27
Written by:
June
Posted on:
June 9, 2009 at 11:42 pm

I MEANT TO GNU/Linux

“THIS FUCKING BROWSER WORKS BETTER ON WINDOWS THEN ON GNU/Linux”

STUPIDS!!!!!!

Comment Number:
28
Written by:
Antwan
Posted on:
June 17, 2009 at 1:28 am

As Anders :

PLEASE consider adding the Glasser extension as a default on Vista/7! Consider also making the tab bar background transparent. It looks so much better that way.

Please do seriously consider this.

The Firefox team goes so far to blend the browser with OSX, I’d like to see a little more effort go into the Vista/7 version. Thank you, and keep up the great work!

Comment Number:
29
Written by:
Random
Posted on:
June 20, 2009 at 9:06 pm

I’m sorry but adding glass to 3.6 is just not acceptable. Vista/Aero has been out for 3 years now. It should of been done a long time ago. I already know of people leaving FF because of this (to IE8 and Chrome). Unless FF can show that it’s up to date, and user friendly, this is just going to continue. 3.5 must contain Glass, there is no excuses for it.

Even I’m starting to lean away, and I’ve used Mozilla browsers way into the past when it split from Netscape. FF was the minimalist, fast, standards complain and up to date browser. While great work has been done on speed, it’s forgetting up to date and user interface.

Comment Number:
30
Written by:
Lior
Posted on:
June 23, 2009 at 9:03 am

well, even though you’re right about what XUL and all, this is no reason to express the way you did (too colorful… saying at least)

anyhow, I must agree with you with all what you wrote. I’m still using FF and that would keep on going untill I’ll finish to write my script to convert all my FF tags (JSON & HTML) to .rdf which Epiphany supports.

I’m using Epiphany and Midori (very recommended!)

you can try Midori here [ http://twotoasts.de/index.php?/pages/midori_summary.html ] and take a look at the following discussion [ http://bbs.archlinux.org/viewtopic.php?id=61027 ] I think that you might find it interesting!

and I want to emphasize that the FACT that mozilla is NOT letting the users a decent way to import/export the users bookmarks is awaking big quandaries (these just the 2 cents from my side, at least)

the only things that I need in order to feel a real FREEDOM is a flexible way to control my bookmarks (not Html & Json which are very hard to BackUp, relatively) and a control on JavaScript similarly like NoScript (only a Blacklist instead of white!).

* in short:
[1] (a decent) Bookmarking management
[2] Userscrips Manager (GreaseMonkey like) – & Midori indeed has it ;)
[3] JavaScrip control (NoScript like)
[4] AdBlocker (Element control & managing)

that’s all!

and if XUL won’t be better OR on “P2″ (as said by June) – there is no reason for me to get together with Mozilla.

Mozilla’s policies are indeed eccentrics.

Peace. (and be polite)
^_^