# Demonstration of graphics capabilities of Kontakt 4



## kotori (Nov 13, 2009)

Hello everyone,

I haven't seen much talk yet about what amazing features Kontakt 4 brings to the table in terms of user-interface skin customizability. Especially for graphics designers - if there are any out there reading this, I think this is a good opportunity to try to find interfaces that can be improved and contact the sample developers of those instruments. Here's a little demonstration that I put together in order to show what's possible:







How it was made:
It was entirely done using free, cross-platform, open source tools. I used Inkscape to create the profile of the wheels and to carve out the little hole (by putting two circles on top of each other and hitting Ctrl+- in order to calculate the difference). I then imported the Inkscape svg file into Blender and extruded it, added a box with a hole to cover up the lower part of the cylinder and then rendered an animation with linear interpolation between two key-frames with different wheel rotation. The material of the box was setup to be invisible but still receive shadows. These shadows then form the alpha channel of the resulting sequence of png images. I wrote a little python program to crop each of the generated animation frames and join them all to one big image (about ten lines long - you've got to love Python!). If I hadn't used python I could also have used ImageMagick/montage which is an excellent tool for this kind of thing. Finally I just copied the image into my Common Files\Native Instruments\Kontakt 4\pictures folder and wrote a little test script with a slider using this background. The slider declaration looks like this:
``*declare* ui_slider slider1(0, 100)
``set_control_par_str(get_ui_id(slider1), CONTROL_PAR_PICTURE, "myimage")````_{ the file extension is not included - the file is called "myimage.png" }_

The fact that Kontakt 4 now supports images with alpha-transparency is really cool. You can see above how the wheels can be placed within the same bounding box without interfering and how they cast shadows on each other and the text label. The text label illustrates the use of a custom font that is bigger than the normal one.

It's now also possible to use the space at the left of the performance view, so it is as we got one new column and 4 new rows at our disposal. You can set the pixel offset of any control as can be seen in the movement of the right wheel above. Even if you animate pictures like above the cpu usage is very low. Large graphics could use some RAM though I suppose. I need to examine a bit more how Kontakt handles that part.

I hope this can serve as an inspiration. 8) 

Cheers,
Nils


----------



## polypx (Nov 13, 2009)

That's very cool Nils. 

Any chance you could provide a download of the .nki and .png so we might have a closer look at what's going on?

cheers
Dan


----------



## kotori (Nov 13, 2009)

polypx @ Fri Nov 13 said:


> Any chance you could provide a download of the .nki and .png so we might have a closer look at what's going on?



Certainly!
The .nki file is just an empty file with a script so it is itself not very interesting. To test the wheel place http://nilsliberg.se/ksp/temp/myimage.png (myimage.png) and http://nilsliberg.se/ksp/temp/myimage.txt (myimage.txt) inside C:\Program Files\Common Files\Native Instruments\Kontakt 4\pictures (or the corresponding folder if you are using OSX). Then write an 'on init' callback containing the two script lines in the post above.

In order to move the controls I use the move_control_px function and to change the font of the text label I use set_control_par(get_ui_id(label), CONTROL_PAR_FONT_TYPE, 1)

Cheers,
Nils


----------



## germancomponist (Nov 13, 2009)

Very cool, Nils.


----------



## polypx (Nov 14, 2009)

Thanks Nils. That's very helpful.

cheers,
Dan


----------



## gregjazz (Nov 14, 2009)

dexterflex @ Sat Nov 14 said:


> That is really cool. Will Kontakt 4 Allow us to make custom skins for our libraries? If so how would one do that?



I think you would have to have access to the script if you wanted full control. Otherwise, if the skin images are external (which I'm guessing they are), you can simply edit those.


----------

