Creating Skins/Bitmaps

Discussion in 'Building With Reaktor' started by Ctazza, Dec 4, 2005.

  1. Ctazza

    Ctazza NI Product Owner

    Im a new user to Reaktor 5. I've made a few new synths but am trying to change to appearance of the gui (pretty knobs and buttons etc.....!). It says you are able to change all the skins for various objects in the manual, but I cant seem to find any relavent files in the instaled folders. Is this right? If so how do I go about creating my own skins? Do I need some specialist software etc?? Any help would be appreciated.

  2. daswesen

    daswesen NI Product Owner

    You can use a standard graphic software to create your bitmaps. When modifying the interface of existing instruments, I screenshoted an empty version of the instrument to get the background skin and other elements. I didn't find a way to extract the original tga from an ensemble though. To create buttons and sliders you can use my hackish gimp scripts:

    Gimp is a very nice graphic tool, you can find it at
  3. sakabeat

    sakabeat NI Product Owner

  4. sakabeat

    sakabeat NI Product Owner

    you can also use the ones that come with R5 lib by loading existing ism within your own ensemble

    let' say you like the carbon2 knobs....(not a good example since it doesnt use alpha channel)
    open up your own ens load carbon2.ism in it and now you can use all the carbon2 panel elements in your own synth.
    just dont forget to delete the carbon2.ism when you're done
  5. kid_sputnik

    kid_sputnik NI Product Owner

    ive noticed this cop-out alot in the factory library - really lame i think since skinability is a big selling point of R5 i thought.
  6. ew

    ew Moderator Moderator

    I think it depends on who's doing the skins and what they use for a graphics program. With mine (PSP9); I can't export alpha channels in a .tga- the only format I can use that allows exporting alpha channels is their own (.pspimage) :(

  7. Lowkus

    Lowkus NI Product Owner

    Skins also don't let you use alpha blending, or do they?
  8. tymes2

    tymes2 NI Product Owner

    They do - I have "imported" my R2.3 style knobs and applied that tga to the new R5 knobs. Instant karma.
  9. tymes2

    tymes2 NI Product Owner

    One somehow gets the feeling they tried to "lock" their knob skins so they can't be used in other ensembles. Of course you can use them provided you go with the same background colors as the ensemble they came from... bummer.
  10. Lowkus

    Lowkus NI Product Owner

    Not just an alpha channel, but also a gradient alpha channel?
  11. crosley

    crosley Forum Member

    A Production Pipeline for Reaktor 5 Skins Re: Creating Skins/Bitmaps

    I'm posting this again (originally posted several weeks ago in response to another question about animating knobs). I hope you find this helpful!

    A Production Pipeline for Reaktor 5 Skins - Re: how do you create animated knobs?


    Hi All,

    There are so many threads about this topic, that I wasn't really sure where to post. I'd like to post more about this when I have more time, but wanted to share with all of you the production steps that I have used successfully for creating custom knob skins for Reaktor 5.

    This might be helpful to those of you with graphics experience but limited experience with Reaktor skinning. Obviously, there are many tools one can use for this task, but the toolset that I use includes:

    * Modelling: I model individual parts (e.g., a knob) in Pixologic ZBrush a high-end organic modeling tool (though any 3D modeling app could be used).

    * Rendering and Animation: I use Poser 6 to import my finished models and animate them (e.g., render 128 different positions for a knob).

    * Post-processing: I use Corel PhotoPaint (part of the Corel Draw suite) to resize individual animation frames. I use GraphicsMagic for automatically taking those individual frames and combining them into the image "stack" or "strip" that Reaktor requires.

    Here are the steps I've used successfully for a knob project for example:

    1. Model the knob in 3D modelling application. I use ZBrush and other apps for this -- again, any 3D modeller could be used.

    2. Animate and render the knob turning through 128 positions. Individual animation frames are saved out as TIFF files with alpha channel. I typically will render the animation at a large size (e.g., 512 x 512 pixels) and then resize those "master" images to create several different sized knobs. I use Poser 6 for these sorts of simple animations because I like the simple animation interface and procedural textures of Poser's render engine, but again any animation package could be used.

    3. Here's where I had to do a LOT of research to find a good, simple solution: Now that you've got 128 512 x 512 images of each knob animation, how do you combine them into a format that Reaktor can use? Here's the process I use:

    * First, I use Corel PhotoPaint to batch process the large images into the sizes I need. Corel makes it easy to record "macros" and save them as scripts and then run these as a batch process. So I'll run a script that (for example) resizes each of the 128 animation frames to smaller size (e.g., 64 x 64, 48 x 48, 32 x 32).

    The 128 resized images are saved into their own directory for easy processing.

    * Second, you have to essentially concatenate those images into a single vertical strip so that Reaktor can deal with them. The best program I have found for this is the open source GraphicsMagick. You can download a Windows compiled version of this program from (go to Download -> windows -> get the latest "Q8 Dll" version - right now this file is GraphicsMagick-1.1.5-Q8-windows-dll.exe). This is a command-line driven program that can easily batch process images. It has a "concatenate" feature exactly like what we need to create Reaktor's required "image stack". In fact, they have an FAQ item which will help get you started. See description of the "montage concatenate" function on this page:

    I run GraphicsMagick and use a command very similar to the one in that FAQ to combine all 128 images for a knob into a vertical stack of images (for me, this is a TIFF format image).

    3. I add an alpha channel to the processed image (the "stack" of knob images that are now all in a single file). To do this, I open the concatenated image file in Corel PhotoPaint. I use the Magic Wand tool to create a mask (just clicking in the whitespace that is all around the outside of the knob images). Invert the mask (so the knobs are masked not the whitespace). Save the mask as an alpha channel. Export the image to Targa (.tga format). Even though Corel PhotoPaint complains that "alpha channels cannot be saved in TGA format" this seems to not be true.

    Now you have an image that can be used in Reaktor 5.

    4. Create a knob panel element in your Reaktor instrument. In the properties dialog use the select skin pulldown to open your finished image file. Click the "has Alpha channel" box and tell Reaktor that there are 128 animations in this file. Enjoy your custom knob.

    Yes, this is a large amount of work!

    The abolute must-haves for this kind of work are a good graphics editing program that can work in batch mode. While I use Corel to resize my images, this could just as easily have been done in GraphicsMagick, so that program potentially solves 2 problems for you. It would be absolute madness to manually resize 128 images and then hand assemble those images into the "strip" format that Reaktor requires.

    I hope some of these tips have been helpful for other Reaktor skinners (or want-to-be Reaktor skinners)!

    Best Regards,
    • Like Like x 1
  12. Outlaw73

    Outlaw73 NI Product Owner

    This is an old thread but very helpful thanks!
  13. sowari

    sowari Moderator Moderator

    i agree, i put it into the UL Creator's section. maybe if other people have more tips they can put them here.

  14. Sicklecell666

    Sicklecell666 NI Product Owner

    I think I might have kicked this out in another thread a while back, but this is a great tool for builing knobs:

    There's a free and not-free version.
  15. CC4

    CC4 NI Product Owner

    Serif 3D Plus is free and allows you to do the hard part for knobs, which is making the rotation sequence:

    Then you can use any standard stitcher to stitch them together, and edit it any paint program.
  16. ëthum

    ëthum NI Product Owner

    question for daswesen

    hi there !

    i use the gimp to, but i'm neeb with it !!

    how i can copi your script into gimp !!
    i've trie but i can't do it !!!

    thanks !
  17. fluxmov

    fluxmov NI Product Owner

    Hi ethum,

    don't panic :)
    If you are using Windows, you can copy the .SCM files
    to the share\gimp\2.0\scripts directory inside GIMP's main directory.
    They will appear in the Xtns->Script-Fu->My Stuff menu.
  18. herw

    herw NI Product Owner

    I don't have any problems with overlaying transparent pictures: f.i. in MM2 i use transparent background pictures for any module which are overlayed by the wires which are overlayed by mouse areas and displays and multipictures.
    I can change the background color to get another gui or can add a background picture for the ensemble (MM1).
    The virtual keyboard uses overlaying transparent multipictures and a transparent mouse area.
  19. lxint

    lxint NI Product Owner

    just for the text, there are 2 simple solutions that should be possible in Gimp as well ( I dont have a version here but I am pretty positive it is)

    * turn panel BG to white
    * take screen shot
    * invert screenshot
    * place inverted screenshot over any BG, using a "screen" or "negative multiply" blending mode

    depends on the SW how this is called exactly, in Adobe PS it's called "screen", what it actually does : it multiplies the inverted ( 1 - normalized_color_value ) values of two pixels on different layers, and inverses the result again :

    like :
    top layer : white = 1,
    "negative multiply" with any color = (1- (1-1)*(1-any_value)) = 1 = white

    top layer : grey = 0.5
    "negative multiply" with another 0.5 grey pixel : (1- (1 -0.5)*(1-0.5)) = 0.75 = lighter grey

    top layer : grey = 0.5, background black = 0
    "negative multiply": (1- (1-0.5)*(1 - 0)) = 0.5 = original grey

    if "screen" is not available as a blending option, you can use regular "multiply" using an *inverted* background, but non-inverted foreground text, und invert the result, to get the same result as with screen mode

    even more easy : the reaktor fonts should also appear in your font list, and are named like "rktr6cd" and so on, so you do not need to take a screenshot ...
  20. lxint

    lxint NI Product Owner

    I use xp, they appear in both PS and the windows fonts folder

    now, I am not sure if I moved them there, but I dont think so,
    or if they date back from R4 - cause there's a strange thing : the R5 about screen credits Craig Kroeger for the fonts, the Reaktor fonts however show a different copyright info ..
    I have other fonts by Kroeger on my machine, but I daubt any of them had been installed by Reaktor

    Attached Files: