Elfwood is the worlds largest SciFi & Fantasy community.
  - 152366 members, 4 online now.
  - 12794 site visitors the last 24 hours.

 

 
 
 

Fantasy Art Tutorials in the FARP Section

Saving pictures, file formats

By :-) Thomas F Abrahamsson

Index:

Picture compression

First, to know the background, I'll give you some info on computer pictures:

Without compression, picture files are huge. This is because a computer picture consist of millions of tiny little dots called pixels. A normal picture easily consist of over a million of pixels, and each of these pixels has a colour.

There are three generally used ways of saving pictures:

Uncompressed (non-destructive)

This way of saving images produce files. It simply takes each and every dot on the picture and saves down the colour value in one, large queue of pixels. The BMP format found in Windows uses this way of saving, that's why the BMP files are so big.

(There is a workaround in BMP called RLE, run length encoding. RLE is a simple compressing algoritm to shrink file sizes a little. Basically, it find repetitions of similar pixels in the queue i just mentioned. Instead of writing down 200 red pixels (Like 'red pixel, 'red pixel', 'red pixel', and so on 197 more times) , it says 'Here are 200 pixels. They are red'.) In all cases, this is non-destructive, which means that the exact picture is saved, and once you load the picture again, you will get that very same picture back, each pixel unmodified.

 

LZ Compressed

LZ is a well known algoritm for compressing data. It's usually very effective when it comes to written text, and variations of LZ is used in most popular file compression utilities found, like ZIP, ARJ and SIT.
GIF and TIFF uses LZ compression for making picture files smaller. The LZ algoritm is non-destructive, so the picture you get from packing up a GIF, is exactly the same as you saved down.
Compared to RLE (mentioned above) LZ uses bit trees to pack data more effective.

Destructively Compressed

JPEG and MPG are examples of destructively compressed pictures. A JPEG picture is saved in a quite complicate format, which takes in mind the human eye and perception. Things that are not very visible, are removed when saving, and then approximately re-generated when reloading the picture.

 

Bit depth, short intro

The larger bit depth, the bigger files and nicer pictures.

Bit Depth Colours
1 2
4 16
8 256
16 ~65000 ('High colour', Thousands of colours)
24 ¨16.7 ('True Colour', Millions of colours)

Most scan programs produce pictures in 24 bit plans (16.7 million colours).

JPEG or GIF?

Generally speaking, JPEG is the better option. With some exceptions (see below) a JPEG picture can get smaller and more effective. JPEG is constructed for packing photos and such, so its ideal for painted pictures as well! If you don't know which to chose, chose JPEG. (See below for hints on how to make effective JPEG pictures)
What about GIF pictures then? Well, these are often used on the web for a number of reasons. The main ones are:

At Elfwood, there is no need for transparent backgrounds, so this is right out. If you have an animated scene, you have to chose GIF though, so that one is clear. But what about quality and size then?
Well, if your picture contains only a few, distinct colours you can usually save it as a GIF and gain some size! If your picture is black and white, (lineart) you can also save it as GIF and gain some quality and kB's. So, that's basically it: Black&White line art, and small pictures with few colours. Otherwize, use JPEG for Elfwood. Conclusion:

- Why not PNG, BMP or TIFF or....?
Simply because I can't handle them correctly, nor can the majority of the browsers. Convert to JPEG or GIF before you send me. At Home: You can use any format you want! Remember that most web browsers only support GIF or JPEG though...

How to make smaller JPEG pictures

If you save and reload a JPEG picture many times, the quality of the picture will get worse and wose, so NEVER EVER use JPEG as your working format. This will eventually result in unusable material.

- So, should I ever use JPEG then?
- yes, it is a very effective packing format, which generates very small, and indeed good looking pictures, for example for the web. In most cases, JPEG is the best choice. (See chapter below for a discussion on this topic...)

- What is this 'quality factor' then?
- When saving a JPEG, you can actually tell how much data that should be removed. If you remove too much, the picture might appear a little blurry and squary at some places. If you remove too little, you will end up with huge files anyway.

- Why bother about quality anyway?

- So, what image quality shold I have at my JPEG pictures?
- When saving a JPEG, you can chose how much you want to pack it (ie, how much information to remove).


Maximum quality.
Size 27608 bytes.

'High' quality.
Size 16608 bytes.

'Medium' quality.
Size 10948 bytes.

'Low' quality.
Size 8235 bytes.
The picture above is © Thomas Abrahamsson

 

 

So, what happens with my picture?

Let us compare the two most extreme cases, the absolute minimum compression (Often called Max quality) and the most extremely violent compression (Min quality). Normally you use something between those two (Medium quality), I use these two to illustrate the destructive compression though:


(Above) This is the picture saved with minimal compression (max quality), As you can see in the zoomed up area, things are sharp, clear and fine. However, this picture is very very large in KB count: 51 KB.


(Above) This other picture illustrate the worst case scenario with JPEG (Minimum/Low quality). If you look at the zoomed-up area, you will notice that the picture is blurry. This is what JPEG can do to your pictures, if you chose maximum compression. So, use some medium compression value instead, and those blurry areas will not be as visible to the eye as in this example. The only good thing with THIS picture is that its extremely small in KB count: 9 kB (!).


(Above. Finally, This is the same picture examined. This time its saved with a medium degree of compression. As you can see, Its not very blurry (not visible if not zoomed up like this) and file size is decent: 21 kB.

So, How do I save a jpeg image in this medium quality then?

That depends on your paint program. Some basic paint programs does not include this option. However, Paintshop pro (mentioned below) is avalable for download on the Internet and is recommended!
Here are some examples for three major programs:

Photoshop 3

Photoshop 3 screen shot

The above screenshot is taken from Photoshop version 3 on a Windows Machine. In Photoshop 4 you have more control to change the quality setting, while version 3 only support these four predefined values.

 

Paintshop Pro

Paint shop Pro screen short

Quality is called compression level. The paintshop pro manual says: 'Compression Level.
The compression level controls the amount of data compression applied to the image. The higher the number, the smaller the files, and the greater the loss of data. '

 

  1. Select image type to 'JPEG - JPEG - JFIF Compliant'
  2. Press the options button
  3. Lower compression level.

Photoshop 4

Photoshop 4 screen shot

Photoshop 4 gives you more control!

 

David Östman shares some hints:

'I have noticed that when it comes to JPEG and pencil art, you can save the image using the lowest quality (i.e. highest compression) without losing any quality or details whatsoever. I use Photoshop 4.0 and chose Quality 0 (zero), and as far as I can see there is no difference from 10, except for the size of the file.

I once took a GIF pic from the gallery, 101 kB, saved it in JPEG format in Quality 0, and it ended up as a 36 kB file. I then compared the two of them, and there was no difference at all. Same quality, same everything. Just 65 kB smaller...'

Some final notes:

As Jpeg actually modifies the picture, destroying it a little, you should never work with JPEG pictures. When you do digital painting, or something like that, always save the picture as TIFF or some other non-destroying format. If you load and save from a JPEG file several times it will get more and more blurred... When you are DONE with your changes, and ready to upload the picture to Lothlorien, first then you save a copy in JPEG format, and upload that copy (keep the original).

 

 

What if I want transparency?

If you want a colour transparent, you have to use the GIF format, as JPG doesnt support this feature.

 

 

How do I check how big the resulting file is?

To see the current file size, you shouldn't look at the file size information in your paint program. This one displays how big the file is WITHOUT any compression at all. You must go to the windows explorer (windows) or finder (mac) and look at the actual file sizes there.

About GIF

First of all, GIF is suitable for line art, and images with large areas of similarly coloured areas, or with a limited number of colours. This is due to the way the GIF standard works. For 'photolike' pictures, JPEG is a better choice. Gif isn't destructive.

In Photoshop, when going from RGB mode (true colour / 24 planes / etc) to INDEXED colour you can specify how many colours the new image should have. The less colours you allocate, the more grainy picture... but, also, less storage size. The smaller the picture, the faster download for all the modem users around. Most GIF's look excellent in just 96 or 120 colours.

 

In photoshop, it look like this:


(above) We go from RGB mode (which is default) to Indexed colour. This gives us a palette with a fixed number of colours. The RGB picture can contain 16.7 million different colours, so in some way, the paint program has to compensate for this. This is what the dither option tells us. Try the different modes to see the difference. Normally, GIF's pack best if you choose 'none' at the dither option. (see below)

For a table on color depth <-> number of colours, look at the beginning of this article!

...in Paint shop pro, it look like this:



This is about the same as in Photoshop. You chose X colours, and enter (in the box (see below)) how many colours you should head down to:

Marie (valkyrie@earthlight.co.nz) has a useful hint to share:
'I have a useful little hint for those resizing pics with Paint Shop Pro.. especially those pencil drawings with fine outlines.. instead of doing a straight resize, I found it much better to go to the image selection and choose RESAMPLE, choose size specs and that way less information(detail) is lost! then go and do greyscale(256 shades) and then decrease colours down from there(I went to >16)! :) (this is for those saving in GIF format)'

 

Quality comparison, different No of Colours

Ink and charcoal pictures can be reduced to some 8 or 16 colours without losing any quality. A standard GIF is 256 colours, and going down to 16 makes the file much smaller. Have a look at this normal colour picture first:


256 colours
Size: 28483 bytes

128 colours
Size: 23141 bytes

64 colours
Size: 19488 bytes

32 colours
Size: 15903 bytes

16 colours
Size: 11863 bytes

8 colours
Size: 8886 bytes
The picture above is © Thomas Abrahamsson

Apparently, we can go down to 64 or even 32 colours without loosing too much in visible quality. Note that this is a photo-like colour image which normally best packed with JPEG. If we do the same thing with a black and white ink picture, things are even better. Line art type of pictures (as mentioned before) are very suited for GIF's ability to save in less colours. Just have a look at this example, and see what I am talking about:

 

The first picture is an ink picture saved with 256 colours, this making it 23 kB in size. The second one is in only eight (!) colours, making it 9 kB in size! Can you see any difference? I can't...

About PNG

PNG files nearly always use file-extension 'PNG' or 'png'.

Portable Network Graphics (PNG) is a pixel based image format that uses non destructive (lossless) compression. It was created to improve upon and replace the GIF format, as an image-file format not requiring a patent license.

PNG supports both palette-based (palettes of 24-bit RGB colors) or greyscale or RGB images.

The motivation for creating the PNG format came in early 1995 when it came to light that the LZW data compression algorithm used in the GIF format had been patented by Unisys. Some other problems with the GIF format also made a replacement desirable, like the limitation to 256 colors.

At the time of writing, Elfwood doesn't support PNG even though we plan to do it... real soon :)


FARP Article Guestbook

DateNameComment 
10 Jan 200845 Pablo Luna
File formats
http://www.fileformat.info/

BMP
http://en.wikipedia.org/wiki/Windows_bitmap
JPG
http://en.wikipedia.org/wiki/Jpg
GIF
http://en.wikipedia.org/wiki/Gif
PSD
http://en.wikipedia.org/wiki/Adobe_Photoshop#Features
PNG
http://en.wikipedia.org/wiki/Portable_Network_Graphics

FREE TOOLS

GIMP (Image editing software)
http://gimp-win.sourceforge.net/stable.html
You need to download and install GTK+ environment and GIMP
Tutorials
http://www.gimp.org/tutorials/

3D TOOLS
Anim8or (3D modeller)
www.anim8or.com
Tutorials for newbies:
Lesson 1
http://www.orbithangar.com/searchid.php?ID=2729
Lesson 2
http://www.orbithangar.com/searchid.php?ID=2730
Lesson 3
http://www.orbithangar.com/searchid.php?ID=2731
10 Mar 200845 Vera Franks
What type of disk do you use to make copies of you pictures? I am very new at this and have tried to save on a CD and a DVD. I get messages saying ’cannot be saved on this disk’ So what kind do you use, there are so many out there I need someone to tell me exactly what I need. Thanks, Vera

:-) Thomas F Abrahamsson replies: "I use a backup external USB disk, works like a charm!"
21 May 2008:-) Amber mccain
how do you upload the pictures into the site? i know that probably sounds like a stupid question but i am not used to this. this is the only site to ever intrest me enough to get on it so i have no idea how to do any of this.

:-) Thomas F Abrahamsson replies: "See http://www.elfwood.com/quickguide.html"
22 Jun 200845 Martha roy
please tell me how to save mpictures and if costs anything martha roy

:-) Thomas F Abrahamsson replies: "Its all up to your set up (do you have a computer? any software? a Scanner?) - most likely though, nothing will cost u anything"
28 Jun 2008:-) Linia (cowlover) D.
Can you please help me: my drawing was too big, and i still don’t understand how to shrink it. I’m very new to this and i’m not that good with computers! Can you please help me?
3 Jul 2008:-) Nimia Alexandra Geerman
I also need help with this, my picture is too big, and i don’t know how to do it
24 Sep 2008:-) Anthony M. Trujillo
how do i upload the pictures?
24 Sep 2008:-) Anthony M. Trujillo
o nvm >u<
25 Feb 2009:-) William Lucius Appaloosius Steinmayer
Whatever happened to the ’Resize’ button on the Extranet? I resized the picture on my scanner software, as I had always done, and it still comes out way too big........
10 Mar 2010:-) Doxy R Devon
Useful! Thanks!
Page: [1] 2 3 4 5 6 7 8
Not signed in...

   Private message?


Back to the FARP main page.


The collection of art and writing tutorials in the Elfwood Fantasy Art Resource (F.A.R.P.) is a part of Elfwood.
The FARP logo was created by :-) Miguel Krippahl (The muscular guy in the FARP-logo) and :-) Thomas F Abrahamsson (The text and general graphic design). Those sections written by volunteers are copyrighted to Thomas Abrahamsson and the respective writer. Elfwood is a project once founded by Thomas Abrahamsson.

All rights reserved. Unauthorized Reproduction of the graphics, writings, and materials on these pages is absolutely prohibited! You may consider all material on these pages protected and copyrighted, unless otherwise noted. You may NOT use the images found at the FARP or Elfwood pages on your home pages! All of these images are copyright protected! Everything you see here represent the collaborative effort of the Elfwood community and Thomas Abrahamsson. Please read the Legal Disclaimer for more info on warranties/etc for these pages!

 
 

Elfwood™ is a site for Fantasy and Science Fiction art and stories. The site was founded by Thomas Abrahamsson and is maintained by helpful assistants and moderators, owned by the Elfwood AB corporation.

[More...]