You are here

Cakewalk Theme Editor

Sonar Tips & Techniques By Craig Anderton
Published October 2016

The Theme Editor is a stand-alone program that modifies graphic elements and colours used in Sonar.The Theme Editor is a stand-alone program that modifies graphic elements and colours used in Sonar.

Give Sonar a makeover with Cakewalk’s new Theme Editor.

Since the first X-series version of Sonar, it has had one colour scheme, or theme, called ‘Mercury’. Although there are several colour options for individual elements available in Preferences, and Panu’s third-party Duckbar utility (sonarmods.com) can alter Sonar’s look, users have been asking for more options as well as an ‘official’ Cakewalk way to create and edit themes. In the 2016.05 release, Cakewalk introduced a new, darker theme named ‘Tungsten’, and then for the 2016.07 release introduced the Theme Editor, a separate executable program that provides comprehensive control over Sonar’s overall look.

Creating a complete, artistically satisfying (and actually useful!) theme is not for the faint of heart, due to the huge number of modifiable graphic elements. However, the level of detail on offer also allows you to make smaller tweaks to improve the program to your liking. Here are some that improved my workflow.

Sometimes I forget that punch recording is enabled because the punch points are out of sight further down the timeline, and the ‘punch recording enabled’ button on the Control Bar is relatively subdued. So, I made the entire button red, and increased the saturation so it would really stand out. I did something similar for the ‘Loop enabled’ button as well.

The modified Control Bar is at the top, and the stock Tungsten version on the bottom.The modified Control Bar is at the top, and the stock Tungsten version on the bottom.

I also felt that the timeline needed more contrast, so I coloured the background black. This made the numbers, markers, and loop and punch points easier to see (particularly because I also increased the loop and punch markers’ saturation so they’d stand out more).

The Console view button for stereo/mono interleaving sometimes ends up accidentally in the mono position, which most of the time I don’t want. So, I made the mono setting red to draw my attention. And finally, my FX Rack enable buttons were modified to the ‘traffic light’ paradigm: red for stop (bypassed), green for go (enabled).

However, I also found that making these small modifications became a ‘gateway drug’ to several hours spent creating an entirely new theme designed specifically for doing Sonar workshops and seminars. The intention of this theme was to make the interface more monochromatic, for greater contrast and visibility, so that even those in the back row can see what I’m doing.

Getting Started

There are two main modifiable elements: colours that you modify within the Theme Editor itself, and graphic files that require an image-editing program. Any such program needs to handle PNG files and transparency, so Microsoft Paint doesn’t qualify. Adobe Photoshop is one option, but there are also free programs like Paint.Net (available from getpaint.net) and the GNU Image Manipulation Program (GIMP, available from gimp.org/downloads). If you’re not familiar with image-editing programs, prepare for a major learning curve. Of the two free programs, Paint.Net is nominally easier, but GIMP lets you do just about anything — if you can figure ou the user interface.

Once you’ve run the Theme Editor setup wizard, in which you specify where Sonar is installed as well as the default image-editing program it should use, you’re ready to go.

How Themes Work

Themes overlay new elements over the original Mercury theme. Therefore, you can always return to the original Mercury theme simply by removing any modifications you make. Also, when you click on any colour or graphic element, you’ll see both the original and modified versions — very convenient.

User themes have an ‘STH’ suffix and are saved in C:\Cakewalk Content\Sonar Themes. The Mercury and Tungsten themes are contained in the file TTSImage.dll, and can only be opened from within Sonar (Edit / Preferences / Customization / Themes).

For testing out themes, I created a small Sonar project that loads quickly, and with the theme under test already specified in Preferences (themes are saved with projects). The usual procedure is:

1. Open the Sonar Theme Editor.

2. To change a colour, double-click on it and choose your colour.

3. To change a graphic image, double-click it to open your image editor. A dialogue box will show the element being edited, and specify the editing program in which it is to be opened. After making your edits in the image-editing program, overwrite the existing image (remember, you can always remove the overlay and recover the original). You can discard the edited image, or save it if you expect to use it again.

4. Make sure you click ‘OK’ in the Theme Editor dialogue box that shows the element being edited. This replaces the theme’s file with the one you created.

5. Before testing out your theme, save the theme. Note that you can’t save if Sonar is open, so close it if needed.

6. Open Sonar (you can open it directly from the Theme Editor), and you’ll see the results of your edits.

The biggest limitation in this process is that it’s not always obvious which colours affect which program elements. Sometimes I temporarily make a colour garish, then open Sonar just to see what’s been changed. Sometimes changes will be apparent only in a particular part of the program that uses those colours. Unfortunately, at the present time there’s no ‘schematic’ that correlates the names used in the Theme Editor with elements in Sonar, and while most are obvious, some aren’t. Some colours affect more than one graphic element, too, so there’s trial and error involved if you want to go really deep.

The modified Step Sequencer, which I wanted to resemble a hardware synth, is on the top. The Tungsten version is on the bottom.The modified Step Sequencer, which I wanted to resemble a hardware synth, is on the top. The Tungsten version is on the bottom.

Also note that some of the elements, like knobs, will appear as very small objects. Knobs are represented by a series of individual knob positions arranged along a strip, so if you open a knob graphic in an image editor that tries to fit an entire image within a window, you’ll only see a thin line. Zoom in on the image by 400 or even 800 percent to see the knobs. This is also true of some other elements, and a keyboard shortcut in your image editor for different zoom levels will save you a lot of time.

Matters Of Convenience

The Theme Editor program has some convenient features that make theme creation easier. The folder ‘tree’ along the left side of the editor shows modified element names in bold, both with respect to folders and elements within them. You can also choose various views: colours only, modified elements only, and unmodified elements only.

Furthermore, you can open multiple Theme Editors at once, then cut and paste among them, as well as cutting and pasting within an open theme. For example, if two different aspects of the program use the same Solo button, you need modify only one, then copy it to the other. However, you can’t select multiple elements, or copy an entire folder and paste it in place of a folder in a different theme (or drag and drop from one theme to another). So, for example, if you come up with a particularly wonderful Control Bar design you want to apply to other themes, you’ll need to copy and paste every single Control Bar element you edited (over 200, if you edited them all). Put on some background music... This takes a while!

The Theme Editor also includes a folder (C:\Cakewalk Content\Sonar Themes\Theme Editor Toolkit) with various alternate graphic elements for knobs, meters, the transport, and so on.

Image Editor Tips

Assuming your main interest will be changing Sonar’s colours, you’ll become friends with the main aspects of colour editing: hue (the colour itself — no relation to Hue Robjohns), saturation (colour intensity), and brightness/lightness. For the most dramatic colours, you’ll want maximum saturation, but maximum brightness doesn’t always make the colour more vivid — it can wash out the colours toward white, so sometimes a darker setting provides the most vivid look. Additionally, brightness and contrast processing can help make colours stand out more. A desaturation function also comes in handy; it removes all colour, leaving behind a grey that’s easy to manipulate.

As alluded to previously, I’ve been working on a more monochromatic theme. In addition to being highly visible when projected during workshops, it also has a sort of ‘modular synthesizer’ vibe. I’ve already tweaked the Console view, Pro Channel modules, and a variety of other elements, so I expect it will be done by 2018. Just kidding! Seriously, creating a theme does require quite a bit of effort, but the results mean you can personalise Sonar’s look to a greater degree than has ever been possible before.

Buy Related Tutorial Videos