Exporting High Resolution Images with Zoomify

Monday, September 08 2008

High Resolution images are becoming more and more popular and easier to create, but the Web isn't really keeping up. With transfer speed limitations, it's not as logical for us to display hi-res images as easily as we may want to. PhotoShop have added a feature into CS3, with the help of Zoomify, that will allow us to export hi-res images and display them on our web site. The process makes use of Adobe Flash Player to display the hi-res image with the ability to zoom in on different areas. This allow the loading of the hi-res image as needed.
In this tutorial, we will look at how we can export a hi-res image using Zoomify.

If you're ever in the market for some great Windows web hosting, try Server Intellect. We have been very pleased with their services and most importantly, technical support.

We will start with the following high resolution image:

This image is 1698 x 1131 pixels, so would be too large to load onto a web page. We will use Zoomify to export it. Goto File > Export > Zoomify. We are presented with a dialogue which looks complicated, but really isn't. From Template, choose Zoomify Viewer with Navigation (Black Background). Give the image a Base name, which will be used as a naming convention for the images (Zoomify/PhotoShop will split the hi-res image up into smaller, more easily-transferable tile images.


[Click to enlarge]

Once we press Ok, if we chose the Open in Web Browser option, we will be greeted with the Zoomify Viewer, which allows us to pan and zoom the hi-res image:

We are using Server Intellect and have found that by far, they are the most friendly, responsive, and knowledgeable support team we've ever dealt with!

Download Project Source - Enter your Email to be emailed a link to download the Full Source Project used in this Tutorial!



100% SPAM FREE! We will never sell or rent your email address!
 

Guys, please take a look at Server Intellect for Windows Web Hosting. I'm very pleased. You will be too. Take a look and see for yourself!

Comments

Monika said on 08/26/2009 at 10:45 AM

This is cool tutorial:)