How did Chrome create a different GUI for the browser?

views:

208

answers:

+2 Q:

How did Chrome create a different GUI for the browser?

I am interested in how Chrome was able to write such a good looking GUI? What libraries and methods did they use?

I am particularly amazed that it acts 100% like a regular GUI - you can drag it by the blue strip and the regular buttons [_, o, x] are made differently. Also tab dragging is so seamless. In fact you can drag a tab outside of existing GUI and it will create a new window fluidly.

Does anyone know more details about this?

I am asking because I also want to write great looking GUI for my applications. And this is a good start to understand the process.

Thanks, Boda Cydo.

+5 A:

Chrome is open source. They have also published pretty comprehensive design documentation as well.

You should be able to have a look at exactly what they do!

Mongus Pong 2010-06-28 13:26:27

+7 A:

I would advise against taking this approach. While Chrome does have an attractive GUI, breaking the design guidelines for your target platform is rarely (but sometimes) the path to creating an attractive, usable, intuitive user interface.

If you're looking to understand the process for developing a UI, then I would recommend that you explore the design guidelines for your target platform (Windows, it would appear, in your case).

Adam Robinson 2010-06-28 13:26:31

This answer kind of says "Half a dozen of one, 6 of the other"

bobobobo 2010-06-28 13:31:05

This is a good and interesting answer. I completely agree with sticking the the design guidelines of the platform, but then that raises a question of innovation. We're obviously not stuck with Windows 3.1 UI, but if you open Norton Antivirus, Google Chrome, or any fullscreen application (or compare XP to Vista to Win7/Gnome to KDE), you'll see a completely different UI. So, where do you draw the line for who gets to release innovative UI and who doesn't?

Jim Schubert 2010-06-28 13:38:08

@Jim: I'm not intending to say that nobody should release a UI that is non-standard. I'm saying that if someone is attempting to learn how to design a UI, then breaking the standards *at the outset* is probably a bad idea. That's the sort of thing that creates Geocities pages! All kidding aside, I'm essentially recommending walking before running; take the standards that are available, use them, then break them later once you know what you're doing.

Adam Robinson 2010-06-28 13:51:28

No-one should. In the end almost any UI which looks-and-feels different to the standard UI is an all-round loss. Chrome is not my primary browser mainly because of the ugly window furniture that doesn't play well with the rest of my desktop, and that's despite the Chrome UI not actually being all that bad.

bobince 2010-06-28 13:54:05

(In particular, Chrome demonstrated that OS UIs need to revisit the concept of what a tab and a window mean. But it's still an OS-level issue at heart, not something an application should be worrying about. KDE4 has done some nice work on global tabs.) In comparison to the UIs of the appalling anti-virus crapware, Chrome is tasteful!

bobince 2010-06-28 13:56:14

@Jim Schubert: Obviously, anyone can try to create their own UI; but 90% of the time the rationale is not "let's create something that is *usable* and reasonably nice" (e.g. Chrome's appeal stems from its simplicity of use, not from pretty UI) but "let's create an UI that's *different* from what everyone else has", resulting in angry-fruit-salad UIs that are cumbersome for users (I'm looking at you, antivirus vendors).

Piskvor 2010-06-28 13:56:50

Downvoters care to provide a reason why?

Adam Robinson 2010-06-28 14:07:17

I completely agree with the UI standardization point. I think Chrome's largest target audience is developers, who don't look at a unique UI and go "What do I click?" I just thought the innovation implication of staying with the standard was an interesting point to mention. I upvoted, because like I said I completely agree, but others have probably downvoted because the question is how to change the UI, not whether or not it is the best course of action. Picky downvoters.

Jim Schubert 2010-06-28 15:16:20

Another reason Chrome might have done this is to get the same Vista look (large close button) on XP

bobobobo 2010-06-30 21:23:36

+5 A:

Likely purely Windows API.

There is are functions in Win32 to override almost any aspect of Window behavior / and or look. For example, you can intercept the WM_NC_PAINT message to paint the "non-client area" (title bar and max/min buttons). You can do this on any app, in fact.

bobobobo 2010-06-28 13:28:06

In fact, Chrome uses [WTL](http://www.hanselman.com/blog/TheWeeklySourceCode33MicrosoftOpenSourceInsideGoogleChrome.aspx).

0xA3 2010-06-28 13:43:56

ansaurus

tags:

views:

answers:

How did Chrome create a different GUI for the browser?

related questions