Animations via image sprite sheet let your Kontakt instruments feel more organic and vivid. Sprite sheets can also be used for displaying dynamic info like note names or other information. This article is kept simple for a better understanding. The download contains a more advanced version of an oscilloscope, reacting on note height & velocity, easing out on note release, and displaying the note numbers (see video)

Please accept YouTube cookies to play this video. By accepting you will be accessing content from YouTube, a service provided by an external third party.

YouTube privacy policy

If you accept this notice, your choice will be saved and the page will refresh.

Accept YouTube Content

Content

• create animation

• create spritesheet

• ksp script: the whole code

• on init

• animation function

• on note

• on release

animation sequence

First we create a simple animation with a duration of 2 seconds @ 30 fps and output it as png sequence. So in our case we get 60 images.
Here you can read how to export a png sequence in blender

If your animation software can export a full sprite sheet you can already output the sprites (with the sprites aligned horizontal or vertical) and just skip the next part.

the sprite sheet

We now have to create a sprite sheet out of all the png images. So that Kontakt can use it to run the animation. To do so we have to merge all the 60 png files into a single png file and einher arrange them horizontally or vertically (like shown in the image below). This can either be done with a regular grafic Tool (and lots of work) or via a sprite sheet generator like glueit (see below)

What’s a sprite sheet? Just watch this video

glueIT (Free Tool)

https://github.com/Kavex/GlueIT

1. Simply add your images
2. set columns to “0”
3. press “glueIT”
4. save your sprite
   

Your sprite should look like this:

KSP Script

First of copy your sprite sheet into the Resources/pictures folder and set the text file like this. You can use this sprite sheet for testing if you like.

Has Alpha Channel: yes
Number of Animations: 60
Horizontal Animation: yes
Vertical Resizable: no
Horizontal Resizable: no
Fixed Top: 0
Fixed Bottom: 0
Fixed Left: 0
Fixed Right: 0

The Full KSP Script (for Sublime Text)

The following script does an animation using our sprite sheet above, whenever a note is played. We can also set a frame rate (=> animation speed).

For your better understanding the script has been simplified compared to what you see int the video Also to give a basic starting point so that you can add your own code. With the full script the animation reacts on note heights and velocity. Furthermore the played note names are displayed.

on init
  // set constants
    declare const $UI_HEIGHT := 312
    declare const $ANIMATION_FRAMES := 60 //total frame number of our animation (number of sprites)
    declare const $FRAMERATE := 30 //fps => higher = faster animation

  // global vars
    declare $frame_idx //holds current frame index
    declare $playing //used to prevent animation from being stacked
    declare $wait //used to define animation speed according to given frame rate
    declare $run //runs animation when any note is held or stops it when all notes released

  // calcualate animation speed
    $wait := 1000*1000 / $FRAMERATE // => convert micro seconds to seconds and divide by frame rate

  // UI
    // animation container : label
      declare ui_label $animation(1,1)
      $animation -> text := ""
      $animation -> picture := "animation_noteon"
      $animation -> picture_state := 0
      $animation -> width := 180
      $animation -> height := 180
      $animation -> pos_x := 226
      $animation -> pos_y := 40

    // ui & script tab
      set_script_title("animation")
      set_control_par_str($INST_ICON_ID,$CONTROL_PAR_PICTURE,"yb_ico")
      set_ui_height_px($UI_HEIGHT)
      set_control_par_str($INST_WALLPAPER_ID,$CONTROL_PAR_PICTURE,"bg_init")
      make_perfview
  message("")
end on

on note 	
  //run animation
    $run := 1 //run when note played
    if($playing = 0) //but only when no animation is currently running 
      call animation	
    end if
end on


on release
  if (search(%KEY_DOWN,1) = -1) //checks if any note is still held
    $run := 0 //stop animation
  end if
end on


function animation
  // do endless loop, while allowed
    while($run = 1)
      $playing := 1 // set animation playing state (1 = currently playing)
      $animation -> picture_state := $frame_idx //increasing picture state and roll the animation
      
      inc($frame_idx)
      wait($wait) //simulates the framerate (30 fps) otherwise it's 1.000.000 fps (or one frame per micro second)
      
      // loop - restarts animation again
        if($frame_idx >= $ANIMATION_FRAMES)
          $frame_idx := 0
        end if
    end while

  //reset animation status when stopped so that it can be started again
    if ($run = 0)
      $playing := 0 
    end if
end function

On init – Callback

we skip the explanation for declaring all the basic variables & stuff (just read the nearby comments or read the other articles).

  // calcualte animation speed 
        $wait := 1000*1000 / $FRAMERATE // => convert micro seconds to seconds and divide by frame rate

Container (ui label) for the sprite sheet

// animation container : label
    declare ui_label $animation(1,1)
    $animation -> text := ""
    $animation -> picture := "animation_noteon"
    $animation -> picture_state := 0
    $animation -> width := 180
    $animation -> height := 180
    $animation -> pos_x := 226
    $animation -> pos_y := 40

animation function

function animation
  // do endless loop, as long as allowed
    while($run = 1)
      $playing := 1 // set animation playing state (1 = currently playing)
      $animation -> picture_state := $frame_idx //increasing picture state and roll the animation
      
      inc($frame_idx) //increases the frame index for the next loop pass
      wait($wait) //simulates the frame rate (30 fps) otherwise it's 1.000.000 fps (one frame per micro second)
      
      // loop - restarts animation again
        if($frame_idx >= $ANIMATION_FRAMES)
          $frame_idx := 0
        end if
    end while

  //reset animation status when stopped so that it can be started again
    if ($run = 0)
      $playing := 0 
    end if
end function

on note – callback

on note 	
  //run animation
    $run := 1 //run when note played
    if($playing = 0) //but only when no animation is currently running 
      call animation	
    end if
end on

on release – callback

on release
  if (search(%KEY_DOWN,1) = -1) //checks if any note is still held
    $run := 0 //stop animation
  end if
end on