Jump to content
Due to a large amount of spamers, accounts will now have to be approved by the Admins so please be patient. ×
IGNORED

The quick and dirty Inskcape thread


Recommended Posts

Second time I'm posting this, thanks to my stupidity. Grrr....

 

For the uninitiated: there are two types of ways to store digital artwork.

 

First there is Raster. This is a digital map of bits (called a bitmap, not to be confused with Microsoft's own BMP file format). An image is stored with a set number of pixels. Take for instance, everyone's favourite raging homo, Zangief:

http://www.gamedude.com.au/arcade/inkscape/mshvsf-zangief.gif

 

Now say we scale up the image, here's what it would look like:

http://www.gamedude.com.au/arcade/inkscape/mshvsf-zangief_zoom.gif

 

Ugly pixillation, not good for printing.

 

The second type of file type is a vector file. Vector files store mathematically generated information based on nodes, lines, curves and arcs. As the image is scaled, what is show to the screen is recaculated each and every time. The end result is no pixillation, but always smooth lines and curves. Common vector file formats are PDFs, EPS (Encapsulated Post Script), and Adobe Illustrator's own .ai file format.

 

Inkscape is a free (open source and cost free) vector drawing package, available for Windows MacOSX and of course GNU/Linux. Within it is a frontend for a tracing program called Potrace. This program will trace around a raster image, and try to guess the best paths to turn it into a vector.

 

So, onto the quick and dirty "make your own vector art" tutorial:

 

Step 1: Download/install/open Inkscape.

http://www.gamedude.com.au/arcade/inkscape/Screenshot1.png

 

Step 2: Click File -> Import, and choose an image (I'm using our big burly russian friend fro above).

http://www.gamedude.com.au/arcade/inkscape/Screenshot2.png

 

Step 3: Highlight your imported image, and click Path -> Trace Bitmap:

http://www.gamedude.com.au/arcade/inkscape/Screenshot3.png

 

You'll notice several methods of tracing. I'm going to choose "Multiple Scanning" in Colour. I'll choose 16 scans (more will make a bigger image, but can look better if your image has lots of colours). I'm going to UNtick "smooth", as this performs a filter on the image before tracing, which looks ugly IMHO. I'll leave "stack" on, as this creates a stack of tracings one on top of the other, and removes a lot of the white holes that can appear in traced images.

 

Step 4: Hit OK. Depending on (a) the size of your image, (b) how many scans you are doing and © the speed of your computer, expect to wait anywhere from 10 seconds to 10 hours. My man geif at 16 scans on an AthlonXP 1800+ only takes a few seconds, which is nice.

 

Your newly traced vector image will appear above the original raster. Click and drag it off to the side to analyse it:

http://www.gamedude.com.au/arcade/inkscape/Screenshot4.png

 

Note that this is a grouped batch of smaller vector images. You can ungroup them by highlighting it and clicking Object -> Ungroup. From here you can either colour correct/modify individual parts, or delete out the background layer that sometimes makes it into the trace. This is a good idea if you are going to overlay the image onto another image, and don't want a big white square behind your character. Remember to re-group it again if you are going to scale it. With the select arrow (top tool in the lefthand menu), highlight the whole group with a click and drag, and then select Object -> Group.

 

Step 5: Highlight and remove the original raster image, leaving only the vector. Now we can export it. The standard vector format for open source hippies is SVG (Scalabe Vector Graphics). This is a plain-text XML file (you can open it with a text editor!) that contains the "instructions" on drawing the vector image. If you are sending your art to a print shop, ask them what format they prefer. Most will use EPS or PDF as a preference.

 

I recommend saving as SVG first, as you can use this easily in the future if you want to add more to your vector scene (extra characters, backgrounds, etc). Then from there save out as EPS or PDF when you do a final export.

 

http://www.gamedude.com.au/arcade/inkscape/Screenshot5.png

 

Click File -> Save As. Choose your filename and filetype, and save.

 

So, here's the final PDF of our wrestling hero:

http://www.gamedude.com.au/arcade/inkscape/zangief.pdf

 

Scale it up a few thousand percent and see how smooth the lines are. No pixillation there. It can now be printed as a massive wall poster, cab sideart, or tiny CP artwork.

 

Fiddle around with the trace options and look at the end results. Depending on your input artwork (or even photos), different tracing styles have differing results. Of course, this is absolutely no substitute for a human-traced image in either filesize nor quality, but it is a nice and simple way for talentless fools like me to get quick vector artwork. :)

 

Happy tracing!

Link to comment
Share on other sites

Good stuf, I may even try it...

I can't remeber what it's called but Adobe Illustrator has this feature, wasn't too impressed by it, but never experimented with it much, plus of course it aint free!

Yup, most of the major packages have this. Adobe Illustrator, Corel Draw, Macromedia Freehand, etc.

 

But as mentioned, they are anywhere between several hundred and several thousand dollars.

 

A note on the above: tracing auto-artwork is dependant on a lot of things, but none so much as quality input. Simple artwork with few colours (like the zangief image above) turn out the best.

 

Heavily compressed JPEGs tend to come out ugly. With these, the smooth option can help. Likewise, fiddling with them first in The GIMP (or Photoshop if you're rich) can help lessen the harsh compression artifacting, and make your final trace look better.

 

Here's a hint: the best artwork? Screengrabs! Play your favourite MAME game, and whack the F12 button. It will take a screenshot for you. Chop out the part you want (say, the title screen, or a picture of your facourite character), trace it, and scale it up! The results can be quite pretty. :)

Link to comment
Share on other sites

We use Adobe Streamline at work. It works great.

The trick is to convert the original image to a B&W bitmap (and darken your black levels as you go, which will sharpen it up too) and then enlarge it to about 1000%. Will be a much more accurate trace.

Or just do it by hand you lazy sods!

Link to comment
Share on other sites

I think adobe Illustrator comes in a trial version. I think.

Including the tracing software?

 

Seriously... try out Inkscape. It's bloody impressive. And ironically, it has a faster redraw than Illustrator.

 

In fact, every alternative package is faster than illustrator:

http://www.xara.com/products/xtreme/performance.asp

 

Adobe make shit software. It's a wonder they're still around, to be honest.

 

Or just do it by hand you lazy sods!

Damn right I'm lazy. Bravo to anyone who makes trace software so I can sit back, play games and drink beer instead of hand-tracing stuff. :)

 

Still, there's some things that just don't want to be auto-traced. And for those, we'll always need folks like you. :)

Link to comment
Share on other sites

Adobe make shit software. It's a wonder they're still around, to be honest.

 

They made their millions on postscript printer language (their software eg Photoshop etc came afterwards), and will continue to do so esp. in the printing industry. Even M$ couldn't better their PDF technology.

 

Looks like Adobe Streamline has been discontinued... It's better than what is built into CS2.

Link to comment
Share on other sites

:cry i love free software :cry

I will read this when I get home. I love free software.

apt-get install inkscape

 

:D

 

I just tried Xara Extreme, bipmap trace. It's crap, but fast. Did a google search to see if I was doing anything wrong, and nope. Tried using your image Elvis, and the result come out damm ugly...

Did it have lots of white "holes" in it? The Potrace program gets around that using the "stack" option. It's quite a clever idea, although it does make bigger/slower images.

 

They made their millions on postscript printer language (their software eg Photoshop etc came afterwards), and will continue to do so esp. in the printing industry. Even M$ couldn't better their PDF technology.

Adobe have legacy on their side. Every graphic artist in the world was brough up on Adobe. Switching to anything else is a scary process for most people, and as such the fear of change will keep Adobe making money for some time to come.

 

Same reason why people refuse to dump Windows and change to something better. :p

Link to comment
Share on other sites

 

Did it have lots of white "holes" in it? The Potrace program gets around that using the "stack" option. It's quite a clever idea, although it does make bigger/slower images.

 

:p

 

Yep, even increasing colour depth actually reduced the colour on the output..

Link to comment
Share on other sites

Well, I just tried it and this program is great for image to vector, really does a great job.

Now have to work out when I split the layers, and then use ungroup, move the layers around. THen when going back to group it doesn't do it, So I manually put them back over each other, not sure what's up with that!

 

Also experimenting, I've set the scan (I think) to 200, so far my computer has been running at 100% cpu utilisation for around 3 hrs.. lol.. Also, is it a limit with Vector images that they can only be a max of 64 colours?

Link to comment
Share on other sites

Nope, any colour what you want. Most of them just 'fill in' kinda like paint by numbers.

 

Ok, so it can choose any colour but are they limited to how many colours can be displayed at any one time, only asking as every vector imaging software I've used limits the clour output to 64 colours!

Link to comment
Share on other sites

Ok, so it can choose any colour but are they limited to how many colours can be displayed at any one time, only asking as every vector imaging software I've used limits the clour output to 64 colours!

 

hmm, no idea!

Elvis might know.

Link to comment
Share on other sites

  • 2 weeks later...

As far as I can tell, Inkscape's SVG format has no limit to the amount of colours you can use. It uses standard SVG XML with a few extra (open source) addons. Of note, these addons can be stripped and you can export the image as pure W3C compliant XML/SVG.

 

Each colour is represented by it's hex RGB value. eg: "Pure Red" is #FF0000 - or FF (256) red 00 blue, 00 green. And so on for all other colours.

 

Whenever you define a gradient between two colours, the first and second colour are defined, and the gradient is listed as a matrix transformation between the two colours.

 

So by definition, the maximum colours used would be the maximum set defined by 24bit colour (ie: 16.7 million).

 

The SVG files made by inkscape are written in plain text encoded XML. You can open them up in any text editor and see how the file is being drawn step by step. Make an image with a few different objects in different colours, open it up and take a look.

Link to comment
Share on other sites

As far as I can tell, Inkscape's SVG format has no limit to the amount of colours you can use. It uses standard SVG XML with a few extra (open source) addons. Of note, these addons can be stripped and you can export the image as pure W3C compliant XML/SVG.

 

Each colour is represented by it's hex RGB value. eg: "Pure Red" is #FF0000 - or FF (256) red 00 blue, 00 green. And so on for all other colours.

 

Whenever you define a gradient between two colours, the first and second colour are defined, and the gradient is listed as a matrix transformation between the two colours.

 

So by definition, the maximum colours used would be the maximum set defined by 24bit colour (ie: 16.7 million).

 

The SVG files made by inkscape are written in plain text encoded XML. You can open them up in any text editor and see how the file is being drawn step by step. Make an image with a few different objects in different colours, open it up and take a look.

 

I'll re-read this when not so tired, but why is it then it only allows you to choose a max of 64 colours?

Link to comment
Share on other sites

I'll re-read this when not so tired, but why is it then it only allows you to choose a max of 64 colours?

I would say that's just an interface thing.

 

Most vector artists recommend you keep a simple pallette for purely aesthetic reasons. Too many colours in a drawing makes it look ugly.

 

You can click on any object in your drawing and manually change the colour at any time from the standard RGB 24bit (16.7mill) colour wheel. The 64 colours shown on the main drawing interface are merely shortcuts to your 64 preferred colours. And you can change these too (add/remove colours you use (in)frequently).

Link to comment
Share on other sites

  • 11 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...