dimka.com > Bitmap Image Editing Part 2 (Part 1)

Bitmap Image Editing
and Some Tips for Adobe PhotoShop and ImageReady - Part 2

PhotoShop vs. ImageReady

If you need to edit or create new icon, button, illustration or photograph and can't decide what to start ImageReady or PhotoShop you should boldly go for PhotoShop, especially if you have version 5.5 (or later). Version 5.5 let you do many things in PhotoShop that previously were available in only ImageReady. However if you need to create imagemaps, GIF (or even PNG) animation, slices and other HTML-Graphic elements you will have to use ImageReady. PhotoShop defiantly has more tools and common tools have more options and capabilities. Also you always can jump from one program to another and use smart saving wizard to keep track of your changes. Also if you think that you'd need to work a lot with type you want to start with PhotoShop too.

 

Animation

You have to have animation palette open. (Menu - Window - Show Animation)
Most likely you want to use it on the wen thus want to keep size of the file as small as you can. They best way to do it without any quality degradation is to use background and animate only moving parts instead of whole frames. Another decision you have to make is whether it will be an "infinite" loop or it will pay once and stop. At the same time you want to think about pauses and timing. It's common to set timers at the end of the animation, but often it's not the best solution, you may also consider to include pause in the very beginning to get smooth playing if your animation is big.
Once you have an idea how you want to play you can start animating. You don't have to use many layers, but you will get a better result if you will. When you create new frames, you can move layers around frame to frame and their position will be remembered in each frame, but if you edit a layer the change with be distributed to all frames where this layer is visible. If you think about simple motion like depressed button you'd be better off by using Rollovers. Image ready can write code for you as well, but you may want to check it by hand afterwards.

 

Imagemaps

Imagemap can really simplify you HTML if you want to have a complex controls layout and want to control the look of the whole page especially if you are not too constrained by speed of download. In ImageReady you can mark layers as areas of the map and assign URLs to them simply by clicking on it in the Layer Palette. However it often may not be the optimal thing to do. For example if you have work "Products" and add that layer to a map, only actual letters will be mapped and not the space between them. It complicates HTML and make it harder to click. It would be much better if you create a rectangular on the separate layer hide it behind background and use it for the map. Also you want to avoid polygon maps, or at least keep simple polygons. Often it's better to use two or three rectangles instead of a complex polygon. Do not forget that name of that layer becomes ALT test in the HTML.
New version of PhotoShop does not loose imagemap information if you open and save PSD file originally created in ImageReady, but older version (even 5.02) will loose all or almost all information that is not supported in PhotoShop itself, so be careful.

 

Making Selections in complex images like photographs

Zoom (Z) is a very useful tool, but try using it in round numbers like 400% and not like 384%
Then you can rely on good verity of selection tools, like rectangular and circle Marquee (M) tool, MagicWand (W) and Lasso (L). Pay attention to the anti-aliasing option for the tools you use. Sometimes you want it and sometime not. Combination of tools let you create complex selected areas, feel free to save selections. Magic Wand is very useful tool if you know how Tolerance works.

Go to Part 1