CONDENSED: A skin for Dual 30 inch Monitors and Netbooks
I've finally completed a project that I've been dreaming of ever since I started skinning. That was to design a skin that is essentially resolution-independent.
In the last several months, I've learned some techniques in Photoshop that have allowed me to design graphics that scale perfectly to any resolution through the use of Smart Objects, Vector Graphics, and Text, and Scalable Effects. I have created a new skin that uses all of these such that it can be resized to any resolution with perfect results.
CONDENSED is my first example of such a skin, and I'm quite pleased with the results.
The impetus for me to design this skin was that I recently have purchased a netbook with a limited resolution (1024x600) and I was not comfortable using most of the other skins out there, since they don't fit well and are too cramped, usually leaving me with little browser space.
To overcome this, the CONDENSED skin incorporates most of the functionality of the stock VirtualDJ skins (and much of the funtionality of my VideoVision series of skins) in a relatively small amount of screen real-estate by making efficient use of space.
Aside from being an efficiently laid-out skin, it's a very versatile skin that can be used for video, or internal mixing simultaneously. I did not include any special timecode functionality, however (I wouldn't think most timecode users would be on netbooks, so I didn't think it necessary).
Aside from being versatile, this skin is extremely extensible and it can be resized to any resolution you can dream of, and it can easily allow for any realistic aspect ratio up to 9:16 (that is, a widescreen monitor on its side, to give you a very long browser view).
The original skin was designed in Photoshop at a width of 1024 pixels, then scaled up to 5120 pixels.
The XML was designed at this extremely high resolution, and then with JeremK's Skin Resizer, it was possible to scale this hi resolution "Master" skin down to all common resolutions. When resizing it with JeremK's tool, the results were nearly flawless, with a few minor exceptions:
-The "mainwidth" in the beatgrid didn't seem to scale down (thus it was always too large, and I had to manually adjust it)
-The browser fonts usually needed tweaking to get them to where I thought they looked right
-I had to adjust the browser height for different resolutions.
I did do a resize for 800 pixel wide screens which works well, although some elements and fonts are very tiny, and there is a minor graphical glitch with cuepoints. This is intended for someone using a 7" EeePC, for example. Anything else is perfect as far as I can tell.
Currently I've divided all the resizes up into three categories:
Mini (800 and widescreen 1024 pixel sizes), Regular, (1024x768 and 1280 width), and HD (1366 pixels and higher)
I'm very close to releasing this skin now, and I'd appreciate assistance from the VirtualDJ community in testing out the skins to ensure that a high standard of quality is met before I formally submit it to the site.
I hope that my work on this will prove useful to many people out there, since this skin can be used with any size of monitor perfectly.
I look forward to hearing your feedback. Please contact me for a copy of the skin, and tell me which packs (sizes) you would like.
![](/image/50845/22571/condensed_mini.png)
I've finally completed a project that I've been dreaming of ever since I started skinning. That was to design a skin that is essentially resolution-independent.
In the last several months, I've learned some techniques in Photoshop that have allowed me to design graphics that scale perfectly to any resolution through the use of Smart Objects, Vector Graphics, and Text, and Scalable Effects. I have created a new skin that uses all of these such that it can be resized to any resolution with perfect results.
CONDENSED is my first example of such a skin, and I'm quite pleased with the results.
The impetus for me to design this skin was that I recently have purchased a netbook with a limited resolution (1024x600) and I was not comfortable using most of the other skins out there, since they don't fit well and are too cramped, usually leaving me with little browser space.
To overcome this, the CONDENSED skin incorporates most of the functionality of the stock VirtualDJ skins (and much of the funtionality of my VideoVision series of skins) in a relatively small amount of screen real-estate by making efficient use of space.
Aside from being an efficiently laid-out skin, it's a very versatile skin that can be used for video, or internal mixing simultaneously. I did not include any special timecode functionality, however (I wouldn't think most timecode users would be on netbooks, so I didn't think it necessary).
Aside from being versatile, this skin is extremely extensible and it can be resized to any resolution you can dream of, and it can easily allow for any realistic aspect ratio up to 9:16 (that is, a widescreen monitor on its side, to give you a very long browser view).
The original skin was designed in Photoshop at a width of 1024 pixels, then scaled up to 5120 pixels.
The XML was designed at this extremely high resolution, and then with JeremK's Skin Resizer, it was possible to scale this hi resolution "Master" skin down to all common resolutions. When resizing it with JeremK's tool, the results were nearly flawless, with a few minor exceptions:
-The "mainwidth" in the beatgrid didn't seem to scale down (thus it was always too large, and I had to manually adjust it)
-The browser fonts usually needed tweaking to get them to where I thought they looked right
-I had to adjust the browser height for different resolutions.
I did do a resize for 800 pixel wide screens which works well, although some elements and fonts are very tiny, and there is a minor graphical glitch with cuepoints. This is intended for someone using a 7" EeePC, for example. Anything else is perfect as far as I can tell.
Currently I've divided all the resizes up into three categories:
Mini (800 and widescreen 1024 pixel sizes), Regular, (1024x768 and 1280 width), and HD (1366 pixels and higher)
I'm very close to releasing this skin now, and I'd appreciate assistance from the VirtualDJ community in testing out the skins to ensure that a high standard of quality is met before I formally submit it to the site.
I hope that my work on this will prove useful to many people out there, since this skin can be used with any size of monitor perfectly.
I look forward to hearing your feedback. Please contact me for a copy of the skin, and tell me which packs (sizes) you would like.
![](/image/50845/22571/condensed_mini.png)
![](/image/42248/22572/condensed_hd.png)
Posted Sun 22 Nov 09 @ 6:08 am
Looks good, do you have 1440x900?
Posted Sun 22 Nov 09 @ 9:31 am
looks awesome.
Nice work!!
Nice work!!
Posted Sun 22 Nov 09 @ 10:37 am
Charlie Wilson wrote :
Looks good, do you have 1440x900?
Yup. I consider that a pretty common resolution, and is part of the "HD" pack. Send me a PM with your email if you would like a copy.
By the way, is there anyone out there with one of those shiny new 27" iMacs, or a 30" monitor? CONDENSED HD has versions for both of those as well. (The MASTER version was double that number of pixels wide).
Posted Sun 22 Nov 09 @ 12:47 pm
Just an update:
Today I've made lots of minor graphical and XML tweaks to this skin, and have resolved most of the very minor glitches.
The mainwidth not being resized was an issue with the skin resizer, which should be a very simple fix, so I'm waiting on that, and then I'll reissue this, and quite possibly do a final release.
The list of sizes that I'd like to release are:
800x480
800x600
1024x576
1024x600
1024x768
1280x768
1280x800
1280x1024
1366x768
1440x900
1600x900
1600x1200
1680x1050
1920x1080
1920x1200
2560x1440
2560x1600
Would anyone like any other specific resolutions added to the release?
One I know I've ignored is 1360, which is a bit of an odd resolution, but some things use it. It's very close to 1366 anyways, so I don't think I'll bother.
Also, I was going to comment that I'm all for supporting as many resolutions as possible, but one annoying problem I have with that is that you end up having to create identical copies of the BMPs for the same width versions with different heights.
It would be great if you could somehow tell virtualDJ to reference a single BMP for different XML files, then it would make the filesize of a package like this much more reasonable. It's either that, or put a "readme" in the skin zip that tells people how to resize it to fit their screen (which I've already included in the XML file at the top).
Even *better* would be if VDJ allowed a skin to specify a "range" of browser heights and skin heights so that the user could just drag the height to whatever they wanted. That way if they needed space at the bottom for their taskbar, for example, it could be possible for VDJ to adjust automatically when going in and out of fullscreen. This must be prohibitively difficult to implement for some reason though...
Today I've made lots of minor graphical and XML tweaks to this skin, and have resolved most of the very minor glitches.
The mainwidth not being resized was an issue with the skin resizer, which should be a very simple fix, so I'm waiting on that, and then I'll reissue this, and quite possibly do a final release.
The list of sizes that I'd like to release are:
800x480
800x600
1024x576
1024x600
1024x768
1280x768
1280x800
1280x1024
1366x768
1440x900
1600x900
1600x1200
1680x1050
1920x1080
1920x1200
2560x1440
2560x1600
Would anyone like any other specific resolutions added to the release?
One I know I've ignored is 1360, which is a bit of an odd resolution, but some things use it. It's very close to 1366 anyways, so I don't think I'll bother.
Also, I was going to comment that I'm all for supporting as many resolutions as possible, but one annoying problem I have with that is that you end up having to create identical copies of the BMPs for the same width versions with different heights.
It would be great if you could somehow tell virtualDJ to reference a single BMP for different XML files, then it would make the filesize of a package like this much more reasonable. It's either that, or put a "readme" in the skin zip that tells people how to resize it to fit their screen (which I've already included in the XML file at the top).
Even *better* would be if VDJ allowed a skin to specify a "range" of browser heights and skin heights so that the user could just drag the height to whatever they wanted. That way if they needed space at the bottom for their taskbar, for example, it could be possible for VDJ to adjust automatically when going in and out of fullscreen. This must be prohibitively difficult to implement for some reason though...
Posted Tue 24 Nov 09 @ 1:21 am
Wow, this looks nice! Just a question, does it have a video preview window? I really like the compact look, I use a controller, but it's still handy to have on screen buttons should I need them- this really does the trick from the looks of things.
Posted Sun 29 Nov 09 @ 4:49 am
Yup. It does indeed have video preview windows. The deck previews are pretty small, but it's enough to tell what video is loaded, I suppose.
Most of my DJing is video DJing, so it was essential for me to put in the basic video controls; Preview windows, video crossfader, effect and transition triggers.
The final version is up in the skins section of the site now. Any width you could likely want is there. It's also easy to customize the height to your liking (i.e. you have a weird 16:9 high-resolution notebook or want space for the windows taskbar.) Instructions are in the XML file at the top.
Most of my DJing is video DJing, so it was essential for me to put in the basic video controls; Preview windows, video crossfader, effect and transition triggers.
The final version is up in the skins section of the site now. Any width you could likely want is there. It's also easy to customize the height to your liking (i.e. you have a weird 16:9 high-resolution notebook or want space for the windows taskbar.) Instructions are in the XML file at the top.
Posted Sun 29 Nov 09 @ 5:04 am
Hi, Supacon,
definitely like the skin. Got it running atm on a 1920x1080 res. Could be 1 of my favs.
1 Question (couldn't find it....) If samples, effects or record is selected, how do I get back to the browserwindow?
Thnx for this!
Martin.
definitely like the skin. Got it running atm on a 1920x1080 res. Could be 1 of my favs.
1 Question (couldn't find it....) If samples, effects or record is selected, how do I get back to the browserwindow?
Thnx for this!
Martin.
Posted Sun 29 Nov 09 @ 1:14 pm
Oh, I thought that would be more obvious. In VDJ6 if you click the selected tab, it returns to the browser.
Hence, I thought it was redundant to include a "Browser" tab, since you can click any of the other tabs twice to return to the browser.
Hence, I thought it was redundant to include a "Browser" tab, since you can click any of the other tabs twice to return to the browser.
Posted Sun 29 Nov 09 @ 1:19 pm
;-)
So far I've been using skins that got "browser"-buttons, so I wasn't aware of the double-click feature. Move this one to the newby-section....
Thanks for the fast response!!
Martin.
So far I've been using skins that got "browser"-buttons, so I wasn't aware of the double-click feature. Move this one to the newby-section....
Thanks for the fast response!!
Martin.
Posted Sun 29 Nov 09 @ 1:24 pm
Great skin, it doesn't work on 5.2 though!
I'm using the 800 x 600 variant on my Vaio U70 to walk about the bar and DJ remotely through RDP and it's great.
Thanks!
I'm using the 800 x 600 variant on my Vaio U70 to walk about the bar and DJ remotely through RDP and it's great.
Thanks!
Posted Thu 03 Dec 09 @ 3:52 pm
Oh, that's an interesting way to DJ! I wondered if people out there would really use an 800x600 skin these days, and I'm happy that people are getting use out of it!
But yeah, I'm not going to implement a version for 5.x... v6 has changed so much (and for the better), and I'd say that 5.x is pretty obsolete now, so...
But yeah, I'm not going to implement a version for 5.x... v6 has changed so much (and for the better), and I'd say that 5.x is pretty obsolete now, so...
Posted Thu 03 Dec 09 @ 4:00 pm
By the way, I'm probably going to release a minor update soon in conjunction with an update to JeremK's Skin Resizer.
He's done some great work on the resizer, and it works amazingly well with my skin (and most others), allowing you to resize the browser and the whole skin to fit any size you'd like - flawlessly.
In fact, he's even implemented a command line interface that I have been using with a batch file to automatically generate ALL versions of the skin for all resolutions after I change something.
It's so cool... When I make an update to my MASTER skin (5120 pixels wide) I just run the batch file and then in a minute I have all common resolutions for the skin generated without editing a single line of code. Absolutely brilliant!
This has allowed me to make the actual skin graphics a slightly smaller filesize, and also it has allowed me more flexibility with the design (i.e. I couldn't really put a border at the bottom of the skin before, but now I can).
He's done some great work on the resizer, and it works amazingly well with my skin (and most others), allowing you to resize the browser and the whole skin to fit any size you'd like - flawlessly.
In fact, he's even implemented a command line interface that I have been using with a batch file to automatically generate ALL versions of the skin for all resolutions after I change something.
It's so cool... When I make an update to my MASTER skin (5120 pixels wide) I just run the batch file and then in a minute I have all common resolutions for the skin generated without editing a single line of code. Absolutely brilliant!
This has allowed me to make the actual skin graphics a slightly smaller filesize, and also it has allowed me more flexibility with the design (i.e. I couldn't really put a border at the bottom of the skin before, but now I can).
Posted Thu 03 Dec 09 @ 4:03 pm
Supacon, your skin looks great!
could you send me the 1920X1080 version?
Thank you in advance!
could you send me the 1920X1080 version?
Thank you in advance!
Posted Fri 18 Dec 09 @ 6:58 am
Hi sammmmm,
Skin are reserved for registered user only. Pro user can download everything while LE is limited.
In order to have more skins, you have to purchase the software.
Hope to see you with us;)
Skin are reserved for registered user only. Pro user can download everything while LE is limited.
In order to have more skins, you have to purchase the software.
Hope to see you with us;)
Posted Fri 18 Dec 09 @ 11:37 am
I am new in VDJ, Pro user on OS10.6. This skin seems great, but there seems to be only a Win version of the installer.
Is there a way to use this on the Mac version also? I noticed that the source code has an image file and .xml code inside for the various resolutions, I assume that it must be pretty easy to use these on OSX, would you mind sharing some of your knowledge on this?
Thanks.
Cheers,
Bernard
Is there a way to use this on the Mac version also? I noticed that the source code has an image file and .xml code inside for the various resolutions, I assume that it must be pretty easy to use these on OSX, would you mind sharing some of your knowledge on this?
Thanks.
Cheers,
Bernard
Posted Sun 27 Dec 09 @ 8:15 am
I use it on OSX all the time... you just need to put the zip file in your VirtualDJ/Skins directory... I'm not sure why VDJ doesn't have a mac installer on their site. PM me and I can get you the latest.
Posted Mon 28 Dec 09 @ 4:20 pm
11.748 Downloads in just 1 month !!! This must be a record !!!
Supacon you made a wonderfull and very practical skin. Good Job mate !!!
Consider these two little things for your next update.
1. Can you make cuename be the click action and add a deletecue action for rightckick?
2. Can you add an EQ pannel somewhere? (just bass, treble and gain (very important))
Keep up the good work.
Supacon you made a wonderfull and very practical skin. Good Job mate !!!
Consider these two little things for your next update.
1. Can you make cuename be the click action and add a deletecue action for rightckick?
2. Can you add an EQ pannel somewhere? (just bass, treble and gain (very important))
Keep up the good work.
Posted Mon 28 Dec 09 @ 5:07 pm
Very very nice Matt
Posted Thu 31 Dec 09 @ 5:13 pm
Wow, I didn't realize that my skin was being downloaded so much! That's pretty cool to see!
Lately I've been out of the DJ and VirtualDJ community because I've basically started a completely new life, but I will definitely consider your suggestions when I do some work on the skin, DJDad.
As a matter of fact, I think I do have a version here that has some nice tweaks, but never has been uploaded to VDJ for everyone else. Originally I was waiting on JeremK to release some new tools that my skin is dependent on, and I believe he has done this, but in the meanwhile I was so busy with a new girlfriend and then moving to a different country and starting a new job!
The delete cue is easy to implement and makes sense, I can do that quite easily. The EQ knobs, however... I'm not sure how I would implement that. Because this skin was intended to be pretty "minimalist" (at least by *my* standards!), I didn't leave a ton of room for features that I didn't use much. Perhaps I could make a pannel that switches out the sideways deck faders and replace those with three knobs? Of course, those who want EQs on a skin might also want the faders, so perhaps it would make more sense to put those where some of the video functionality is.
What do you think?
Lately I've been out of the DJ and VirtualDJ community because I've basically started a completely new life, but I will definitely consider your suggestions when I do some work on the skin, DJDad.
As a matter of fact, I think I do have a version here that has some nice tweaks, but never has been uploaded to VDJ for everyone else. Originally I was waiting on JeremK to release some new tools that my skin is dependent on, and I believe he has done this, but in the meanwhile I was so busy with a new girlfriend and then moving to a different country and starting a new job!
The delete cue is easy to implement and makes sense, I can do that quite easily. The EQ knobs, however... I'm not sure how I would implement that. Because this skin was intended to be pretty "minimalist" (at least by *my* standards!), I didn't leave a ton of room for features that I didn't use much. Perhaps I could make a pannel that switches out the sideways deck faders and replace those with three knobs? Of course, those who want EQs on a skin might also want the faders, so perhaps it would make more sense to put those where some of the video functionality is.
What do you think?
Posted Sat 16 Jan 10 @ 10:29 am