MIDI Controller in Intuiface

It’s been a while since we posted about a Friday afternoon / week-end project.
Maybe useless, maybe gimmicky, but we’ve had some requests about MIDI / DMX control over the years and I just got this Akai controller to make some tests with, so, why not?

The sample below uses 2 Interface Asset

  • 1 to retrieve MIDI inputs through the Web MIDI API
    • This should also enable to send commands through a MIDI output, but I couldn’t test it with this Akai controller (or it didn’t work, trying to turn the Pads lights on)
  • 1 to synthesize audio sounds, using Tone.JS

Important information: All I’m showing below was done using our Intuiface CDK and ChatGPT to write most of the code. This means any Intuiface user could build such Interface Assets, this is not reserved to Intuiface Product Team / Staff members.

Video

Notes

  • I haven’t touched a keyboard/piano since… forever… and these keys are small
  • I should add a metronome somewhere… Sorry Axel…
  • The Q-Link / Encoders (the infinite rotary knobs on the top right of the controller) are only used to move the 2 linear gauges on screen, for test purposes. They don’t have any impact on the audio in this quick demo, but you could use them to control some synth parameters, if you know what you’re doing with oscillators, modulations, envelope filters, etc…
  • The Game part uses a very basic Excel sheet to tell you what note to play. When you play the right note, the Swap collection goes to the next note, until the last one.
    • The octave doesn’t matter here, so if you play an F3 or F4 for an F, you’re good

Use cases

You tell me!

I could see this being used in a museum / children education center, to let them play mini games with a MIDI controller, educate them on chords, scales, chords progression, …

In a showroom / briefing center, you could also use a MIDI pad to trigger some animations on screen / changing content / changing room configuration (lights, shades, …).

How would you use a MIDI Controller with Intuiface?
What devices do you have or would look into?

Technicalities

These 2 Interface Assets are written in TypeScript, thus require our Player Next Gen on Windows (see our latest newsletter here)
90% of the code was written using our Intuiface Coding Assistant GPT.

Once you launch the Experience, it will try to connect to the first MIDI device detected on your system. If you have multiple, you can use the Select Device action to choose another one.

This was successfully tested on

  • Intuiface Player Next Gen on Windows,
  • Edge / Chrome on a Windows laptop,
  • Chrome on my Samsung Android phone, using an OTG USB Adapter.

I also tested on an iPad and as usual, Apple doesn’t support a standard web API I’m trying to use, see details here.

Download & Tests

If you have a MIDI controller and want to test this (ugly) XP in your web browser, click this link: MIDIController-Test

If you want to download the XP and modify it in your composer, click this link: MIDIController-Test.zip (7.2 MB)

If you want access to the TypeScript source code of these IAs, send me a direct message.

5 Likes

This is awesome! I will definitely be experimenting with this in the very near future. Thanks Seb!!

Brad

1 Like