# Making a VCV Rack Module, Part I I'm learning how to make custom modules for the free software modular synth, VCV Rack. I'll be documenting my process in a series of articles, starting with this one. If you are looking to create your own custom modules, this article should serve as a useful jumping-off point. The repository I will be developing can be found on [GitHub](https://github.com/rjungemann/PhasorSpace-Modules). * [[#Designing the Modules]] * [[#Prototyping the Modules]] * [[#Developing the Modules]] * [[#Conclusion]] * [[#Appendix]] ## Designing the Modules I had an idea for a suite of about a dozen VCV Rack modules. I picked a few that I knew would not be too difficult to implement, and I sketched them out. ![[Pasted image 20240117205440.png|250]] A sketch first four modules to develop. A technique I will try in the future is to take screenshots of my existing modules and create a UI library that I can use to wireframe my UI before I get to the development step. I ran into situations where elements would not fit in the available space, and I had to make significant changes. ## Prototyping the Modules Once I had sketched the modules, I followed the [Plugin Development Tutorial](https://vcvrack.com/manual/PluginDevelopmentTutorial) to set up my environment and my project. The official tutorial does not link to the Rack SDK, which can be found [here](https://vcvrack.com/manual/Building#Building-Rack-plugins). I then used Inkscape to come up with a mockup of the faceplate (the UI) for the module. I started with an [SVG file](https://github.com/VCVRack/Fundamental/blob/v2/res/VCO.svg) from the Fundamental repo, and replaced all of the elements with my own. I then prototyped my DSP code. My approach varies, but generally speaking, I'll use a combination of Desmos and Cycling '74 Max. ![[Pasted image 20240118165003.png|500]] Prototyping the Ramped Phase Distorter. ![[Pasted image 20240118170237.png|500]] Parts of the Desmos prototype converted into Max `[gen~]` patches. ## Developing the Modules The iterative process I used is described in the [README of my repository](https://github.com/rjungemann/PhasorSpace-Modules). It is possible to rapidly iterate on modules, although there may be ways to streamline the process further. The two documents I consulted the most were: the [Voltage Standards](https://vcvrack.com/manual/VoltageStandards) document, which explains important notes and best practices, and the repository for the [Fundamental](https://github.com/VCVRack/Fundamental/) modules, which gives concrete examples of working modules. A vast majority of work is done in the module's `process` method, which is processed per-sample, just like Max `[gen~]`, which is why I found Max to be a useful prototyping tool. I think if one has experience with other programming languages, that knowing C++ is not a strict pre-requisite. However, I think it is useful to start reading C++ code in the wild, to start to get an understanding (and I think VCV Rack modules are a great starting point). ## Conclusion ![[Phasor Space Modules.mp4]] My mostly-completed modules. Writing VCV Rack modules is really not bad at all. If you have an idea for an audio effect, making a VCV Rack module can be a nice way to get your effect onto a marketplace, where people can discover and install your effect easily. You can easily make it free, or charge money for your effects. VCV Rack can be run as a VST, meaning your effect can be made available in nearly all DAWs with no extra work. ## Appendix ### Miscellaneous Notes * Sketch out the module ahead of time. Making UI changes can be slow. * Be mindful of when you run code-generation, so your code doesn't get overwritten. This can happen if you make code changes, *and then* make UI changes in Inkscape and run code-generation. * Version control such as `git` doesn't fully solve the above two problems, but it makes it harder to lose code, and provides diffing, which makes working around the code-generation easier * You don't have to use the code-generation, but it is convenient. ### Useful Links There are three references which I think are essential: * The [Plugin Development Tutorial](https://vcvrack.com/manual/PluginDevelopmentTutorial) is the best place to start * The [Voltage Standards](https://vcvrack.com/manual/VoltageStandards) document explains some small details which are important to get right * The repository for the [Fundamental](https://github.com/VCVRack/Fundamental/) modules shows how to [build a simple effect](https://github.com/VCVRack/Fundamental/blob/v2/src/Delay.cpp) and [load samples](https://github.com/VCVRack/Fundamental/blob/v2/src/Wavetable.hpp#L164), among other things Other resources I found really helpful when I was learning: * [Presentation around C++ threading and DSP](https://www.youtube.com/watch?v=2vmXy7znEzs) that I found very useful * Squinky Labs has a bunch of great docs. [This repo](https://github.com/squinkylabs/Demo) contains articles and tutorials—the one on [Writing Efficient Plugins](https://github.com/squinkylabs/Demo/blob/main/docs/efficient-plugins.md) was really enlightening for me. ### My Approach in More Detail Sketch out the module. Block out the UI. 1. Duplicate and modify an SVG file for an existing panel, and use it to create a new panel in Inkscape. 2. Run the `name=SomeModule; $RACK_DIR/helper.py createmodule $name res/$name.svg src/$name.cpp` script to generate skeleton C++ code based on the SVG file 3. Make sure `plugin.cpp` and `plugin.hpp` look correct, according to the tutorial. This only needs to be done once. 4. Build and install the module. `make` and `make install` 5. Open VCV Rack. On OS X you can use `open -a VCV Rack 2 Pro` or similar. 6. Verify. 7. Quit VCV Rack. 8. Repeat the above steps as needed. Add the DSP code. 1. Add your DSP code inside your module's `process` method 2. `make` and `make install` 3. `open -a VCV Rack 2 Pro` 4. Verify. 5. Quit VCV Rack. 6. Repeat the above steps as needed.