Fruit
Hello everyone, let's start to skin,
This topic is divided in two parts : handling and modifying, and start a new skin.
Handling and modifying
First of all, always remember you don't need to be a genius to begin to skin. You don't need any specific tool either, just Paint and Notepad, the Windows tools. Maybe you could find some cool effects in PhotoShop, PaintShop, ACDSee. For xml editing you can use Purple Editor Pro, or AXE Editor. Personally I only use Paint and Notepad cause those offer the simplicity and the rapidity I am looking for.
Choose your favorite skin in the skin download section. Take an easy skin, with less buttons or functions in order to make sure you understand the way it works. I always will consider you chose a 1024x768 skin.
Unzip the skin file
I would recommand to unzip directly in the skin folder, this way the skin will appear in VDJ with it's filename only (easier to rapidely check the results of the modifications). This way you won't need to rezip and move files these operations take many mouse clicks and time.
Two (or more) new files should appear : skin.bmp, and skin.xml.
Open the picture
Open the skin.bmp file with PAINT, the windows tool.
When Paint appears, make sure you can see the status line or click on the view menu then check for the status bar. Let's move your mouse around in the pic, and see in the status bar (right) the coordinates of the point you focus. You can focus very precisely when zooming a part of the pic. Try to draw a selection box : the status line tells you the width and the height of the box.
Okay now you can find the line 768 (depending on the skin resolution) in the pic : below this limit, the skin user won't see anything ; look around you can see there are all the highlighted and animated stuffs, lightening visual parts, moving sliders and so on.
Open the script
What is it?
The xml script will tell to VDJ all the skin's picture informations, such as the position of the different buttons, where the highighted buttons are, where the browser will be, and so on. WOW there are MANY numbers here! These are the coordinates you saw in paint. You will use paint to get the pos and width of the buttons, then report them in the xml file, and again, and again in order to get the skin working.
All the objects in the skin have name, coordinates, and even some special fields that you have to know. This is very important, the most you'll learn about the skin engine, the better the skin is. To help you to learn the different elements, Atomix Production wrote a skin development knowledge base :
The reference sheet. http://www.virtualdj.com/support/developers/skin.html
Learn all the page and you'll become a skillful skinner! It can sound like a joke but it's true, it will be your only help!
Steps
Take one button (let's say play). Go to paint and try to move the play button in another location. Save the file but don't quit paint. Now go to the script and find the line named button action="play". Change the button's ordinates according to the PAINT's status bar infos. Save it all and test the skin in Virtual DJ to verify your work. You'll see that verifying is a hard part of the job (I verify maybe each minute the work, except for very long processes).
Just modifying a skin will let you know how hard the work is, and how long the process can be. It's not that hard, just reporting thousands of numbers into a text file.
Creating an entire new skin
Creating a skin is not that hard, in the practice but in the other hand it requieres specific skills. The hard work won't come from the xml script but from the picture part. It will take a long time to elaborate a great bmp file with all buttons (activated or not), with all the features of VDJ. To be beautiful even a small animation part can take hours! Even days! You will have to 'imagine' all the parts of the skin and 'manage' the space allowed. Be consciousness about those things.
What does a skin need in order to go in VDJ?
- Must have the 'skin' header & footer
- Must have the 'logo' thing
At this point your skin is valuable for VDJ. The following parts are needed to navigate :
- A 'browser' element
- Minimize, maximize, close buttons
- A 'settings' button ( /!\\ NOT NEEDED TO GET STARTED, BUT NEEDED TO CHANGE THE SKIN AGAIN!)
Enjoy!
FRUiT94
This topic is divided in two parts : handling and modifying, and start a new skin.
Handling and modifying
First of all, always remember you don't need to be a genius to begin to skin. You don't need any specific tool either, just Paint and Notepad, the Windows tools. Maybe you could find some cool effects in PhotoShop, PaintShop, ACDSee. For xml editing you can use Purple Editor Pro, or AXE Editor. Personally I only use Paint and Notepad cause those offer the simplicity and the rapidity I am looking for.
Choose your favorite skin in the skin download section. Take an easy skin, with less buttons or functions in order to make sure you understand the way it works. I always will consider you chose a 1024x768 skin.
Unzip the skin file
I would recommand to unzip directly in the skin folder, this way the skin will appear in VDJ with it's filename only (easier to rapidely check the results of the modifications). This way you won't need to rezip and move files these operations take many mouse clicks and time.
Two (or more) new files should appear : skin.bmp, and skin.xml.
Open the picture
Open the skin.bmp file with PAINT, the windows tool.
When Paint appears, make sure you can see the status line or click on the view menu then check for the status bar. Let's move your mouse around in the pic, and see in the status bar (right) the coordinates of the point you focus. You can focus very precisely when zooming a part of the pic. Try to draw a selection box : the status line tells you the width and the height of the box.
Okay now you can find the line 768 (depending on the skin resolution) in the pic : below this limit, the skin user won't see anything ; look around you can see there are all the highlighted and animated stuffs, lightening visual parts, moving sliders and so on.
Open the script
What is it?
The xml script will tell to VDJ all the skin's picture informations, such as the position of the different buttons, where the highighted buttons are, where the browser will be, and so on. WOW there are MANY numbers here! These are the coordinates you saw in paint. You will use paint to get the pos and width of the buttons, then report them in the xml file, and again, and again in order to get the skin working.
All the objects in the skin have name, coordinates, and even some special fields that you have to know. This is very important, the most you'll learn about the skin engine, the better the skin is. To help you to learn the different elements, Atomix Production wrote a skin development knowledge base :
The reference sheet. http://www.virtualdj.com/support/developers/skin.html
Learn all the page and you'll become a skillful skinner! It can sound like a joke but it's true, it will be your only help!
Steps
Take one button (let's say play). Go to paint and try to move the play button in another location. Save the file but don't quit paint. Now go to the script and find the line named button action="play". Change the button's ordinates according to the PAINT's status bar infos. Save it all and test the skin in Virtual DJ to verify your work. You'll see that verifying is a hard part of the job (I verify maybe each minute the work, except for very long processes).
Just modifying a skin will let you know how hard the work is, and how long the process can be. It's not that hard, just reporting thousands of numbers into a text file.
Creating an entire new skin
Creating a skin is not that hard, in the practice but in the other hand it requieres specific skills. The hard work won't come from the xml script but from the picture part. It will take a long time to elaborate a great bmp file with all buttons (activated or not), with all the features of VDJ. To be beautiful even a small animation part can take hours! Even days! You will have to 'imagine' all the parts of the skin and 'manage' the space allowed. Be consciousness about those things.
What does a skin need in order to go in VDJ?
- Must have the 'skin' header & footer
- Must have the 'logo' thing
At this point your skin is valuable for VDJ. The following parts are needed to navigate :
- A 'browser' element
- Minimize, maximize, close buttons
- A 'settings' button ( /!\\ NOT NEEDED TO GET STARTED, BUT NEEDED TO CHANGE THE SKIN AGAIN!)
Enjoy!
FRUiT94
Posted Tue 21 Jun 05 @ 7:30 pm
javoDK
Hey FRUiT94
I know this message it not suppose to be in this forum, but I am looking for someone who can assist me in making my own skin.
I have already begun to make the graphic user interface, so what I am looking for is someone who can edit that so it fits into virtualDJ and can make all the XML coding.
Would you or anyone be interested in helping me out? You can find my email address in my blog.
I might be able to compensate for the time used assistance me.
/javoDK
I know this message it not suppose to be in this forum, but I am looking for someone who can assist me in making my own skin.
I have already begun to make the graphic user interface, so what I am looking for is someone who can edit that so it fits into virtualDJ and can make all the XML coding.
Would you or anyone be interested in helping me out? You can find my email address in my blog.
I might be able to compensate for the time used assistance me.
/javoDK
Posted Tue 21 Jun 05 @ 9:34 pm
JeremK
I'm very interested in this javoDK.
Going to catch your email right now.
------
Fruit this is a very good idea. Thanks for this.
Going to catch your email right now.
------
Fruit this is a very good idea. Thanks for this.
Posted Wed 22 Jun 05 @ 1:46 am
djaditya
Hey, i just edited the Mix station SV skin by DJcel, can i upload it please? i put in a new feature. Will i need special permission or is it enough if i mention that it was originally by him?
please tell me.. im waiting to upload it!
please tell me.. im waiting to upload it!
Posted Wed 22 Jun 05 @ 4:43 pm
JeremK
Go to djcel's blog:
http://www.virtualdj.com/blog/djcel
and contact him by email. his mail is nearly at the end of the blog.
What feature did you add to his skin?
http://www.virtualdj.com/blog/djcel
and contact him by email. his mail is nearly at the end of the blog.
What feature did you add to his skin?
Posted Fri 24 Jun 05 @ 1:12 am
djaditya
I have added a video crossfader and transition switch button to handle the videos right from the main pannel itself...but i just noticed that DJcel has updated the skin...but still, in my version, you can crossfade the videos and use all the other features in the main pannel(like eq fading, etc). If you are interested then i will upload it. thanks!
Posted Fri 24 Jun 05 @ 5:55 am
xeon
@djaditya why not to upload? ;) I'm sure everybody likes to see & try your skin ;)
Dj Nikki
Dj Nikki
Posted Fri 24 Jun 05 @ 2:05 pm
phillydj
Because in order to upload a modified "user created skin" you need the original aurthors permission
Posted Sun 16 Jul 06 @ 11:51 am
fremdj
That's great, that now we can personalize our own skins.
Posted Sun 16 Jul 06 @ 6:19 pm
phillydj
Nice personal Touches on the skins
Posted Sat 22 Jul 06 @ 10:30 pm
djluk4
someone knows how modify the mix station skin from 1024x768 to 1280x800 ?
thankx
thankx
Posted Sun 30 Jul 06 @ 5:51 pm
phillydj
it isnt as easy as changing a let's say 800x600 to 1024x768 because of the ratio of width to height
also if u try to stretch the bitmap the round jog wheels might get disoriented
also if u try to stretch the bitmap the round jog wheels might get disoriented
Posted Mon 31 Jul 06 @ 9:00 am
DJShyine
Hey Fruit (or anyone else who knows), I just want to change some colors herre n thurr and add my name on 4.0's internal mixer interface. How would I do that?
Posted Wed 30 Aug 06 @ 4:18 pm
DJ FORMAT
DJShyine wrote :
Hey Fruit (or anyone else who knows), I just want to change some colors herre n thurr and add my name on 4.0's internal mixer interface. How would I do that?
HI
wood you like me to do it for you ???
http://www.virtualdj.com/forums/53154/Skins/CUSTOM_SKIN_SERVICE.html
DJ FORMAT
Posted Wed 30 Aug 06 @ 5:13 pm
DJShyine
I Checked out ur forum, looks good. Hey why not, sure u can do it 4 me. As far as colors, I've reconsidered that n decided to leave em alone 4 now. But I would like 2 have my name on the skin though jus 4 starters. ;)
Posted Wed 30 Aug 06 @ 7:32 pm
DJ FORMAT
DJShyine wrote :
I Checked out ur forum, looks good. Hey why not, sure u can do it 4 me. As far as colors, I've reconsidered that n decided to leave em alone 4 now. But I would like 2 have my name on the skin though jus 4 starters. ;)
IS THIS THE SKIN ????
Posted Wed 30 Aug 06 @ 11:24 pm
DJ FORMAT
OR
Posted Wed 30 Aug 06 @ 11:48 pm
DJShyine
It's the first one. :)
Posted Thu 31 Aug 06 @ 2:21 pm
DJ FORMAT
Here is a screenshot of our mod of the skin for you.
DJ Format
DJ Mykel
DJ Format
DJ Mykel
Posted Sat 02 Sep 06 @ 6:02 pm
DJShyine
Nice :) I like the placement but I have a name design that I made that I would rather have up there it will also give an idea of what I like. How do I post images up here so I can show u?
Posted Sat 02 Sep 06 @ 6:26 pm
