The best way to learn how to setup your GUI is to create a simple practice project and add the controls for it. We can use theglorified volume control plugin to demonstrate the GUI design process. The figure below shows the GUI mockup. The volume plugin GUI contains: text labels, an animated knob, an on-off switch, a VU meter, a segment button control and a text edit control (below the knob); there is space left at the right for your company logo graphic.
You will need to compile the volume plugin project and depending on the API, you need to move the plugin product to your DAW’s plugin folder. This will vary by API/platform and is detailed in the "Dev Notes" section of the DK above. Open your DAW and create a test project, then load your volume plugin. The GUI will open to show a blank grey rectangle. This is the GUI background object. In order to launch the GUI designer, hold the <Shift> key and right-click anywhere on the blank grey GUI. A menu will appear that says “Open UI Description Editor.” Select this menu item and the built-in GUI designer will appear. It will look essentially the same across all APIs and platforms. The first thing we will do is size the GUI designer and save our settings.
This is what our demo volume plugin GUI Designer looks like running in Pro Tools in an AAX plugin:
The first thing to do is use the File menu's added items to increase/decrease the width and height of the GUI Designer window. You can then grab the splitter window bars and arrange the panels as you like. Here is the File menu opened up:
The next thing to do is make a quick check of the File->Save Options - by default, your ASPiK GUI's XML file has the option enabled to encode the graphics file data directly in the XML file. Using this option you'll never need to worry about including the graphics (.PNG) files in any of the plugin compiler projects (Visual Studio or XCode).
In the next section, we will set the canvas size and save the XML file for the first time, which will save your designer width/height as well.
