MIcrotech Redesign- Pg6- Giordan On Graphics | WebReference

MIcrotech Redesign- Pg6- Giordan On Graphics




Microtech's products are not what you would call cosmetically exciting. While they may be functional godsends to photographers and systems engineers, visually they're neutral colored boxes with cables and buttons. On the home page, these boxy product shots were used as buttons, although they were created four times too big, and used in place of a text link that would have been smaller and easier to use. Images were occasionally dark, and file sizes tended to balloon too high. I shrunk these images down, cleaned them up, and created consistency by adding a drop-shadowed circle with a glowing rollover. The final size of each image was around 1KB.

The main graphic on the home page was created using Photoshop filters and blending modes, and did a pretty good job of maintaining product identity while injecting a bit of aesthetic interest. I carried this approach over to the second level department pages, creating a square graphic that combines elements from the relevant section into a high tech montage. Microtech liked the fact that the images convey a high tech look, while functioning in a straight forward, professional context.

To make the images more functional, I added image map links to the lower sections of the site. In this case the text is clearly a button that can be accessed, which is not always the case with some image maps that disguise their functionality. Each image was held to 20KB or less, with each page weighing in around 30KB as a whole.


Next page...

URL: http://www.webreference.com/graphics/
Created: Dec. 27, 1998
Revised: Dec. 27, 1998