Creating GUIs

This tutorial will show you how to develop a graphical user interface for a plugin to be used in the MOD UI. This tutorial is diveded in 4 parts:

• The GUI elements - In this section you will understand the basic components of a plugin GUI. Everyone involved in the process (from the designer to the developer) should see this.

• Preparing the assets - In this section you will see how to prepare your images, so they can be used to build the GUI HTML. This can be done by the designer of the plugin or by someone with basic knowledge on how to crop and generate images.

• Preparing the Bundle - In this step you will set up the plugin bundle, adding the MOD UI to it. This consists basically of editing a couple of config files and don't require any programming skills.

• Creating the GUI - Finally, in this step, you will build the interface, using the assets and composing them in your HTM and CSS code. For this you will need some basic HTML and CSS knowledge.

In order to test your plugin you will need to run the MOD SDK. Make sure you are able to run it locally and add your bundle to your lv2 working directory so you can test your plugins. Open the Mod SDK in your browser, load your bundle and go to the "Icon" tab to see the plugin interface in action!