"Valencia" skin worklog [status:playlist yay!]

About usage, announcement and development of skins for VLC
gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

"Valencia" skin worklog [status:playlist yay!]

Postby gimmix » 11 Jun 2007 18:13

Hi guys

As I want to become a UI-Designer one day (no not web but UI in general and not just the graphics the whole usability stuff too) I thought to myself, that doing a vlc skin would be the perfect practise ;)

So here we go mockup:
clicky

up to now I have done the mockup for the main window. some playlist goodness will follow till the end of this week.

my goal is to deliver a fully working skin till the middle of july ;)

c&c are very welcome

UPDATE: 04.07.2007
- finding a name - done -> Valencia (thanks CloudStalker)
- finish mockuping - done
- skinning - in progress

current skinning status:
04.07.2007: basic window is done, play/pause open buttons are already working, timeslider is working, resizegrip in the right corner is working

06.07.2007: volumeslider working, mute button, window actions, skip ffw etc working, EQ/PL button integrated but not working

11.07.2007:
I started adding the dropdown functionality and three problems struck ruthlessly :(
Problem no.1: The actual Video is always on top, which is somehow logical as video is a overlay by the graphicscard. So the dropdowns appear always behind the video and not as intended over it.

29.09.2007:
found some time and motivation and started implementing the playlist

Problem no.2: In order to achieve Dropdowns I have to change the Layout which screws up the video and VLC partly crashes -> window disappears, sound keeps playing...

Problem no.3: i can't control which layout is shown when you load the skin so sometimes one of the dropdowns is already open :/

I hope you have any suggestions how i could solve these problems. The only thing I could come up with is leaving the dropdowns away or start from scratch :(

nighty download is available for all the daredevils out there ;)
download here
Last edited by gimmix on 29 Sep 2007 21:31, edited 7 times in total.

Jean-Baptiste Kempf
Site Administrator
Site Administrator
Posts: 37523
Joined: 22 Jul 2005 15:29
VLC version: 4.0.0-git
Operating System: Linux, Windows, Mac
Location: Cone, France
Contact:

Postby Jean-Baptiste Kempf » 11 Jun 2007 18:41

Cool. If this one is as usable as it seems to be, I love it. I just hope the playlist will be great.

Btw, no menus ?
Jean-Baptiste Kempf
http://www.jbkempf.com/ - http://www.jbkempf.com/blog/category/Videolan
VLC media player developer, VideoLAN President and Sites administrator
If you want an answer to your question, just be specific and precise. Don't use Private Messages.

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Postby gimmix » 11 Jun 2007 19:03

hi

thx for the positive response ;)

I am currently analyzing all the other skins that where alredy done and working through the skinning guide in order to get a feeling what the skin2 engine is capable of and what can be realized. So until now i have just done all the basic stuff that will surely find its way into the final skin ;)

menus for example are a point I am not that shure about how they can really implemented so I will check some skins and how they do it 8)

I am also thinking about integrating all the stuff like play,pause,etc into the playlist window. So if you want to use vlc as a music player you won't have to open a dozens of windows ;)

so stay tuned :D

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Postby gimmix » 13 Jun 2007 18:54

hi

a little update:
Playlist!
I have thought up two possible realisations:
a, playlist attached to main window
b, playlist independent window

I personally like b best. Maybe both will make into the final skin so you can choose which kind of playlist you prefer ;)

http://bubblebird.at/cg/vlc_skin_2.png

all the fonts except the ones in the buttons will propably change ;)

Jean-Baptiste Kempf
Site Administrator
Site Administrator
Posts: 37523
Joined: 22 Jul 2005 15:29
VLC version: 4.0.0-git
Operating System: Linux, Windows, Mac
Location: Cone, France
Contact:

Postby Jean-Baptiste Kempf » 13 Jun 2007 19:30

I think I like it separated.
Since you are interested in the GUIs, do you know that we are updating the main GUI ?
Jean-Baptiste Kempf
http://www.jbkempf.com/ - http://www.jbkempf.com/blog/category/Videolan
VLC media player developer, VideoLAN President and Sites administrator
If you want an answer to your question, just be specific and precise. Don't use Private Messages.

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Postby gimmix » 13 Jun 2007 19:59

yeah i already read in some threads ;)
If you want you can use some elements from my mockup ;)

joethezombie
Blank Cone
Blank Cone
Posts: 78
Joined: 15 Jan 2007 08:26

Postby joethezombie » 14 Jun 2007 01:00

Unfortunately for a playlist attached to the main player...
If you want to switch layouts to show the playlist or the current playing media, VLC has a major bug that stops the video playback, breaks the video window out from the skin, and does other strange stuff.

It seems this bug is not going to get fixed, so a separate playlist may be your only reliable option.

:(

CloudStalker
Big Cone-huna
Big Cone-huna
Posts: 2581
Joined: 14 Jan 2007 19:00
VLC version: OVER 9000!!!
Operating System: It's...blue screen
Location: Heaven? No no. What's that other place that starts with an "H"? Oh yes: Home. ^_^

Postby CloudStalker » 14 Jun 2007 01:27

Have you tried a recent nightly build? there's a small preview video window that appears under the playlist (embedded) and you can still browse through the playlist, unless we're not talking about the same thing. 8)

joethezombie
Blank Cone
Blank Cone
Posts: 78
Joined: 15 Jan 2007 08:26

Postby joethezombie » 14 Jun 2007 01:32

Yes, the default nightlies interface is awesome. But when you switch to skins mode and use a custom skin, that old annoying bug is still there.

The good news is, I like the new interface so much, I don't know if I'll be using skins mode in the future. :wink:

CloudStalker
Big Cone-huna
Big Cone-huna
Posts: 2581
Joined: 14 Jan 2007 19:00
VLC version: OVER 9000!!!
Operating System: It's...blue screen
Location: Heaven? No no. What's that other place that starts with an "H"? Oh yes: Home. ^_^

Postby CloudStalker » 14 Jun 2007 03:08

Yes, the default nightlies interface is awesome. But when you switch to skins mode and use a custom skin, that old annoying bug is still there.

The good news is, I like the new interface so much, I don't know if I'll be using skins mode in the future. :wink:
Hmm I hear ya, but I thought that I read something, somewhere on this forum that said that maybe, possibly there might be some improvement between the QT4 interface and the skins2 interface. Grrrrr. It's somewhere in this forum but I cant find it. :x

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Postby gimmix » 14 Jun 2007 23:21

hi i digged a little deeper into the skinning api and missed something really important that would make the skinning way easier. (Maybe it is possible and I just didn't see it xD but anyway).

In one downloadable skin there are customized dropdown menus. But the creator had to make a Layout for each of those dropdowns. So the xml is really pumped up with loads of unnecessary repeating lines of code.
If you could show/hide groups like divs in html you woudln't have to do that because you could just view/hide the part of the layout you currently need. That would make the process of creating a skin much easier and I bet it would even decrease the time needed to load and render a skin.

just some thoughts. Mockup update will follow tomorrow ;D

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Postby gimmix » 16 Jun 2007 21:30

update:

http://bubblebird.at/cg/vlc_skin_3.png

sorry had a lot to do the past few days :/

I going to take a centeraligned approach for the dropdowns. I hope ya like it

Asim
Cone that earned his stripes
Cone that earned his stripes
Posts: 151
Joined: 30 Mar 2005 05:58
Contact:

Postby Asim » 21 Jun 2007 13:53

i like your design... nice, clean and simple

keep up the good work

- Asim

3breadt
Big Cone-huna
Big Cone-huna
Posts: 827
Joined: 19 Mar 2006 11:37
Operating System: Win7 Pro / OS X 10.7
Location: Paderborn, Germany
Contact:

Re: skin worklog [status:mockuping and finding a name]

Postby 3breadt » 27 Jun 2007 12:19

Looks very neat. I like it very much :D
-- 3breadt (aka altglass)

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Re: skin worklog [status:mockuping and finding a name]

Postby gimmix » 28 Jun 2007 16:51

hi

justed wanted to let you guys know, that I ain't dead yet ;D

I'll start with the real skinning next week. Maybe i'll post a little mockup update for the button states this weekend.

still thinking of a good name for the skin xD

already found some possible names:
  • avalon
  • sunus
  • vienna
  • polar
  • unichorn
  • minastirith
  • blanc
  • sober
  • brittle
  • forgodssakewhydoesaskinneedaname

Jean-Baptiste Kempf
Site Administrator
Site Administrator
Posts: 37523
Joined: 22 Jul 2005 15:29
VLC version: 4.0.0-git
Operating System: Linux, Windows, Mac
Location: Cone, France
Contact:

Re: skin worklog [status:mockuping and finding a name]

Postby Jean-Baptiste Kempf » 29 Jun 2007 15:02

I like
avalon,
unichorn,
vlcisagoodmediaplayeruseitordie,

arhelmaninquë or arhelmalossë
Jean-Baptiste Kempf
http://www.jbkempf.com/ - http://www.jbkempf.com/blog/category/Videolan
VLC media player developer, VideoLAN President and Sites administrator
If you want an answer to your question, just be specific and precise. Don't use Private Messages.

CloudStalker
Big Cone-huna
Big Cone-huna
Posts: 2581
Joined: 14 Jan 2007 19:00
VLC version: OVER 9000!!!
Operating System: It's...blue screen
Location: Heaven? No no. What's that other place that starts with an "H"? Oh yes: Home. ^_^

Re: skin worklog [status:mockuping and finding a name]

Postby CloudStalker » 29 Jun 2007 18:27

How about a name with the letters V L C in it, like: VaLenCia (Valencia, Spain). Well my work here is done. :D

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Re: skin worklog [status:mockuping and finding a name]

Postby gimmix » 30 Jun 2007 21:00

hi

i really like your valencia idea cloudStalker. i'll think about it ;D

http://bubblebird.at/cg/vlc_skin_buttonstates.png

here are some rough drafts of how the buttons states could look like always from left to right normal - over - down

I also started to plan a black version of the skin that will basically use the same skin file just with other images. So when this skin is pretty much finished porting it too black shouldn't be much of a hassle

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Re: skin worklog [status:mockuping and finding a name]

Postby gimmix » 04 Jul 2007 00:09

hi

today I started with the actual skinning an HERE is the proof ;D

not much yet but I am getting into it.
I'll stick with the name Valencia(thanks for that again cloudStalker).

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Re: "Valencia" skin worklog [status:actual skinning]

Postby gimmix » 04 Jul 2007 23:27

hi

from now on you can download the latest version from HERE

for the current skinning status please go to my first post

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Re: "Valencia" skin worklog [status:complication :(]

Postby gimmix » 11 Jul 2007 21:03

11.07.2007:
I started adding the dropdown functionality and three problems struck ruthlessly :(
Problem no.1: The actual Video is always on top, which is somehow logical as video is a overlay by the graphicscard. So the dropdowns appear always behind the video and not as intended over it.

Problem no.2: In order to achieve Dropdowns I have to change the Layout which screws up the video and VLC partly crashes -> window disappears, sound keeps playing...

Problem no.3: i can't control which layout is shown when you load the skin so sometimes one of the dropdowns is already open :/

I hope you have any suggestions how i could solve these problems. The only thing I could come up with is leaving the dropdowns away or start from scratch :(

joethezombie
Blank Cone
Blank Cone
Posts: 78
Joined: 15 Jan 2007 08:26

Re: "Valencia" skin worklog [status:complication :(]

Postby joethezombie » 11 Jul 2007 22:28

1. It sure would be nice if we had z-order capability with alpha transparency. We've talked about this in the past, wanting on-screen controls and other niceties.

2. Welcome to the headache... I don't even understand why different layouts are included in the skin DTD, because this show stopping bug completely destroys any use of it whatsoever. Unfortunately, it has been stated this bug will not be fixed.

3. We've talked about user defined variables as well. ipkiss even thought it was a good idea, but as you may have read, has no time to work on new features.

Best of luck...

ipkiss
Big Cone-huna
Big Cone-huna
Posts: 695
Joined: 23 Nov 2003 01:49

Re: "Valencia" skin worklog [status:complication :(]

Postby ipkiss » 12 Jul 2007 08:45

1) There is an implicit z-order: controls are stacked in the order of their definition in the XML (for a given Layout). So make sure that your images are defined after the Video control. It may still not work for the Video control though, as this one is treated very differently than other controls.

2) It would be nice to give it another try after the Vout rework. As this bug really annoys many people (including me :)), I hope it will be dealt with one day (the question is when...)

3) What about adding an action to change the layout just before vlc.quit(), when you are in one of the menu layouts?

BTW, instead of changing the complete layout when opening a menu, did you consider using a separate window (which would have to be moved all the time with the main one, so anchored) to display only the menu? It looks like a solution to the code duplication in the XML, and a work-around to the Video control bug. This may require the notion of z-order for windows, though.

gimmix
Blank Cone
Blank Cone
Posts: 19
Joined: 23 Dec 2005 20:22

Re: "Valencia" skin worklog [status:complication :(]

Postby gimmix » 12 Jul 2007 13:23

mh i like the window idea! i'll try it this evening after work ;)
i already tried putting the video under the images by putting the video tag over them but didnt work :/ just like ipkiss said the video is handled differently.
regarding the z-order problem with the windows some kind of onFocus or onKillFocus attribute for the window would be nice :/ so you can fire an action when the focus lost or gained

EDIT:
Okay that won't work either because the new window doesn't "know" where the main window is positioned. :/

ipkiss
Big Cone-huna
Big Cone-huna
Posts: 695
Joined: 23 Nov 2003 01:49

Re: "Valencia" skin worklog [status:complication :(]

Postby ipkiss » 12 Jul 2007 20:10

i already tried putting the video under the images by putting the video tag over them but didnt work :/ just like ipkiss said the video is handled differently.
the video tag should be _above_ the images if you want the images on top of the video.
regarding the z-order problem with the windows some kind of onFocus or onKillFocus attribute for the window would be nice :/ so you can fire an action when the focus lost or gained
This was not my point. I was simply saying that the z-order might be a problem because when displaying the "new" window (click on a menu), it could appear below the main window (but I'm not sure, just test it).
Okay that won't work either because the new window doesn't "know" where the main window is positioned. :/
If the new window is anchored to the main one, it will follow it, even if the new window is not displayed. So the positioning shouldn't be a problem.


Return to “Skins”

Who is online

Users browsing this forum: No registered users and 7 guests