Page 1 of 2

Icon Suggestions for the new Qt Interface

Posted: 12 Mar 2007 13:33
by Tombigel
I was asked by our dear friends here at VideoLan to try and design some new icons for the Qt interface.

All images were made in Illustrator CS (no "real" 3D), I even redo the cone in vector. the only icon where I used an image not made by me is the "Video" icon - the Popcorn seeds are taken from the work of Manuel Zander.

BTW - Images here are 32bit PNG, so if you use IE6 they will have a gray blueish ugly background

I'd love to have some feedback and ideas.


So, here is the new collection, presented by our house model, the Cone:

Audio:

ImageImage

Video:
ImageImage

Input/Output:

ImageImage

Shortcuts (Hotkeys):

ImageImage

Playlist (Might not be needed...):

ImageImage

Interface (Qt/Skins):

ImageImage

These 2 are for "Subtitles", though I think that the 1st one will look much better as an icon for this forum:

ImageImageImageImage

Tom B.

Posted: 12 Mar 2007 13:43
by CloudStalker
I like the cone with headphones and the one for input/output. All the others are alright too. :)

How about one for streaming? And for advanced (futuristic cone)?

Posted: 12 Mar 2007 13:47
by Tombigel
Sorry, I forgot to mention it -

The icons that are currently needed for the "Simple" interface are:

> video
> audio
> input/codecs
> shortcuts
> interface
> subtitles

There were a "playlist" and an "advanced" in there, but they decided to move them to somewhere else.

Oh... and I made one for streaming (kind of...) a long time ago for the website design contest.

Image

Posted: 12 Mar 2007 22:06
by dionoea
Awesome Tombigel! You rock ;)

Posted: 13 Mar 2007 02:00
by Jean-Baptiste Kempf
Image

Posted: 13 Mar 2007 12:45
by Tombigel
I photoshoped your screenshot a bit, what do you say about this:

Image

Posted: 13 Mar 2007 13:21
by thresh
take a look at this, please
http://img92.imageshack.us/my.php?image=vlcge8.png

and, Tom, could you please provide svg ones, too?
the "small" ones arent centered properly

and i think multiple tabs in _simple_ preferences isnt so good...

Posted: 13 Mar 2007 13:38
by Tombigel
1. I sent JB svg versions, but, they were not converted good enough from Illustrator format, I'm still struggling with getting good results when converting.

2. The small images are left aligned, intentionally

3. Tabs are a VERY good idea, they keep the data the user has to deal with on the page ordered and minimal.

If you don't believe me, take look at MacOSX and see how the "Preferences" are orginized there.

Posted: 13 Mar 2007 14:04
by Jean-Baptiste Kempf
OK. My point of view. Don't scream in your posts please.

First, the Simple Prefs design must be well thought since this is one of the major reproach about VLC.

1/ About the icons on the left, I think I prefer tom's screenshot. But I think there is a slight color gradient I may not be able to represent. Confirm ?
And yes, this white background is unneeded.

2/ About the show all settings.
It is easier with a radio button, but much nicer with the button, I agree. Thresh, advice on that one?

3/ About the tabs, I am afraid I am with thresh on this one. The Audio tab is the biggest one, and Tabs is not what I call easy, because it add clicks. Please note that tabs look a bit different in Linux and Windows, and same, very unsure I am on color gradients.
We need extra advice on this one! @$im, dionoea, xtophe ?

4/ Audio preferences, what is your Font ?

5/ Why is your preferences less wide than mine ? Is it intentionnal ?

Finally, please pay attention to the fact that the dialog can resize.

Posted: 13 Mar 2007 14:05
by Jean-Baptiste Kempf
And thresh: what was the point of your screenshot ?

Posted: 13 Mar 2007 14:58
by Tombigel
I didn't mean to shout, just emphasize :).

1. if you mean the gradient on the "selected" button, it's just an idea, if you want i can create a png for that.
The gradient on the buttons is from your screenshot.

2,3,5. For the past 6 weeks I'm working on a Mac most of the time (I work for the local Apple retailer) and I fell in love with the GUI of OSX.
From my point of view the way the dialogs are designed in this OS is the "right" way.
So this is what I tried to do in this little screenshot - without copying too much of the look of OSX, just taking 2 basic concepts for the "Basic" interface:

a. The design should be clean, every element that is not functional should be removed and every complex control should be downgraded to a simpler one.

b. Minimum amount of data in every screen and minimum global default size for the preference screens (hence the smaller size and the tabs).

4. I used Verdana, But it's from Photoshop so It might not look the same when it's live text.
BTW as you can see I gave the text a dark gray color instead of black, it makes it look more "embedded" in the overall look.

Posted: 13 Mar 2007 15:13
by CloudStalker
I like the way this is turning out. I think the menu looks nicer without the white background, and how about a black and white cone with some sort of computer chip design or something
for the advanced tab. :idea:

Side question:
Will the Mac OS-X version have a different style from the Windows version (show all settings)?

Posted: 13 Mar 2007 16:09
by Tombigel
I'll be glad to design an iCone (look! I invented a new buzz word!) for Advanced, but as you can see from the screenshots, there is no "Advanced" tab, there is the "Show all" button/radio, so there is no need for this kind of icon.

BTW
I just noticed that there is no "Reset" button, are you removing it, or it will be available only on "All" options ?

Posted: 13 Mar 2007 16:45
by Jean-Baptiste Kempf
Well, I forgot about the reset button, that is it :D

And no, there will be NO advanced tab in easy preferences. So the iCone could go on the switch to advanced button.

Posted: 13 Mar 2007 18:49
by CloudStalker
Can the reset button be used for each individual tab instead of resetting changes made to all preferences (reset changes made to Video, reset changes made to Audio, ect), or is this the wrong place to be asking this question? Sorry if it is.

Posted: 13 Mar 2007 18:58
by Jean-Baptiste Kempf
Well, no sorry, this is not possible.

Posted: 13 Mar 2007 19:37
by yoann
Thanks Tombigel!
I already loved the pictures you designed for the website design contest (too bad they weren't chosen...), and these new icons are really awesome! I especially like the "screenshot" you made (even though everything might not be easy to implement).

Just a remark about the "subtitles" icon: I find the red symbols hard to read on the small version of the icon, and I wondered for a while what this black rectangle was. I don't know if there is a way to enhance this?

You rock!

Posted: 13 Mar 2007 20:09
by Jean-Baptiste Kempf
Yoann ? You are not dead ? :D

Re: Icon Suggestions for the new Qt Interface

Posted: 13 Mar 2007 23:02
by Jean-Baptiste Kempf
These 2 are for "Subtitles", though I think that the 1st one will look much better as an icon for this forum:
Could you provide it in 150px high ?

Posted: 13 Mar 2007 23:03
by CloudStalker
Aahhhh!!! Huge cone taking up my entire explorer!!! I like it, keep it. :D

Posted: 13 Mar 2007 23:04
by Jean-Baptiste Kempf
A bit too big, but I was so fed up with the other one :D

Posted: 13 Mar 2007 23:51
by xtophe
Hello,

I like these icons.

My only comment would be like Yoan that the red of the subtitles icons should be brighter.

on the tab vs. no tab matter:
my view on simplicity is that you don't have to click tree level on a tree or a tree then tabs to find your settings. As long as the page are not extra long and cluttered.
So in the context on the simple pref, i am for no tab. there is only 12 settings in the biggest one (audio).

(if you want to see a page too long look at ffmpeg in advanced prefs ;)

Posted: 14 Mar 2007 00:25
by Tombigel
The subtitles cone is tricky...

If someone didn't understand - the black rect with the symbols is like a teleprompter, or a LED message board...

It's like the 1001 version of it and I'm still having trouble with designing one that looks good in small sizes + express the meaning of "subtitles" without the user to have to wonder "WTF is that?"

any ideas?

BTW jb, sent you the forum icon.

Posted: 14 Mar 2007 00:35
by Jean-Baptiste Kempf
Applied for the icon.
And I would say brighter red could fit. And I don't find it a problem, btw.

Posted: 14 Mar 2007 00:58
by Tombigel
Thanks, I'll try to refine the subs icon tomorrow.