Urban75 Home About Offline BrixtonBuzz Contact

Question Types of computer graphics

aileen

New Member
Hello, everyone!
I am new to photography and graphics.Trying to get more about graphics in overall. I know there is a pixel graphics, vector graphics... what is the main difference in it? Are there more variants of graphics?
Sorry, if my question looks silly... completely new in this field
 
Everything ends up as pixels eventually, but when people say "pixel art", they mean they draw it pixel by pixel. Like when you zoom in fully on MS Paint and you see a grid and every time you click you fill in a square...that's pixel art/graphics.

4388b869fd04d7e6dc6b899fc853ef37.jpeg

Vectors are when you define lines in relation to each other, so the renderer can re-draw the shape/image when you zoom in and out and you don't lose quality. Some people call a specific type of art vector art, like this:

vector-background-graphic-31.jpeg

I'm not sure how the name came about for this style, but it's usually 'flat', with bold, block colours, and either geometric or abstract. There's nothing to stop you creating that exact image by doing pixel art, though. Vectors are usually SVG files.

Then there's voxels, which are like 3D pixels. You can make anything with these cubes and it can produce an oldskool, yet modern/cool look about them. Minecraft is probably the most famous use of this technique:

1*yhawaNDi6Z6eYcCNgGYtVQ.jpeg

And then you have polygons, which are like voxels of an arbitrary shape. The more polygons, the more "real it looks. Remember the first 3D games that looked really blocky? They had fewer polygons than newer ones, where you have more definition on curves and whatever.

Sophisticated-rendering-techniques.jpeg

And that's about the sum of my knowledge, and almost certainly outdated. You better not be a spammer because this was more effort than I intended :)
 
Wow!!! Thank you so much for your quick reply. I think I got the idea! One question appeared in my mind. Is it possible to convert pixel graphics into the vector one and on the other way round?
 
Basically, to simplify things - you can blow vectors up to the size of the moon if you want without losing quality. Raster/Pixel/Bitmap graphics are more limited and should only be used for photography.

Yes, you can convert pixels into vectors - you can use the trace tool in Illustrator but you'll get mixed results depending on the quality of the image you're tracing. Alternatively you can manually trace around it using the pen tool, which again depending on the quality/simplicity of the image can be quite difficult.
 
You can always render vector graphics to pixels. All vector graphic programmes (e.g. Adobe Illustrator, CorelDraw) will have an export to JGP, PNG, etc. function.

Converting from pixels to vector is possible within certain limits if you use a trace programme which will look for edges and convert those into vector lines (with or without fills). Graphic pixel images can sometimes convert to vector quite successfully, but photographic images usually less so.
 
8 bit can fuck off back to Hoxteth, the bearded hipster Indy twats.

I don't buy games because I want them to look shit, fuck off back to your cereal cafes on the left bank of Shoreditch, 8 bit cunts.

You, and your poxy bearded single geared 8-bit tight jeans.

[/iOS gaming rage]
 
Wow!!! Thank you so much for your quick reply. I think I got the idea! One question appeared in my mind. Is it possible to convert pixel graphics into the vector one and on the other way round?

You can save a vector project as a bit map / jpeg which will immediately rasterise it.

The other way round isn't as easy. Vector Magic does it and is brilliant. Not sure if it's commercially available any more.
 
Thank you, got the idea! What about the graphic format? I assume it is different for pixel and vector graphics. Am I right?
 
Or .pdf - a file that's been created in Illustrator and saved as a .pdf can be opened up in illustrator and edited again . . . sometimes, if you're lucky, just changing the suffix at the end of the file name (you'll be given a warning "Do you want to do this" or similar) and the file logo changes from a pdf logo to a ai logo and, certainly on a Mac you'll be able to open it up

aileen - what's the "end usage" going to be that's probably the most important question as to what format, and resolution (for raster) you'll need - if you don't know yet and you've got a raster file then bigger is better, you can always down resolution the file but once the resolution is gone, it's gone
 
Guys, thanks for the graphic format explanation. Well, now it became more clear but still have some questions. I found a good summary about graphics and they spoke about rasterization too. They mentioned that there are two ways to do it: manually and vectorization programs, like Xara Xtreme etc. Which way is better? Manually or with a program? Btw, there is a useful table of graphic formats. Maybe it will help to someone non-professional like me:D
 
It all depends on what graphic you're working on, what it's intended for and personal preference also. Just get stuck into something; you'll learn as you go.
 
Guys, thanks for the graphic format explanation. Well, now it became more clear but still have some questions. I found a good summary about graphics and they spoke about rasterization too. They mentioned that there are two ways to do it: manually and vectorization programs, like Xara Xtreme etc. Which way is better? Manually or with a program? Btw, there is a useful table of graphic formats. Maybe it will help to someone non-professional like me:D

It's best to do it manually if possible. This logo is a good place to start practising with the pen tool. Create a layer in illustrator, lock it, create a new one and start making points, converting them to curves where necessary.

nike.png
 
A lot depends on what your end goal is and what you're starting with, and what software you've got (and to a lesser extent now, what hardware you've got access to, e.g. a scanner?)
 
The easiest way to get your head around vector as opposed to raster is to understand how a computer reads the file formats differently.

All graphic files are rendered from left to right, line by line.

Imagine you have a grid of 100 x 100 pixels. Top left corner being 0 x 0, bottom right corner being 99 x 99.

Raster files will (generally) process by reading pixel 0 x 0 = red, 0 x 1 = green etc. JPG (and some other raster file formats) will bunch coordinated blocks of pixels together. 0 x 1 to 0 x 36 = red. This equates to a smaller file size and faster processing/rendering, but some loss of detail.

Vector files use equations which will adapt to a percentage rather than pixel x pixel. Over simplifying, but a vector file will measure the coordinates of the vector making for a much smaller file size if the graphic is a simple line drawing. 0 x 0 to 0 x 20 + 1 x 1 to 2 x 20 + 3 x 20 = black. Rather than the computer having to process pixel by pixel, a single equation will render a greater percentage of the image. For vector think 'percentages'. For raster think in 'pixels'.

A pixel is a finite thing - a vector, or 'percentage' is infinite. You can't stretch pixels without harming them. Vectors will stretch forever!

If you want to create, or output images with complicated graduations, or photographs stick with raster formats. For line drawings and simple graphics, go with vectors. That said, there are some very impressive vectors artists creating incredibly complicated illustrations.

If you want to have a simple play at converting one to the other, get yourself an old copy of Macromedia Flash - an animation tool highly underrated for its graphics ability. Import a photograph and play with 'Trace Bitmap'. You will soon get a good understanding of the difference between each basic format.

There are also hybrid formats which will render both as vector and raster, but they aren't really worth exploring unless you are seriously concerned about processing limitations.
 
The easiest way to get your head around vector as opposed to raster is to understand how a computer reads the file formats differently.

All graphic files are rendered from left to right, line by line.

Imagine you have a grid of 100 x 100 pixels. Top left corner being 0 x 0, bottom right corner being 99 x 99.

Raster files will (generally) process by reading pixel 0 x 0 = red, 0 x 1 = green etc. JPG (and some other raster file formats) will bunch coordinated blocks of pixels together. 0 x 1 to 0 x 36 = red. This equates to a smaller file size and faster processing/rendering, but some loss of detail.

Vector files use equations which will adapt to a percentage rather than pixel x pixel. Over simplifying, but a vector file will measure the coordinates of the vector making for a much smaller file size if the graphic is a simple line drawing. 0 x 0 to 0 x 20 + 1 x 1 to 2 x 20 + 3 x 20 = black. Rather than the computer having to process pixel by pixel, a single equation will render a greater percentage of the image. For vector think 'percentages'. For raster think in 'pixels'.

A pixel is a finite thing - a vector, or 'percentage' is infinite. You can't stretch pixels without harming them. Vectors will stretch forever!

If you want to create, or output images with complicated graduations, or photographs stick with raster formats. For line drawings and simple graphics, go with vectors. That said, there are some very impressive vectors artists creating incredibly complicated illustrations.

If you want to have a simple play at converting one to the other, get yourself an old copy of Macromedia Flash - an animation tool highly underrated for its graphics ability. Import a photograph and play with 'Trace Bitmap'. You will soon get a good understanding of the difference between each basic format.

There are also hybrid formats which will render both as vector and raster, but they aren't really worth exploring unless you are seriously concerned about processing limitations.

Thank you so much for this reply!!! Well, to be honest, to get all things I read it five times and googled a lot, but i did not get how vector files adapt to percentage? Would you mind to give an example, please?

Btw, I think to start with the manual first.
 
The easiest way to get your head around vector as opposed to raster is to understand how a computer reads the file formats differently.

All graphic files are rendered from left to right, line by line.

Imagine you have a grid of 100 x 100 pixels. Top left corner being 0 x 0, bottom right corner being 99 x 99.

Raster files will (generally) process by reading pixel 0 x 0 = red, 0 x 1 = green etc. JPG (and some other raster file formats) will bunch coordinated blocks of pixels together. 0 x 1 to 0 x 36 = red. This equates to a smaller file size and faster processing/rendering, but some loss of detail.

Vector files use equations which will adapt to a percentage rather than pixel x pixel. Over simplifying, but a vector file will measure the coordinates of the vector making for a much smaller file size if the graphic is a simple line drawing. 0 x 0 to 0 x 20 + 1 x 1 to 2 x 20 + 3 x 20 = black. Rather than the computer having to process pixel by pixel, a single equation will render a greater percentage of the image. For vector think 'percentages'. For raster think in 'pixels'.

A pixel is a finite thing - a vector, or 'percentage' is infinite. You can't stretch pixels without harming them. Vectors will stretch forever!

If you want to create, or output images with complicated graduations, or photographs stick with raster formats. For line drawings and simple graphics, go with vectors. That said, there are some very impressive vectors artists creating incredibly complicated illustrations.

If you want to have a simple play at converting one to the other, get yourself an old copy of Macromedia Flash - an animation tool highly underrated for its graphics ability. Import a photograph and play with 'Trace Bitmap'. You will soon get a good understanding of the difference between each basic format.

There are also hybrid formats which will render both as vector and raster, but they aren't really worth exploring unless you are seriously concerned about processing limitations.

Wow. Brilliantly geeky explanation :)
 
Thank you so much for this reply!!! Well, to be honest, to get all things I read it five times and googled a lot, but i did not get how vector files adapt to percentage? Would you mind to give an example, please?

Btw, I think to start with the manual first.

I wouldn't worry too much about all the technical stuff in that post at this point, though it is very interesting. I've been in the graphics industry 20 years and didn't know half that stuff ;)

Vectors are basically better once you've got your head around them. Illustrator is a magnificent piece of software. Torrent it or shell out 30 quid a month or whatever they're fleecing people for these days.
 
Well, to be honest, to get all things I read it five times and googled a lot, but i did not get how vector files adapt to percentage? Would you mind to give an example, please?
Vector graphics are mathematical definitions of shapes. A simple example would be a circle. To draw a circle you just need to know two basic things: the centre point and the length of the radius. And then to style the circle it need just a couple more bits of information: the width and colour of the line to draw the circumference and whether the circle has a filled colour in the centre or not.

When you draw a circle in a vector graphic programme it uses this simple bit of maths to draw a circle using the centre point and the radius. If you change your mind about the size of circle you want and scale it by any amount (either a set distance or a percentage) the programme redraws the circle at the new size. The same thing happens if you zoom in to look at a section of the circle.

Other shapes work in exactly the same way, although the more complex the shape, the more complex the maths becomes to define it - but computers handle these bit of maths with ease.

There's a good description of the difference between bitmap (raster) and vector graphics with working examples on the BBC GCSE website:

BBC - GCSE Bitesize: What are bitmap graphics?
 
Last edited:
Back
Top Bottom