$0.00 0

YOUR CART
Checkout

SUBTOTAL
DISCOUNT
VAT
TOTAL
Checkout
Banner
Creating a unique and responsive custom GUI in Reaktor is an important part of making an...

Creating a unique and responsive custom GUI in Reaktor is an important part of making an immediate impression on your users. In this series, I’ll go over a variety of ways we can improve upon Reaktor’s default knobs, in order to create a better user experience.

CREATING CUSTOM SKINS

The easiest way to make your work stand out is to create your own custom UI elements – the default Reaktor knobs are pretty boring and generic.

[aside title = “Pro Tip”]Use Knobman to create custom GUI elements[/aside]

Unfortunately, Reaktor does not come with a tool to help you design your own controls. However, there is a wonderful free program designed specifically for the creation of custom GUI elements called Knobman, which you can download here.

A tutorial on Knobman is beyond the scope of this article (and this website), but you can find a simple intro here. It’s pretty simple to get the basics.

Once you have a new skin, you can make a knob use that picture in the VIEW tab of the properties:

This brings up a window where you can specify the height, width, and number of animations in the knob:

Once a skin has been loaded into an ensemble, you can also select it directly from the Skin Bitmap menu, saving the step of specifying the height, etc.

PLAN AHEAD!

An important thing to consider about your GUI is that often you want to be planning pretty far ahead. For instance, if you want your knobs to behave in a specific way that requires a little extra programming, you’ll probably want to design a knob macro before getting too deep into the project. This saves you the effort of having to replace each knob manually later on.

Even if you are simply going to design a skin for your knobs, you can save yourself a lot of time this way. Imagine you have a synth with 40 or 50 knobs. If you wait until the end of the building process to skin your knobs, you’ll have to change the bitmap for each knob individually!

In contrast, if you create a placeholder skin early on, you can create a knob using that skin. Then create any other knobs by duplicating a knob with the placeholder skin. At the end of the project, you can refine your skin. Then, by selecting the ‘Picture Properties’ option in the Skin Bitmap menu in properties,

you can change the look of all knobs in your project at once! This is really very helpful when you want to tweak a knob’s skin without reloading the graphic dozens of times.

EXPANDING FUNCTIONALITY

By default, Reaktor’s knobs only respond to left clicks on the mouse, and events are only sent when a knob’s value is changed. This works fine in many instances, but other times it leaves something to be desired.

For example, I like to create custom knobs with no numeric display attached. I find that the displays take up space and often display information that is quite useless to the user. An attack knob for an envelope, for instance, displays little of use to the user, unless that user is versed in translating from the logarithmic scale into milliseconds.

So, instead of displaying the value of each knob directly below the knob graphic, I like to use a single numeric display that only shows the most recently used knob. In a sense, this is simple – you can simply merge together all of the values from knobs in the ensemble, and the most recently sent value will be displayed:

The problem is that, as I mentioned above, knobs only send events when their value changes. Therefore, simply clicking on a knob will not be enough to display it’s value in this setup, the user will actually have to change the value in order to see it. This is clearly not optimal behavior.

A trick I like to use to expand the functionality of the Knob module is to layer a Mouse Area directly over the knob itself. In this picture, I’ve turned down the transparency on the mouse area so you can see what I mean:

Make sure the knob and the Mouse Area are about the same size. For default Reaktor knobs, I use a height and width of 40.

As long as the knob is in the same macro as the Mouse Area, whenever you click on the knob in the panel, the Mouse Area will receive the data instead. So, you must use the Mouse Area to control the knob, which can be very easily achieved using an IC Send module. Connect the IC send to the knob using the CONNECT tab of the properties.

An important part of this structure is that you must set the ‘Incremental Mouse Mode’ to be on in the properties of the Mouse Area.

In the above picture, the Mouse Area controls the knob whenever the left mouse button is active. We can easily extend this structure so that a new mouse button also reads out the knob value, sending it to be displayed regardless of whether the knob value changes or not:

And we can merge the outputs of these macros together to be displayed:

Another advantage of this setup is that we can use the right and center mouse buttons for other purposes, such as setting up modulation routing for that specific knob.

In this section, we see very clearly the reason for planning ahead and deciding upon the functionality you want for your GUI before you get too deep into building – obviously replacing every knob in a large ensemble with one of these macros is a huge pain that can easily be avoided by careful planning.

CONCLUSION

We have just scratched the surface of this topic – creating a good GUI is on of the harder things to do in Reaktor, requiring a great deal of patience and planning, as well as a solid understanding of the Panel modules. There is much more we could cover on this topic, please let me know if you are interested!

RELATED COURSES

Building in Reaktor for Beginners

ADSR Courses

Add to cart
SAVE 40%

Sequencer Modules in Reaktor

ADSR Courses

Add to cart
SAVE 40%

FFT (Fast Fourier Transform) with Reaktor

ADSR Courses

Add to cart
SAVE 40%

Reaktor Core Masterclass

ADSR Courses

Add to cart
Waveform Loaded
Waveform Played
×
PLAYLIST
Clear all
WISHLISTS
Create an account to use wishlists
×
SAVE TUTORIALS
Create an account to save tutorials
×
FOLLOW YOUR FAVORITES
Follow your favourite labels, formats and genre's and ADSR will show what's new in those on your next visit.
×
  • Create product wishlist
  • Save your favorite tutorials
  • Regular discounts and exclusives
  • Never miss a sound! Follow your favorite labels.
Sign up to My ADSR to ensure you're ahead of the pack. Save your favorite content and be notified of new content. You'll never miss a thing!
Create your account now!
CREATE ACCOUNT
Sign up to My ADSR to ensure you're ahead of the pack. Save your favorite content and be notified of new content. You'll never miss a thing!
  • Get days all ADSR courses free
  • Create product wishlist
  • Save your favorite tutorials
  • Regular discounts and exclusives
Create your account now!
SIGN IN
adsrsounds.com login Video streaming login
Remember me
Forgot your password?
DON'T HAVE AN ADSR ACCOUNT?
Create your account
FORGOT PASSWORD

Send info
  1. Enter your email address
  2. Click "Send info"
  3. Check your inbox for an activation link
  4. Visit activation link and enter set new password
Sign in
DON'T HAVE AN ADSR ACCOUNT?
Create your account
IMPORTANT: Is this product compatible with your system? Please check the product system requirements tab before purchasing. To proceed with this purchase you must check the box to confirm you have checked the requirements.


I have read the system requirements and agree to the return policy. I understand that refunds will not be given due to limitation of my software or operating system.

I don't agree
, you have loyalty credit available. To redeem click the button to claim !
Claim
Claim your free sounds

For every $5 you spend on ADSR receive 1 free credit for Sample Manager.

Even better, we have back-dated this so any purchases you made since 2017 have also been credited to your account!

Click the button below to claim your free credit.

Get my free credits
Loyalty credits
1Every purchase you make on ADSR* now earns you 1 loyalty credit for every $5 spent
2Once you make a purchase your credits are added to your account
3Credits can be redeemed in ADSR Sample Manager to download individual loops and samples
4To redeem simply download ADSR Sample Manager and/or log into Sample Manager with your ADSR login details
5Credits will have been automatically added to your account
6Loyalty credits expire 30 days after initial purchase
* Not including video subscriptions