Silhouette Studio & Inkscape Tutorial: Editing SVG Designs

RSS
Silhouette Studio & Inkscape Tutorial: Editing SVG Designs

EDITING SVG FILES

 

We've all been there.  You fall in love with a design, but it would be even better if it didn't have one thing - an out of place bump, bad spacing, a word you don't want, etc.  Don't just give up - you can fix it! 

 

Every svg is just a collection of nodes (or points in Studio) that tell your machine where to cut.  Think of it like a dot-to-dot.  Sometimes one of those dots is out of place or looks jagged and it throws everything off.  It just takes a quick touch up and off you go.

 

Let's start with Silhouette Studio and below we'll look at Inkscape - a great free software program that Cricut users can use to edit. (See the install tutorial here.)

 

EDITING IN SILHOUETTE STUDIO

 

First you'll open your svg file in Studio.  (There's more on importing files here.)  Once your design is open, look at the tool bar on the left side and click the Point Editing icon.  

 

The Point Editing panel will open to the right hand side.

 

Silhouette Studio how to select nodes or points on an svg file

 

Now your design will be covered in points - the little grey squares here:

 

Silhouette Studio closeup of selected points on an svg file

 

See how the one point inside the A is white with little red lines?  That point is currently selected or clicked on.  

 

The red lines show you where the arms or handles of the points are going.  The handles tell the line which way to bend and move. 

 

You can select multiple points at once by holding down the Shift key and clicking all of the point you would like to select.  

 

Silhouette Studio closeup of multiple points selected on an svg file

 

Here I've Shift-clicked all of the nodes around the inside piece of the A.  If I wanted to delete that part, I can just hit Delete on my keyboard or Delete in the menu to the right and it will remove all of those points at once.  

 

You can also move points by dragging with the mouse or using your arrow keys on the keyboard.  

 

Back to the Point Editing Panel - if we look at the original point again, it is a sharp angle creating a point at the top.  If you want to round the top you can click Smooth in the panel to the right:

 

Silhouette Studio making a point curve on an svg file

 

Reversely, if you want the point to be angled, you can click Corner in the panel to the right and it will create an angle.  

 

You can then use the handles to decide how big you want that angle to be.

 

Silhouette Studio making a point a sharp angle on an svg file

 

Now it's just a matter of patience and practice.  And don't worry, if you move or delete something by accident you can always undo - just hit Ctrl-Z.  

 

The more you play with them, the easier points get!

 

EDITING IN INKSCAPE

 

Cricut users are in a different boat.  There isn't a way to edit nodes in Design Space, so you will need to download software that will allow you to edit and save svg files.  Inkscape is a great option and it's free! 

 

Instead of points, in Inkscape each of those dots in our dot-to-dot is called a node.  

 

Once you have your svg open, you'll look for the Edit Nodes icon on the left side toolbar and click it.  

 

Selecting nodes in Inkscape on an svg file

 

Just like in Studio, your design should be covered in grey nodes now:

 

Inkscape closeup of a selected node in an svg file

 

You can either Shift-click each of the nodes you'd like to move or delete or simply click and drag your mouse just like you do when you selecting a design in Design Space.  

 

Now we have a whole group of nodes selected. Notice they turn half blue, half yellow and you can see all of the handles attached to them.

 

Usually the nodes will be square, signifying they are either corners or have handles. Sometimes you will see a circular node which means it's set to auto-smooth meaning it will always curve as long as the handles are not moved separately.

 

Inkscape closeup of multiple selected nodes in an svg file

 

The handles are directional arms that tell that section of the line where to go and whether or not to be straight or curved. If you click and drag one you'll see the line on that side move with you.

 

Inkscape moving the handle on a node in an svg file

 

To change your nodes, you can use the tools in the bar above the art board:

 

Inkscape node menu options

 

By clicking up here you can change your node to corner (sharp angles), smooth, add handles and connect or break apart line segments.  

 

Play around and see what you can do.  You can always undo by hitting Ctrl-Z, so don't be scared to experiment.

 

Happy crafting!

  

Previous Post Next Post

  • Kelly Lollar

Have questions or comments?