Page 1 of 2
Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 2:51 am
by audiohack1
Hi,
New user here again with another question. I've been importing SVG files that I created in Affinity Designer into Moho. It's working pretty well, but quite a few of my vector lines end up being converted into shapes. I'd like to keep them as vector lines. Is it possible to convert the shapes back into lines without redrawing them in Moho? Or better yet, is it possible to prevent the lines being converted into shapes in the first place?
The easy solution is to create all my vector art in Moho and avoid the import. But I'm not ready to give up the convenience of being able to create vector art on the go with my ipad. Hopefully, I'm missing an obvious solution. Thanks.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 3:37 am
by Greenlaw
Can you post screen caps of what the art is supposed to look like vs. how it appears in Moho? I'm guessing you want to see are shapes with visible strokes and what you're seeing are only the fills with no strokes, but it's a little unclear from your description. If this is the case, all you need to do is enable Stroke in the shape's Style settings. And if you don't want to see the fills at all and only the strokes, just disable Fill and enable Stroke in the Style settings.
Using another program for vector art is a valid method, and the SVG format seems to preserve/convert the number of points, placement and curvature pretty accurately. Certainly much better than using the old .ai export format. I use this method mainly for technical art that would be difficult to draw in Moho, and it works quite well.
For organic character art that I will be deforming with bones, I personally find it easier to draw paths in Moho that will be more optimal for rigging and animating with Smart Bones. That said, you should be able to edit the paths imported from the SVG inside Moho just like paths created inside Moho.
Hope this helps.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 5:22 am
by Greenlaw
Additional info: It's been a while since I last used this feature, and it seemed there was a trick to getting exactly the right stroke and fills, so I took a look just now.
I don't use Affinity Designer but I know that in Adobe Illustrator I need to use the Save As... command (in other words, not the Export... command,) and choose .SVG as the format. Then, from the settings window that appears when you click Save, choose SVG Tiny 1.2.
Using this specific .SVG format will save the shapes with their fill and stroke properties for Moho, and any of the earlier format will not. I'm going to assume the same rule applies to Affinity Designer's SVG exporter.
Hope this helps.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 5:17 pm
by Greenlaw
Correction: I took another look at SVG import this morning, and the version doesn't have anything to do with this: 1.0 to 1.2 from Illustrator works fine in Moho. The difference is in which command you use.
[Export As....SVG] will export only the shapes and it does not preserve properties like Stroke and Fill. Avoid this method.
[Save As..SVG] will export the shapes along with Stroke and Fill properties. Use this one.
I'm not sure how this relates to Affinity Designer, if at all.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 6:12 pm
by audiohack1
Thanks for your detailed replies. I did some more testing. It looks like it's only happening to the vector lines that were created in Affinity Designer using AD's Vector Brush tool. Vector lines made with AD's Pen Tool and Pencil Tool import into Moho exactly as drawn and with the same, or very similar, node placement.
Lines created with AD's Vector Brush Tool, however, are a different story. The line imports in to Moho and looks like the original, but Moho adds extra nodes around the perimeter of the line causing it to behave like a shape when editing it further in Moho.
I'm using File=>Import=>Vector File=>SVG File in Mogo to bring the SVG file in from Affinity Designer.
(Sorry for the large size of the screen caps, first time posting images on a forum)

Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 6:24 pm
by synthsin75
That's to be expected. Vector brushes generally mean that, under the hood (even if not displayed), the entire boundary of the brush is made of vectors...instead of just a center line.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 6:31 pm
by Greenlaw
Wow...that IS weird. I see is three things going here: Moho is tracing the outline of the path in addition to including the centerline path, plus it's auto closing the centerline path. I've never seen this before but, as mentioned, I've never used Affinity Designer. The result is kinda like a combo of the Brush and Blob Brush tools in Illustrator, but weirder. (Hmm...I wonder what happens if I use Illustrator's Brush or Blob tools for Moho.)
As for the extra 'curly' knot, I sometimes see that when using Moho's Freehand tool.
Sorry, my only suggestion is don't use the Brush tool, and stick with Pen and Pencil. Hopefully, you will find a more satisfying solution soon.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 7:17 pm
by audiohack1
Thanks again for the replies. For now, I'll be avoiding AD's Vector Brush for stuff I plan on exporting and animating in Moho. Either that or be prepared to redraw/trace any AD Vector Brush strokes in Moho using the Freehand tool. Or better yet, start creating more art in Moho and really learn the ins and outs of the software.

Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 7:34 pm
by Greenlaw
All that said, using any
freehand vector tool (in Moho or in a third party program) to create character art that will be rigged with bones is not ideal because you don't have control over point placement. You can use freehand vector art of course but don't expect to get good deformations in the joints. IMO, It's better to plot optimally placed points with the click-and-drag method (in Moho or in another program.) Once you get the hang of it, you can draw very accurately this way and reasonably quickly. I admit this is not nearly as fast as freehand drawing but, for me anyway, getting predictable deformations with minimal fussing makes it worth the effort. The extra work upfront really pays off later during animation.
If you really need an 'organic' look, I think it's better to use bitmap art. (I often use a hybrid of vector and bitmap techniques in the same rigs.)
But it probably depends on the design/style choices you make and how you intend to animate them. Experiment with a a lot of different techniques and see which ones work best for you. And if you come up with a new technique, please share it here.
Years ago, when I started working on my first Moho project
Scareplane, I thought I'd be creating all my art as vectors in Adobe Illustrator since that was what I was most familiar with for vector drawing. In the end, I scrapped everything I made in Illustrator and just drew all my character art directly in Moho using the Add Points tool. That's pretty much what I've done since for vector-based character art and it's worked out really well for me.
Of course back then, vector import to Moho (ASP 9.5 actually) was pretty bad, and it's come a long way since.

Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 7:48 pm
by audiohack1
More great advice. Thank you! Especially this
Greenlaw wrote: ↑Tue Nov 30, 2021 7:34 pm
...getting predictable deformations with minimal fussing makes it worth the effort. The extra work upfront really pays off later during animation. ....
And based on the Moho content in your Demo reels, it's pretty hard to argue that great looking character art can't be made 100% inside Moho.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 8:35 pm
by Greenlaw
Thanks for the nice comments!
I've been working on a series of tutorial videos including one about drawing for rigging with Moho's vector tools. Hope to start putting these out over the upcoming holidays.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Tue Nov 30, 2021 11:23 pm
by SimplSam
I have tested this in Affinity/Moho, and the only way that I can get it to fail, as in your example, is if I assign a Fill color to the Vector Brush -
which is not normal.
Line and Fill
In this first example, I have Fill but with 80% and 100% Line opacity. With 100% Line the Fill is hidden, as it would be if the Fill was the same color as the Line.
Affinity - Fill with 80% and 100% Line opacity
Line Only
If I create with just a Line color (or remove Fill) then the
shape is faithfully reproduced in Moho.
Affinity
Moho (imported SVG)
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Wed Dec 01, 2021 12:03 am
by Greenlaw
Hi SimplSam,
Thanks for checking this out in Designer and explaining what you found. Good to know in case I ever drop Illustrator and switch to Designer.
@audiohack1, I suspect that in SimplSam's first example, if the line was curved, the fill would become visible even when it's the same color, so the best solution for an open curve is to not have fill enabled at all.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Wed Dec 01, 2021 1:28 am
by audiohack1
SimplSam wrote: ↑Tue Nov 30, 2021 11:23 pm
I have tested this in Affinity/Moho, and the only way that I can get it to fail, as in your example, is if I assign a Fill color to the Vector Brush -
which is not normal.
Thanks for testing that. I can confirm your result regarding the fill (didn't realize I had a fill color assigned to the Vector Brush when I drew the original line in Affinity Designer). Unfortunately, I'm still left with an imported vector line without it's original "central spine" of nodes that I can easily reshape in Moho without having to deal with the nodes around its perimeter. But as Greenlaw pointed out, animating brush vector strokes can be fiddly compared to animating lines created with the Add Point/Pen or Pencil tool.
Re: Possible to stop vector lines from becoming shapes when importing SVG files?
Posted: Wed Dec 01, 2021 3:17 am
by SimplSam
Groovy. The other thing to mention is that it is Affinity that changes the Vector Brush strokes from fat-line to shape during export to SVG. If you reopen the exported SVG file in Affinity - you will see a shape like that when imported to Moho.