I used to get lots of e-mails about people wanting to know how to make skins for winamp. So I wrote a tongue in cheek guide on how to skin a winamp. The e-mails then stopped. Was I doing something right or has Winamp's popularity really started to decline? Well winamp is still going and there are plenty of websites that'll tell you how to skin both modern and classic skins. "Modern" skins are a free form version of the older "classic" number. These notes refer to the classic or old school style of skinning. Winamp is a MP3 player and the look of it, the skin, is controlled by a number of images and a couple of text files. The bitmaps are placed in the usual winamp skins directory and don't have to be zipped up until the thing is finished. Each bitmap contains the relative information for each element for winamp. For example cbuttons.bmp displays winamp's control buttons in their normal and depressed state. If any of these bitmaps are left out, for whatever reason, Winamp will replace them with one from the default skin. This is usually an indication that something has gone wrong or you have left something out. A quick reminder that the current version of winamp uses five windows, they are: The MAIN WINDOW, the business end of the amp. The EQUALISER, when the bass and treble can be tweaked. The PLAY LIST, views the names of your MP3. The MINI BROWSER, winamp's internet browser - Now obsolete. and The AVS. The Audio Visualisation Studio. Watch pictures jump to the beat of your tunes oh yeah hit me Daddy-O. Get templates A good idea is to download Winamp templates from another site. Mine tend to resemble large rectangular blocks of hideous pastel colours and are no good to anyone except me, who understands them. just like Mother said: "DON'T MESS WITH TEMPLATES" These templates act as a guide to give an indication of how large an element needs to be, and if you make this bit A bigger will it conflict with this bit B. These templates are very useful and save an awful lot of time. Get a variety of templates from ezsoft in the how to skin section art of skinning alpha ii unofficial winamp specs Skin the main window first Forget the other windows. Don't even touch them. No. Don't even think about them. We shall concentrate on the main window. AND NOTHING ELSE!

The Main Window

Get your design together. Grab a cuppa and sit down for five minutes and think what the amp will look like, whatever it may be; a team logo, a photo, a picture of dead moose, whatever. Or even if it's how the buttons will look. This is a start and that's a good thing. Stick to this design and do not deviate from it. That is not to say don't be experimental but concise with your design. You'll save time in the long run. Especially if you suddenly come up with a really good idea for an amp half way through skinning, and accidently amalgamate the two by 'accident'. Skin the main window and all that it entails ie balance, controls the audio balance from left to right. This can a pain as it often finds itself over an eye if using a photo skin. c_buttons, the control buttons. Or Stop, pause, play, rev, ffwd to the rest of us. Watch out for the eject on the right as it one pixel off from the others. Great huh? main. The main Winamp window. Most of your time will be wasted here. monoster. Not a monster but the MONO/ STEREO indicator. Get a MONO MP3 to test it out. numbers. display the tracks elapsed time (or time remaining) Easy Peasy. playpaus. I have no idea. When you pause a track an > changes to a ". Good, eh? posbar. Displays the current position of the track from start to finish. This will get in the way of your design, just you see. shufrep. Shuffle and repeat for mixing the play list and cycling it when it finishes. This element is backwards. It's called SHUFREP when in fact it should be called REFSHUP as this gives an indication that the SHUFFLE bits are on the left and REPEAT bits are on the right. But I may be wrong....You do read from top to bottom don't you? text. Changes the text in the play list and the song name window. How may different ways can you respell the alphabet in 4 pixel high letters. You'd be suprised actually. titlebar The top strip of the main window with the minimise, restore and close buttons This is the element that is going to give you grief. If it's not the OH SO ANNOYING share row in the middle that will throw you then its clutter bar and all those minimise/restore/close buttons. Is there no end to the madness? volume. An indication of loudness. Move around the immovable. The Visgraph fire-oscilloscope thing (I don't know it's real name, I don't think many do) the song name and track bit rates and frequncy are not going to move. Not in this version. I suggest you either ignore them or design round them. Don't sit on the fence here. Don't forget VISCOLOR.TXT There are 11 bitmaps there and one text files to the main window.The text file is viscolor.txt and is a list of the colours (RGB) seen in the vis graph scopes. Here is an example RGB // 0 = blue (background color #1) RGB // 1 = black (background color #2) RGB // 2 = top of spec RGB // 3 RGB // 4 RGB // 5 RGB // 6 RGB // 7 RGB // 8 RGB // 9 RGB // 10 = mid of spec RGB // 11 RGB // 12 RGB // 13 RGB // 14 RGB // 15 RGB // 16 RGB // 17 = bottom of spec RGB // 18 = osc 1 (mid) RGB // 19 = osc 2 RGB // 20 = osc 3 RGB // 21 = osc 4 RGB // 22 = osc 5 (outer) RGB // 23 = cap of vis remember the 23rd! RGB indicates the RGB values of the spec so don't use CMYK or HEX here. Wholeness is goodness It seems obvious, but think of them as many units that make up one. Try not to focus on one element alone. Only when put togther the jigsaw looks good, jah? In recent times to keep everything up to date they have introduced a couple more files needed. One of them is nums_ex. It's pretty much exactly like the numbers image only it contains the digits from 0 to 9, a space and a hyphen Hurrah, you should have finished the main window. One down four to go

The Equaliser

The main part of theEQ is fairly straight forward in that a large part of what you see is what you get, unlike the main window which needs to be viewed in Winamp. It only requires two bitmaps. Hurrah! eqmain The top half is pretty much as you'll paint it with the exception of the EQ graph and the ON, AUTO and PRESET buttons. The actual sliders, all 28 of them, are situated in the lower half. Don't forget that the actual EQ slider will mask part of the slider itself. Confused? Don't be. The EQ is meant to be fun! eq_ex The eq gets minimsed, the eq_ex kicks in with wait for it..VOLUME and BALANCE controls. That was a walk in the park was it not? Okay, Play List time

The Play List

Do not be fooled by the singled bitmapmess of the Play List. This window can stretch to different sizes by dragging the bottom right hand corner around. You'll never guess where or why or how. This is why we need templates. pledit It looks straight forward, but isn't and will bite you on the ass if has a chance. The Playlist could be considered to be divided into about 12 sections. Starting from the top left hand corner and going around the actual body of the play list. A bit like a frame and a picture. Apart from that would be easy: One picture, four bits of frame. The play list is different, oh yes. I say 'about' 12 sections because the play list stretches and reuses certain sections. This will be your downfall on a late night with no milk for your coffee type of scenario. Oh and then there are the play list file menus.....Please get them in the correct order or it'll be the equivalent of tying your own shoelaces together. They are (from left to right and from top to bottom as they appear in winamp -which is NOT they appear in the pledit.bmp_ ADD url ADD dir ADD file REMOVE misc REMOVE all CROP REMOVE selected SELECT invert SELECT none (zero) SELECT all MISC sort list MISC File Info MISC options LIST new list LIST save list LIST load They are all fairly self explanatory. Remember its the REMOVE list that causes the problem! pledit.txt The second of the text files for winamp. Just to be different this one's gonna need your colour values in HEX not RGB. Remember that. The text file operates the following Normal=# Normal text colour Current=# Current track colour NormalBG=# Normal background colour SelectedBG=# selected background colour Font=Arial Chosen font MbFG=# MINIBROWSER Foreground colour MbBG=# MINIBROWSER Background colour Incidentally you should only choose a font that will be on the users 'pooter. Worst case scenario chose from either Arial, Courier.

The Mini Browser

It was kind enough of Winamp to devise their own internet browser. Sometimes I even like the MiniBrowser. I like the way you go to Winamp, from your Winamp, to get something Winampy and soon enough it will open up another window using your normal internet cruising package. Nice, eh? Newer versions of winamp don't have the mini browser, but I've included it if you're skinning older versions. The minibroser only needs one bitmap and 'shares' txt info from pledit.txt mb Good news skinners. The minibrowser is almost like the Playlist Editor. Almost, but not quite the same. Pity

The AVS

The AVS is utterly brillant and you can wow friends and enemies with crazy looking pictures from your tunes. Skinning the AVS is a bit like standing infront of one of those 3-d stereo noise pictures, 'seeing' the boat and the seagulls and then for some obscure reason taking more interest in the frame the picture is in. But there you go. avs This bitmap is manly blank. The sides stretch but not unlike the Play List, it actually does a silly putty pulling apart thing with your pixels. Oh and if you can actually get the close button to depress drop us a line will you? It's not over yet....

The Video Window

Video.bmp.The video window is skinned just like the mini browser. Only the controls are different.

The Joys of Cursors

There are 27 cursors needed and only 16 colours to choose from. Good, eh? They are: CLOSE.CUR: (Main Menu X) EQCLOSE.CUR: (EQ Close) EQNORMAL.CUR: (EQ Normal) EQSLID.CUR: (EQ Up and Down Slides) EQTITLE.CUR: (EQ Titlebar) MAINMENU.CUR: (Main Menu Menu Button-topleft) MIN.CUR: (Main Menu Minimize Button) MMENU.CUR: (???) NORMAL.CUR: (Main Menu Normal Arrow) PCLOSE.CUR: (Playlist Close) PNORMAL.CUR: (Playlist Normal) POSBAR.CUR: (Main Menu Song Position) PSIZE.CUR: (Playlist Expansion Mode) PTBAR.CUR: (Playlist Top Bar) PVSCROLL.CUR: (Playlist vertical button) PWINBUT.CUR: (Playlist Windowshade Mode) PWSNORM.CUR: (Playlist Windowshade Normal) PWSSIZE.CUR: (Playlist Windowshade Size Explainsion) SONGNAME.CUR: (Song Name Scroll) TITLEBAR.CUR: (Main Menu Name Bar) VOLBAL.CUR: (Main Menu Volume Balance) VOLBAR.CUR: (Main Menu Volume Switch) WINBUT.CUR: (Main Menu Windowshade Mode) WSCLOSE.CUR: (Windowshade Close) WSMIN.CUR: (WindowShade Main Minimize) WSNORMAL.CUR: (Windowshade Normal) WSPOSBAR.CUR: (Windowshade Song Position) WSWINBUT.CUR: (Windowshade Exit Windowshade Mode) Please don't jump out of the window! They are not all different. Infact, it could be said that some could be duplicated. BUT YOU DID NOT READ THAT HERE normal.cur wsmin.cur, min.cur, winbut.cur, wswinbut.cur, wsnormal.cur, pwsnorm.cur, pwinbut.cur, mainmenu.cur, pnormal.cur, eqnormal.cur close.cur eqclose.cur, wsclose.cur, pclose.cur posbar.cur volbar.cur, volbal.cur, songname.cur, pwssize.cur titlebar.cur eqtitle.cur, ptbar.cur eqslid.cur pvscroll.cur, wsposbar.cur psize.cur You can RENAME animated cursor files (.ani) to .cur to use in winamp. Please make sure they are the standard 16 windows shite colours or bad things will happen. Also note that the cursors in the above picture use PURPLE as the key colour (which doesn't show up) Note there is NO CURSOR for the MINIBROWSER! Silly that isn't it?

General Window

Since winamp 5 there has been the addition of a window for general purposes. It consists of two bitmaps. genex.bmp and gen.bmp. The former is the controls and colours of the window - yes that row of tiny dots actually controls the colour of various areas of the window. The latter controls the text on the window and the corners of the windows.

Finished?

Okay, got that. It's 20 bitmaps 2 text files 1 readme to show up in the skin browser 28 cursors Weeks of work. all zipped up a zip file Got it? Once you have finished your skin you must submit it to winamp.com for your..I mean their approval. Let this be a lesson to you. It's only natural that you've ommited something. 1 Cursors. Naturally you want something new and badly coloured to replace years of evolution which has given us the pointy pointer device. 2 The EQ_EX. What is that? When Winamp is at its most smallest you must give it more info to tell it to be small and in keeping with the rest of the skin 3 Easter Eggs. You know, hidden secrets that only occur in certain situations. I mean does anyone really listen to Winamp without a sound card? You can test one of the Easter Eggs out if you type "nullsoft" - without the quotes slowy whilst using winamp. Press ESC after pressing L or it won't work. 4 To change the colour of text from anything other than white or green in both viscolour.txt and pledit.txt 5 One of the five windows, say, the AVS 6 The winamp symbol and colon for the time display are on the main.bmp and nowhere else! 7 The mono symbol. Like you have any mono mp3s to check it see if it works! 8 All the menus on the bottom of playlist are there. Not all of them are in the right order though. 9 To correct that button which leaps two vast pixels to the right when you press it down. 10 To eat 11 About that halfway down the TITLEBAR.BMP that the minimised version of the inactive title bar SHARE A $"&*@ PIXEL !!! 12 The play controls on the very bottom of the playlist 13 The depressed buttons on the MINI BROWSER 14 To update the colours of the vis graph after you have achieve the perfect shade of lemon. Oh and then to remember to translate them from RGB into HEX 15 To go to work / school / college / home etc. 16 That although you have found a faboulous font for the playlist, not everyone is going to have it....so it deafaults to Arial 17 Those bits on the AVS S-T-R-E-T-C-H not tile 18 If the bright yellow little circles means if the Preamp on the EQ is on or off. 19 To change the text on the bottom of the Mini Browser, will stay bright green and stick out like fighter pilot's thumbs. But is actually controlled by the pledit.txt but none ever told you until now. 20 What actually controls those tiny bits of colour that bounce up and down and cap the vis graph. The 23rd line of viscolour.txt determines this. 21 To do your laundry. 22 The difference between volbal and volbar cursors (balance and volume)