Editing Images

This tutorial assumes that you have an image editor and offers some specific tips for using your image editor to improve the quality of the images in your store.  

A couple of other things to consider when preparing images for the Internet are the color, the orientation of the image and the amount of compression.  Particularly when you have images that are scanned, there can be quite a bit of color loss. And lighting affects the images if you are photographing them. You may want to read the tutorial on taking good pictures. Its more oriented towards 3-d objects than flat ones, but there are some useful tips that apply to ALL images, not just ones that you are taking pictures of. 

You may want to follow this tutorial by using your image editor and doing each step.  To get a copy of the image that we're discussing, click here.

1. Orientation: In the original image, the picture is slightly rotated.  A lot of people don't notice this any way other than subliminally, but will find it more attractive if a rectangular object is squarely aligned on the page.  So the first step is to rotate the item until its squarely aligned with the edges of the frame.  In this case, the image was rotated your item 4 degrees CCW so that it was square on the page.

This particular image has another serious problem  which could have been avoided if the picture had been taken from directly in front or above the object (see the tutorial on taking good pictures).  The problem becomes evident when we try to crop the image and make it square.   We're seeing a perspective view and it would look better if this image were square.  Unless you have Photoshop or some other high-end editing tool (and you are comfortable using them). the best choice at this point would be to stop and take the picture again and get it square (note, also, if you have a scanner that the easiest way to get a good image of a flat object like a magazine may be to put it in the scanner rather than to take a photograph!  Scanners can be used effectively to capture images of small 3-dimensional objects also.  See the tutorial on using scanned images for more detail on this process.

If you have an image that looks like that above, the perspective effect can be corrected during editing.  Not all image editors can perform the operation described below, but if you have Photoshop, you can correct this with the edit operation:  a) use the 'select' menu option to select the image b) using the 'edit' menu option, sub-option 'transform' and use the 'perspective' option to adjust the image so that the image is square with the frame.  c) after the right and left sides are straight, use the 'skew' option to adjust the upper right corner so the image is straight.  Crop the image edges as you wish.

2. Color: The original image was not photographed in very bright light and looks quite different from the original,.  Look carefully at your item.  Look at how your image appears.  Is the color realistic?  In this case, it does not, so we need to adjust the image to make it look more like the original. I used the 'curves' operation in Photoshop. This is an operation that increases the apparent saturation and brightness of an image. You can get equivalent results from many imaging packages by separately increasing the saturation and the contrast in an image. Particularly where you are dealing with something like comic books, its a very good idea to look at the color and see if the image on your monitor is similar to the physical item.

3. Focus/Sharpening: If your image looks fuzzy, it may benefit from using the 'sharpen' operation to improve the clarity of your image. 

Note also that if you have a large fuzzy image, that presenting it in smaller format (and using the sharpen operation) may result in a much clearer image.  Although its generally advisable to use larger images, if the large image is fuzzy and there's no way to get a sharper picture, the smaller, clearer image may prove more attractive:

Which image do you find more attractive?

Same image after reduction and use of the 'sharpen' operation.

4.  Saving your work: When you save a JPG image, you generally get a chance to specify a compression level. If you use the least amount of compression, your images will look best. Furthermore, if at all possible, do not store your image originals as JPGs unless there is absolutely no other option. If you do, each time you save them, they are recompressed and successive recompressions will cause the images to become quite wavery. This effect is called 'JPEG creep' and can become very noticeable:

The image on the right was saved as a low-compression jpg and retrieved and resaved a few times.  You can see the amount of distortion and detail loss very clearly.  Most imaging packages will allow you to save the file in a lossless format (like PSD or TIF) and this is a good thing to do with your originals if you have enough disk space.  Or save it on CDR.

Click here to view ALL the help topics

Shops | NEW! Become an Affiliate | Advertise | Security | Privacy | Terms of Use | Question/Problem | Site Map
© Software and site design copyright 1995-2017 All rights reserved.