What Programs Can Create SVG Files?

hey everyone casey here with pen and posh so this week we are going over what programs can create svg files um if you search this and found this video you're probably wondering the same thing so svg files as we already discussed in my previous video are scalable vector graphics and these are actual cut files and vectors that can be loaded into the program in a program such as cricut or silhouette or glowforge laser cutting machines each of those need a scalable vector graphic in order to know what the path is to cut out you can't just upload you know a png it needs to be traced into um an svg it needs to be traced into a vector in order for it to work and so that's a common misconception that um pngs jpegs raster images images that are made up of tiny low pixels are svgs are cut files and that's not the case each one of those has to be traced in order for it to work in the cutting machines so today we are going over a few different programs that actually create real cut files um cut files that are already in vector format okay so some of those programs um and we'll be going over two different types of programs so the first group are programs that trace images and convert them into an svg or convert them into a vector that can be exported as an svg the second group is programs that can actually trace images and convert them into svgs or it can actually make svgs completely from scratch by drawing them or creating a shape from scratch or using any of their tools to create an svg that will work in the cutting programs okay so let's hop to it okay so for the first group of programs that trace images and convert them into an svg these are all free and you can find them online so i'm going to use a complex image a image that has variation a lot of color variation in it and would be typically a harder image to trace let's say i want this sunflower here and i actually just want you know maybe the outline of the sunflower some of these programs it won't pick up a very good trace and i will share with you at the end of this video the program that i use and what most svg designers use but for this video i want to give you all your options in case you're just wondering you know what's out there and what do each of those options do so first i'm going to use this sunflower image from pexels.com it's a free download so i've already gotten it onto my computer and have it downloaded okay so first up is online convert dot com and you can simply just upload your uh your image to this so um i haven't previously done this to this video oh actually i just did and then pretty much you just upload it and press start conversion and so it'll convert it into a svg and then you can download it here so we'll just do that and then maybe we'll even just open it and give you a view of what it looks like okay so not the best trace um using their default functions and so you'd probably need to go over here and mess around with each of these options here which could be pretty time consuming if if you aren't familiar with the software but that's one way that you can create a svg another way that you can is using picsvg.com and i already uploaded the image here and you can see it actually kind of gives you a fun outline of the image um there's different filters that you can hear use here and so you can mess around with those and see what you prefer if you have a simple image you know a lot of these online free softwares will probably work for you and you can even choose your different colors here too and so it'll make them a different color with svgs that isn't quite as important um you know we're cutting out the file on material so it doesn't really matter what color it is but you can also choose filters that are not inverted which really don't do as well because there's a lot to this background so again if you have a simple image that one would probably work for you let's move on to the next one this one is svgcreator.com and so i've already uploaded mine there weren't really any options to this one it's just what you get but they do have the option to convert it into a dxf which is another cutting file format and so there's another option for you as well if you're wanting a dxf file and then this one is probably the most advanced that i have found um for svg creation um online for uh just the online versions and so i've uploaded my image here it is on the right and actually they give you a whole panel here that you can customize it with so you can edit the result you can remove the background usually you know if you have the desktop version um this one they won't allow you to do so you'll have to download it first you can tell them that you want a high level of detail and it does take a moment if you have a high res image okay so that took a little while to upload using that high detail um but you can see it did a very similar or a very detailed trace um you almost can't even tell the difference between these two now something that you may not know about cut files is that they need to be very simple and so if you if we were to zoom in on these each of these colors so this lighter orange right here this is its own path and so this is the path that the cutting machine will cut out if you have a lot of paths then this cut file probably won't even load into the program because it's so complex and so it might be best to use the low detail and to see what that'll give you and just keep on messing around and then troubleshooting and uploading your svg into the cutting program but this is a great option if you are you know just wanting a one-time use svg file and you don't have a lot of resources i just clicked on that low-level detail and that is a lot better so i would definitely try using that first and foremost when creating your cut file and so um you would just create that and then you would press download result and then it actually gives you different um different uh download types which is kind of neat too and it gives you a fill only and then it also will give you like that inversion or inverted image trace that we saw it'll also give you that type so let's download both but the catches is that when you click download either one of those formats any of these buttons they will make you pay and this is becoming very common for any of the programs that are worth using nowadays uh a lot of them are switching to a subscription-based payment so you pay you know x amount each month but they do have a desktop unlimited use that looks like it's just a one-time charge and so that's what you know could be a downside to this one and could be a good option if this is something that you're wanting okay so now let's go over a couple softwares that are probably the two bigger dogs in the svg design industry and that is inkscape which is a free vector design software and then also adobe illustrator um adobe illustrator is the premium and leading the vector design market this is what i teach my course in um it does cost 20.99 a month um but you guys i promise you it's totally worth it um i think that uh well and i should say this is the uh vector design program of choice by svg designers i was in a a separate private facebook group with a bunch of other svg designers that i was invited to be in and someone asked what program what software do all of you use to create your svg designs and like i shared i think it was last week um i shared that screenshot of what their response was and it was adobe illustrator and so i've been using adobe illustrator for oh gosh like over 10 years now and and i learned it in the at the university where i went to school and so it's a graphic design program taught to professional graphic designers i wasn't a professional graphic designer i have definitely learned more from just like hands-on experience through the years of using illustrator but this is where it was first introduced to me um and i think for that reason and really the ease of use is why many people prefer it and so this one i'll um i'll lead off um the end of this video and showing you how um i would set up the um how i would trace that sunflower beginning to end using the software um and i to be honest i don't know um inkscape very well but i know how to to make my way around and so um let's go over how to trace the image and and how to clean it up a bit and i'll just go through the image trace process just like we did in the other online softwares that i showed you but you'll you'll see that there's quite a few more options to these two softwares as we go through that okay so first off in inkscape um let's go ahead and open up our image so we'd go over to file and then import and then navigate to our image that we downloaded from pixels.com okay and then press open um i just keep it the image dpi from file and then i also just set the image rendering mode to none you can um play around with it my computer it gets really slow when i select these other um the smooth option you probably won't want to ever select blocky but press ok and then we'll just wait until this loads in here and the lag that you're seeing it could be just because mine is a mac i think that um inkscape performs a little bit better when done and used on a pc so i'm just going to scoot that over onto my artboard here um usually when you first download inkscape you won't have any of these panels open over here those were just ones that i had open earlier so let's close those and then you can see how this would look if you're doing this for the first time so now you would select your image and then go up to the menu and then go to object or sorry go to path and then trace bitmap and this will pull up a panel that we can use to trace the image here um by default it goes to single scan and then brightness cutoff is right here but let's go to multiple scans and then under brightness steps you click on it and then select colors and um i'm going to increase the scan so this is how many colors it's going to read in this image when we are working with cut file designs it's important to have a very simplified image because if you were to do a complex trace on this it would return several little itty-bitty paths itty-bitty um pieces that it would try to cut out on the cutting machine and so it's important to limit how many scans we do here so there's a preset option in illustrator that's 16 and so i'm just going to set it to this so we can compare apples to apples if you have an image that has a white background and you know i will say be sure that you have permission to use the image i was just in a free svg group the other day and people were sharing jpegs left and right and it was hard to believe that they had the the ownership and the right to share each and every one of those designs because each and every image that we find online that we search on google and we pull up that image is owned by someone that image was created by someone so it is immediately protected by copyright so if you were to go out and copy an image to use an image without permission you could get in trouble you could get find you could get sued so it's very important to go to a site and like i got this one from pexels.com which we'll link to in the notes but that is a completely free site just whatever place whatever source you're going to make sure that you have the rights to the image and that they're included when you do something like this okay all right there's my tangent i'm done okay so when you increase the um scans 16. um if you have a simple image you can remove background and it will like you know remove the white background if there's a white background there but then you can press update and actually see what your scan returns which is kind of cool so i'm just going to go with that press ok wait for that to process and you can see it processed here so i'm just going to click it and move it just a little bit to the right and i'm going to delete the image that's behind it whoops because it makes a copy of the image um and just places the trace on top of the previous image on top of the original image so i'm not sure why it does that and something funky kind of happened right there so let me see if i can get back i think i'll just um click on that image and then press cut command or control x and then i'm going to click on this image delete it and then press shift command or control v to paste in place and it is not doing it for some reason oh that's because on a mac it is not shift it is option commander control and then v okay so for some reason that's being really weird and like removing um bits of my image here but i guess for this example it'll work um because that's definitely not the scan there um for whatever reason and i've downloaded a couple different versions of inkscape um it comes with like little bugs like this that i'm really unsure about um like i said this could just be on mac versions um but so that's something to be aware of if you are considering using this um a bunch okay so now that we have our image traced let's go over to illustrator and do the exact same thing so let's insert our image and i'm just going to click and drag the image since i have it open on my other window and i can resize this up here like if i wanted to like cut it in half you can make or right here actually up in the top bar when you select things this will always change so depending on what you're selecting it will bring up a set of options in the top bar that are relevant to that item which is pretty cool and so i'm just going to maybe make the width 400 pixels and that'll make it a little bit shorter and that's good or you can reshape it by clicking on one of the corners and dragging it out but i think that's good now if we were um to trace this just using the default it will usually return a black and white yep so i'm going to undo that and i'm going to show you what to do so illustrator has seriously like an unlimited amount of options that you can use to do an image trace which is really neat so if you go up to window and then press image trace and check that this little window will pop up here and it gives you all of these options and so you can bring up the threshold you can check preview and see what that does or you can bring it back down and see what that does i'm going to colorize my trace is that a word colorize i'm going to make my trace color and so you can see how many colors it actually returns um so if we just bring it down here to 16 this is the same trace that happens if we go back i'm just going to press undo and do and do if we go back to the image trace and click the drop down arrow it's this one right here so they come with a bunch of presets if you already know what you're wanting so i'll just select that i wanted to show you this cool little panel because it gives you a lot of options to make your trace exactly what you want you can ignore white um in the past when i've used ignore white for cut files it'll return funky paths that are like transparent paths that are like skewed a little bit um but from what i've heard from other svg designers that works for them and they love that and so feel free to use that if it has a white background too but this image trace looks pretty good now i'm just going to press expand and what that does is now it's a vector now we can click off we can click back on just like the individual path and manipulate the path we can edit the path okay and so you can read this out here you can change it you can add to it it's awesome i love vectors because vectors are the beginner or are the beginning part of a design every single design well i shouldn't say every but mostly every single design starts as a vector okay so let me put my image trace panel back in here this is also kind of cool um you can just click and drag and leave it um in the panel right here we'll go more over that later but here's the image trace return and here is our um our vector here now let's go back over to inkscape and let's do that last kind of part that um that we did in illustrator so i'm just going to click right here on edit paths modes and by default this little um option up here won't be selected but go ahead and select it because that will allow you to see your paths and select them um now in illustrator you can see that we could see our paths automatically so that's what that is in illustrator but in inkscape we have to select that option and you can see the difference between traces definitely difference between each of those traces but let's act as if we are going to remove the background and we just want this little sunflower right here and so one thing that you can do is select the image again using the black arrow and i'm going to go over to path and then select object to path make sure that those are all paths and then i'm going to go again to path and then select break apart and now at this point i'm going to grab that edit path nodes and then once you have those anchor points selected they'll look like a little dark blue you can press delete and then just continue to delete away the background um for some reason inkscape doesn't let you select all of those paths so you can only do it one path at a time if there's a better way to do this i would love to hear it in the comments below but let's show you how to do the same thing in illustrator and so i would just go through and start deleting away those paths so i'll show you how to do that in another video next time we're actually going to dive even a bit further into the differences between inkscape and illustrator so stay tuned for that and be sure to sign up for an upcoming free and live masterclass the top insider tips to becoming an svg designer and let's talk a little bit more about that before you head out hey guys so it's that time of year again the big craft season is upon us and to celebrate i am hosting my annual live and free masterclass the top insider tips to becoming an svg designer if you've been hearing about svgs but you aren't quite sure what they are or how they work or what all the hype is about maybe you've even heard one of the many success stories from others how a single stay-at-home mom provides for her family through selling svgs or how one woman replaced her corporate income within a matter of months selling her designs on etsy i'm totally raising my hand to that one or how crafters are now able to design whatever project they want without the limitations of silhouette studio or cricut design space then you'll definitely want to keep on listening to this because the increasingly popular cutting machines have made svg design a very sought after skill to have that's why in just a matter of days i am hosting my live master class where i share all the insider secrets i've picked up through the years since becoming an sbg designer and seller i will also share with you an opportunity to join the designers course to svg files as well as give away some very good freebies which i have never done before so be sure to head on over to pinonposh.com forward slash masterclass to learn more and reserve your spot

Channel: Pen & Posh

Views: 26,469

Keywords: Top Insider Tips To Becoming An SVG Designer, Kasey Snell, SVG Tutorials, SVG Files In Silhouette, SVG Files In Cricut, SVG Files, SVG Creator, Silhouette Studio, Programs To Make SVG Files, Programs to make SVG, Procreate Designing SVG

Id: mv7JRCJEFWQ

Length: 24min 16sec (1456 seconds)

Published: Thu Aug 20 2020