How to properly export from Affinity Designer to SVG

I’m currently trying the Affinity Designer demo, but I cannot get it to export a SVG file that VCV will interpret correctly. It doesn’t scale to the right dimensions, and when I see the exported source, I see it exports to .px not .mm … Does anyone knows the correct export settings ?

I use Affinity Designer for my modules and I work completely in pixels. I haven’t tried exporting in mm.

I must add that I don’t use the python script for creating the widget code.

I used to setup my document in inkscape with 128,5mm height and HP x 5.08mm for the width, but that’s maybe where it’s glitching in AD.

How do you setup your dimensions then for VCV to interpret them correctly ?

You can check it, the files are in my GitHub repo. Width is 15px per HP.

2 Likes

Thanks, setting dimensions in pixels did it. Not sure what’s going on but at least, it’s working now :slight_smile:

Bumping to say thanks. I switched to Affinity a few months ago after Adobe raised my rates. I’m working on updating my panels.

2 Likes

I will just post this here as well, in case anyone finds this discussion and has the same issues I was having with Affinity Designer. I’ve produced a simple Python script that converts these files from pixels to mm: GitHub - nickfeisst/ADSVGFix

I now have a folder within my module folder that is used for all my Affinity Designer SVG exports, and then I use this with a simple shell script to process all of these files into the final resource directory.

2 Likes

I use the free Adobe XD for making panels. But I hear Affinity is very good, too.

Yeah, I just recently learned about XD. Our graphic designer used it to send us wireframes for our new plugin interface. It was very handy for collaboration, as he could make edits to the cloud document. I didn’t need to install anything, either. I could just open up the document and look at pixel dimensions and coordinates. in my browser

Still, I’m cozy with Affinity for personal use. I’m pretty firmly in the “once bitten, twice shy” camp with Adobe now.

ah, nice. Does Affinity have some kind of “sticker sheet” feature? I find it a huge timesaver to put all my UI elements like switches and knobs into one master document that I can just pull components (symbols) from and place on the panel.

Affinity Designer does have a symbol mechanism. I always confused myself more than helping myself with that. But maybe that’s because I never stuck with symbols long enough to work out how to use them properly.

When I was using symbols with Illustartor I couldn’t figure out how to make it work for me. It’s more or less trivial in XD.

I thought we were all using Inkscape? Am I missing out on something?

Inkscape is the only officially supported tool. But Many people use other tools. I have never used Inkscape. Installed it, took a look, thought “no, I don’t think I need to learn this”. I used to use Illustrator for panels, switched to Adobe XD when I updated my computer.

with affinity designer and just an ipad with a stylus you can design components with ease.

We all like what we like, right?

this is true.

1 Like