Web gallery tools : Part 1 – Galerie (it’s easy and it’s free)

February 9, 2008

One of the things I really like about what I do for a living is that I get to learn new things, and enhance the skills and knowledge I acquired in two decades of high tech employment. I also get to share what I’ve learned, or the tools I’ve discovered, with end users who want to learn how to do things on their own.

I’ve had a lot of opportunities to explore Web gallery and slide show software, and I use a variety of tools for different clients. Some clients want to be able to create, prep, and update their own portfolios, and I am always delighted to see a client who doesn’t necessarily feel very technical get comfortable with tools that empower them to do things for their own Web sites.

In that vein, here is the first of some tools that will differ in both technology and output, but that deliver good-looking and user-friendly portfolio Web galleries/slide shows, even for the novice user.

Galerie is a winner for Mac OS X users (the Web site says 10.2 to 10.4) who don’t have PhotoShop or who want something simpler and more easily customized than PhotoShop’s Web Gallery capability. I am running Galerie on an Intel-based iMac with Mac OS X 10.5.1 (Leopard), so it is compatible with newer versions of the Mac operating system. Available for free download in a universal binary (runs on both PowerPC and Intel-based Macs), Galerie works with iPhoto and a set of customizable templates to generate Web galleries and slide shows with index pages and individual image enlargement pages. The viewer can click any thumbnail on the index page to see a larger image displayed in a page with the same layout. Once in the pages, the viewer can run a slide show or page through the images. You can also create a slide show in which clicking on a thumbnail opens an attractive little matching popup window with the enlargement. Links to examples of both are below.

In iPhoto, you simply create an album, import the images you want in the slide show, iphoto_info.jpguse the information box in the lower left of the iPhoto window to open the Information input fields (see right), and enter whatever title (name) and caption (description) you would like to have show up on your generated pages. (Including this information is optional, but a nice way to label your thumbnails and describe your larger images). Here is something else that you can do that you can’t do with PhotoShop’s automated Web Gallery: in iPhoto, you can rearrange the images in any order that you want and Galerie will follow that order. You can even edit the images in iPhoto as you go.

After you have your iPhoto album set up, info added, and images ordered, launch Galerie. iPhoto and Galerie work together implicitly, so leave iPhoto open, make sure that the album you want to generate a slide show for is open, and that either all or none of the images is selected. (If you select a subset of images, your slide show will contain only those images. You might prefer to do this, but don’t do it by accident or you’ll have to regenerate the Web gallery in Galerie to include all the images that you want.)

In Galerie you will have a multitude of options for layout (number of columns and rows), thumbnail and image sizes, whether to include the title and comment (from the info you entered in iPhoto), and, most important, the template that you want Galerie to use. If you choose to have popups instead of pages, you won’t be able to choose the slide show option that gives the user the choice of paging through your Web gallery or running a slide show. [Note that the “paging” is transparent; the image changes, but the user can’t tell they are moving to a new page because all of the image pages appear inside a frame on a single page.]

The Galerie interface is so simple that I won’t describe all of it here. I will just say that you should not enter an image size for the full-size pics that is bigger than the largest dimension, in either direction, of your original images from iPhoto. You should also save your web gallery setup in Galerie by name. Just click the Open setup drawer button and click the Add button to save the gallery you are working on. When you use Galerie again, you’ll have all your settings saved in a gallery and can access it in the drawer.

The Galerie window is shown below; click it for a larger view:

The big choice here is what template to use. Because Galerie is so fast, you can experiment with a variety of templates and keep on generating shows until you get the one you want. When you click the Generate gallery button, Galerie will prompt you for a location where you want the generated files to go. You’ll also have the option to add to a folder you’ve already used, or to overwrite the existing gallery files. Everything you need to either run your Web gallery from your desktop, or upload to a server is created for you in that folder, including the navigation buttons and the stylesheet (CSS file) that dictates what the index and pages will look like. To keep things organized in my destination folder, I check the “Create in separate folders” option.

I’ve generated two Web galleries to show you what some possibilities are:

Using the “Carbonized” template, I created a Web gallery with pages, and 4 columns by 6 rows on the index page (since I would have 24 images in my show). I also added a text watermark because these are my photos, albeit vacation images, and I don’t want them downloaded for other uses without a copyright mark. I entered just a few titles in iPhoto for the first bunch, just to show you how titles appear beneath the thumbnails and large images.

Using the “Anthracite shadow” template, and the same iPhoto album, I also created a Web gallery with popups.

Notice on both of these Web galleries that there is a credit line and link for Galerie under the content–”Generated by Galerie”. Your Web gallery will not work if you delete that line. And why bother to subvert the credits when you have a free tool that is fast and easy to use and comes with dozens of free templates.

From these examples you can see my bias is toward simple and clean layouts. The templates offer a lot of variety, including many with colors and various graphic motifs, and you can easily add more by clicking the Download more templates button within Galerie. (In fact, I have added so many that I don’t recall if my demos below use standard ones or ones that I added.) Choose the templates you like from your downloads and drag them to the Galerie Templates folder within the Galerie folder. I installed Galerie in the Applications folder, so on my iMac that folder is Applications/Galerie/Galerie Templates.

In truth, when I use Galerie, I modify the existing templates and save them under a different name in the Galerie Templates folder. If you choose to create your own templates from the available ones and you put them in the correct folder, they will be listed in the pulldown menu next to Template. If you edit these templates on your own, you should know what you are doing with HTML files and with fields in the file that are used to insert generated items (i.e., don’t edit anything with $ signs around it, e.g. $TITLE$). (You might have to close and reopen Galerie for the added templates to be listed in the pulldown menu.) Alternatively, you can edit the generated files themselves, just be sure to move them to another folder or else select a different destination folder when you generate another web gallery or else you will overwrite your hard work. It is best to modify a template you like and save it under a new name in the Galerie Templates folder; then your changes are permanent and can be used for other Web galleries.

You can see how much you can change a template to suit you at the Web site of artist Aaron Schuerr. The templates for his Web galleries were customized from Galerie templates to match the rest of the Web site, including the site’s main menu. With Galerie installed, the customized templates, and iPhoto, Aaron generates his own Web galleries when he has new images for his portfolio.

To download Galerie, go to www.myriad-online.com/en/products/galerie.htm.
To get acquainted with the Galerie software before you download and install it, check out the user guide at www.myriad-online.com/resources/docs/galerie/english/manual.html. Help is also available from within the Galerie window; just click the ? icon.
To see more templates available for free download, go to www.myriad-online.com/en/products/galerietemplates.htm.

Galerie is truly easy for the novice user who has the good fortune to be using a Macintosh, and strong enough for a Web designer who can do some customization. Experiment with it and have fun!


Next part (coming soon): Using Flash with SlideshowPro. This is a more sophisticated approach, but it has some dependencies. For one thing SlideshowPro Director has to be installed and used on a server, and it requires Flash. If you have a Web site hosted on a server and know how to get access to it for uploading and installing Director (or as a first step, the free test software that determines if the full product will work on your server), or if your Web designer/Webmaster can guide you through the process, this is pretty straightforward. Getting the Flash software is the hard part; it is relatively easy to use with the SlideShowPro extension. If you know someone with the Flash software (needlessly expensive at $699, unless you are a student and can get it for around $250 with the academic discount), if you have a friendly Web designer who owns Flash, or if you already have it yourself but find it intimidating to use, then you could buy the SlideShow Pro software (both Director and the extension for Flash) which is very affordable for such a beatutiful tool:

  • SlideShowPro for Flash ($29.00): Photo gallery and slideshow component for Flash MX 2004, Flash 8 and Flash CS3.
  • SlideShowPro Director ($29.00):Content management system for SlideShowPro. Downloadable version for one domain.

Then you could create beautiful slide shows like the ones shown on the SlideShowPro Web site.

Comments

One Response to “Web gallery tools : Part 1 – Galerie (it’s easy and it’s free)”

  1. Deborah on March 24th, 2008 5:22 pm

    Hey Lynn, thanks for the info about this one! I was looking for something I could use for my macbook. I use “Snagit” for the PC and was just getting to post an article about it on Garlic Dzign and thought hey, let me check out Lynn’s site for a second and see whats going on over there:)
    Great timing!

Do you have a comment or a question?