Knobs controlling Lottie animations and parameters with different values?

[andersnaessss]

Hello.

I'm new to HISE, and loving it so far. Learning a lot. I built the GUI to my sampler instrument using Lottie animations on panels and hidden control knobs. The GUI is working properly and is functional. Now that I have moved on to the audio side of the instrument, I noticed that controlling the parameters broke the Lotties, I guess since the values were different. The Lotties are all 100 frames and expect 0.0 - 100.0 with step size 1, but many audio parameters seem to want other values and step sizes (ex. 0.00-1.00 or decibels etc.). How can I keep the Lotties functional while also being able to control the audio parameters of different values and step sizes? How do people use Lotties with connected knobs to control parameters?

(I don't have much programming experience, so I have most likely missed some vital aspects of controlling parameters with accompanying Lotties. My script so far (for one knob-instance): one hidden knob ("C5_HID_Knb") controls two Lotties ("lottieKnurlSmall" and "lottieNumbers") and this is working properly when the hidden knob have the same value (min 0.0 max 100.0) and step size(100))

// KNOB @ C5 (Volume knob + counter)
const var C5_Knb = Content.getComponent("C5_Knb");
C5_Knb.setAnimation(lottieKnurlSmall);

const var C5_Num = Content.getComponent("C5_Num");
C5_Num.setAnimation(lottieNumbers);

inline function onC5_HID_KnbControl(component, value)
{
	C5_Knb.setAnimationFrame(value);
	C5_Num.setAnimationFrame(value);
};

Content.getComponent("C5_HID_Knb").setControlCallback(onC5_HID_KnbControl);

[d.healey]

@andersnaessss you can use processor/parameter id or control callbacks. You can't use both.

Your choice is either to use a broadcaster or use setAttribute to control modules from your control callbacks

[Lindon]

@andersnaessss also take a look at

https://docs.hise.dev/scripting/scripting-api/scriptslider/index.html#setvaluenormalized

and

https://docs.hise.dev/scripting/scripting-api/scriptslider/index.html#getvaluenormalized

so using these you can transfer the current required value (say form 20-20000 for a freq slider) to a 0-.1 value - multiply this by 100 to get your lottie required range...

[andersnaessss]

@d-healey Ah, so I'll skip the parameter ID then, and only focus on scripting for this. Thank you!

@Lindon Thank you for directing me towards the normalized scripts. As I am such a novice in scripting and programming, I took some help from an LLM. After a winding conversation with some erroneous compiling I arrived at a solution that seems to work! (I also switched to the scriptnode "core.gain" instead of SimpleGain, which seems to give me some better control over the gain curve). I saw David's script-critique video where he was not impressed by the LLM-scripts, so this is probably just as bad, but this is what I have so far:

const var C5_Knb = Content.getComponent("C5_Knb");
C5_Knb.setAnimation(lottieKnurlSmall);

const var C5_Num = Content.getComponent("C5_Num");
C5_Num.setAnimation(lottieNumbers);

const var C5_HID_Knb = Content.getComponent("C5_HID_Knb");

const var GainFX = Synth.getEffect("GainFX");
const var GAIN_MIN = -100.0;
const var GAIN_MAX = 0.0;

inline function onC5_HID_KnbControl(component, value)
{
    C5_Knb.setAnimationFrame(value);
    C5_Num.setAnimationFrame(value);

    local normalizedValue = value / 100.0;

    local gainValue = GAIN_MIN + (GAIN_MAX - GAIN_MIN) * normalizedValue;

    GainFX.setAttribute(GainFX.Gain, gainValue);
}

C5_HID_Knb.setControlCallback(onC5_HID_KnbControl);

[d.healey]

@andersnaessss It's not bad, as long as you understand the code.

You don't need to calculate the normalised value, there is a built in function to get it.

[clevername27]

@andersnaessss I'd love to see your interface.

[andersnaessss]

@clevername27
I couldn't put up a video here in the comments, so I made an unlisted youtube short here: https://www.youtube.com/shorts/ytpUW05iNTU

I guess I could have learned to make most of these elements in LAF, as they are mostly simple rotational objects, but I feel more comfortable making lotties. Will tinker more with LAF later. At least the keyboard is LAF haha.

Still a prototype, still testing out the design. Aiming for a playful, friendly and naive sounding instrument, and wanted those feelings reflected in the interface. Appreciate any suggestions for further development, or any inspiring ideas that you might have!

[clevername27]

@andersnaessss Great video - very creative UI!

[Lindon]

@andersnaessss yep very cool looking UI

[ulrik]

@andersnaessss Great UI, I love it!