SVG to Blender pipeline

Playing more with my 3d printer, trying to make a Werewolf: the Apocalypse character tray

GMs get all the love in gaming. GM Books, GM Screens, GM Merch, the whole box and dice. I've made a few attempts at player focused things like a Player Book that has character, notes, inventory, tear-off-sheets for frequently changing things. One thing I've really wanted is a standee sort of thing to show character information. Inspiration struck yesterday.

  1. A card holder for showing your current form + stats
  2. A place for showing your current Gnosis, Willpower, and Rage
  3. A place for showing your current health

Doing more things with SVG lately I felt more confident in just messing about and seeing what I could make.

Start SVG image

Starting simple. Drew a rectangle. Drew a circle and attached it to the end for the standee. Immediately changed my thoughts - I'd originally wanted to have a cardboard standee holder so you could easily swap in/ out form cards. But then I thought if you're playing something else, you could use the standee as a mini holder if you're not actively using a map. Also you could then have standees as minis and swap them in and out easier. Right, sticking with that.

1<path fill="green" stroke="green" stroke-width="3px" d="
2 M10 10
3 h506.925
4 a94.4875 94.4875 0 1 1 0 188.975
5 h-506.925 z
6" />

Nice learning: how to use arc to create a circle or ellipse in a path. Nicer than trying to combine a rectangle and a circle.

Draw a circle inside the main circle so I can extrude/ intrude(??)

1<circle cx="516.925" cy="104.4875" r="75.59" fill="red" stroke="red" />

I wanted to have a pattern in the SVG, so I looked up the werewolf glyph for Garou and had to figure out how to include that into an svg. Found a link about <image/> in an svg. Nice.

1<image x="470" y="55" width="100" height="100" href="GlyphHomid.webp" />
2<image x="470" y="55" width="100" height="100" href="GlyphLupus.webp" />

Now for the health tracker. I found a really good 3d modeled health tracking cube for WoD style games. It has 3 faces with blank, bashing, lethal, and aggravated damage indicators. So let's whack some squares on the svg. Since they're repeating, I'll define the square in a def, and then reference the path in the other parts.

 2    <path id="health-inset" d="
 3        M0,0h37.795v37.795h-37.795z" />
 5<g id="health-track" transform="translate(25,30)">
 6    <g id="health-0" transform="translate(0,0)">
 7        <use xlink:href="#health-inset" fill="blue" />
 8    </g>
 9    <g id="health-1" transform="translate(60,0)">
10        <use xlink:href="#health-inset" fill="blue" />
11    </g>
12    <g id="health-2" transform="translate(120,0)">
13        <use xlink:href="#health-inset" fill="blue" />
14    </g>
15    <g id="health-3" transform="translate(180,0)">
16        <use xlink:href="#health-inset" fill="blue" />
17    </g>
18    <g id="health-4" transform="translate(240,0)">
19        <use xlink:href="#health-inset" fill="blue" />
20    </g>
21    <g id="health-5" transform="translate(300,0)">
22        <use xlink:href="#health-inset" fill="blue" />
23    </g>
24    <g id="health-6" transform="translate(360,0)">
25        <use xlink:href="#health-inset" fill="blue" />
26    </g>

By wrapping the whole health track in a g that I can then translate makes it easy to move as a bump.

Points that you spend next - gnosis, rage, willpower. Looking at some models of 40k trackers, I wanted to get fancy so I tried to make a dial you can spinsies. Just in this model, though, I need a circle divot for the dial and a pole for the dial and cover to go on. Circle within circle. Three of these, so defs again

 2    <g id="dial-inset">
 3        <circle cx="47.2325" cy="47.2325" r="47.2324" fill="blue" stroke="blue" />
 4        <circle cx="47.2325" cy="47.2324" r="18.8975" fill="black" stroke="black" />
 5    </g>
 7<g id="dials" transform="translate(20,115)">
 8    <g id="rage-dial" transform="translate(0,0)">
 9        <use xlink:href="#dial-inset"/>
10    </g>
11    <g id="wisdom-dial" transform="translate(120,0)">
12        <use xlink:href="#dial-inset" fill="blue" stroke="black"  />
13    </g>
14    <g id="gnosis-dial" transform="translate(240,0)">
15        <use xlink:href="#dial-inset" fill="blue" stroke="black"  />
16    </g>

Again, wrap and translate and using def.

That's got the basics in a 2d SVG mode. Time to move to blender.


I'm less familiar/ comfortable with Blender than mucking around with SVGs in text. The interface is really complicated and intimidating. But the start is easy - x to delete the initial cube and then import an SVG. It's imported! Super tiny though so I had to zoom in a lot to see it.

I then got caught in a near never-ending cycle of extrude, modify, boolean failures. My previous experience with blender was making my own vonExplaino logos and was as follows:

  1. SVG into blender
  2. Convert the Path to Mesh (select all, right click, Convert, Mesh)
  3. Use the Extrude tool to give it thickness
  4. Extrude the bits I want to delete into the main object
  5. Use Modifier > Boolean > Difference to subtract the bit from the main

I did this a tonne of different ways, but for some reason things weren't deleting cleanly. I was getting artifacts throughout.

Doing a bunch of research, a key suggesting was to change the type of object using Solidify modifiers. In the double advantage, the solidify modifier has a much nicer dialog for manually setting sizes of thickness etc. Doing this, I could cut clean elements out of the original model.

It's now printing on my 3d printer, so we'll see what comes of it.


3d models