Alex Wilson Photography > Blog

Lacunal volumes 1 & 2 – online previews

Blurb has new preview widgets for its books to show online samples:

Lacunal: Volume 1 by Alex Wilson (200 pages)

Lacunal: Volume 2 by Alex Wilson (200 pages)

Posted in: Products

Tags:

So… what’s up?

Lots is going on these days!

The website overhaul is coming along — the gallery code changes seem pretty stable now, so next on my to-do list is re-size the the horizontal images so they look clean in the full view (currently the browser has to scale them up a bit). I’m probably going to go over my selection for images in the galleries while I’m doing that. There’s over 2100 images currently in the gallery, so this might take a while.

I’ve re-themed the blog to match the new gallery. I haven’t finished tweaking the style sheets yet, but it at least mostly matches the look. I’ll be tweaking and updating over the next few days/weeks.

In an effort to tidy things up, I’ve removed a lot of the old blog posts, including the old gallery-as-post ones, which had a lot of my images from 2006 and earlier. I’ll be including any old favourites as I update the galleries.

After almost 4 years of having a studio (being in 3 different spaces, and sharing with around 10 other photographers), I currently do not have a space. *Sniff*. I’m taking a bit of break in order to work on the next book (selection and edits are ongoing). I hope to finish the work on the book over the next few months, and pick up looking for a studio space sometime over the summer.

I’m really excited about the next book — it will be themed along studio nudes, so I have four years worth of images to select from.

Posted in: Uncategorized

Tags: , , ,

jQuery plugin and Zenphoto theme: Silhouette

I’ve been able to work out a number of bugs and quirks with the new gallery code, and I have both the jQuery plugin and Zenphoto theme code available for those who are interested. This is still a work-in-progress, so I make no guarantees that all will work perfectly, so please treat this as a “preview” release.

Edit: Updated to version 0.5, new files below.

Silhouette is a jQuery plugin that takes a list of images and turns it into a horizontal scrolling gallery. I’ve built a Zenphoto theme that uses it. My previous gallery theme was a combination of Galleria with jCarousel used as a controller. This new theme is written from scratch, and I’ve tried to take features and functionality I liked best, and merge both the image view and scroll control into a single interface.

To see them in action, pop on over to any album in my gallery, such as this one. Please note that I have yet to go through my gallery (2000+ images!) and update the horizontal images to the correct size, so they will currently not look quite as clear due to scaling.

First, about the jQuery plugin on its own. Features:

  • Adaptive loading: Full images are loaded dynamically in order to reduce bandwidth use, but are preloaded (if near enough to the current image) so the user isn’t waiting for loads. Thumbnails images are scaled up to the full size while waiting for full images to load.
  • Navigation: Clicking on current image advanced to next image, or images to the left or right can be click to move to that image. Arrow keys can be used as well.
  • Able to direct-link to images — using #num on URL will make it slide to that image number
  • Degrades well, with no Javascript the HTML is a list of thumbs linked to full images
  • Tested, at least somewhat, with FireFox 3.6, Chrome 5.0, Safari 4.0, Opera 10.5, IE 6 and 8.

Code to include and call the plugin:
<script type="text/javascript" src="jquery.silhouette.js"></script>
<script type="text/javascript">
//<![CDATA[
    $(document).ready(function(){
      $("#container").silhouette( {img_padding_right: 10 });
    });
//]]>
</script>

The plugin drives off an unnumbered list, filled with thumbnail images linked to full images.
<div id="container">
  <ul>
    <li><a href="full_image-01.jpg" title="image 1">
      <img src="thumb_image-01.jpg" alt=""/></a></li>
    <li><a href="full_image-02.jpg" title="image 2">
      <img src="thumb_image-02.jpg" alt=""/></a></li>
    <li><a href="full_image-03.jpg" title="image 3">
      <img src="thumb_image-02.jpg" alt=""/></a></li>
  </ul>
</div>

Simple!

There are a number of options that can be passed in:

  • current (default: 0) – The default image to be displayed. Passed-in value will be overridden with #num in URL. First image is 0.
  • range (default: 4) – Number of images ahead and behind the current to pre-load the full image.
  • container_height (default: 600) – The height of the gallery. The full-size images should be this tall.
  • container_edge (default: 25) – Extra pixels to add to left side of container. (Temporary?) work-around since some browsers add horizontal scroll.
  • scroll_speed (default: 400) – Number of milliseconds for scroll animation.
  • scroll_easing (default: ‘swing’) – Easing for scroll animation.
  • fade_speed (default: 400) – Number of milliseconds for fade animation.
  • img_padding_right (default: 0) – Pixels to pad on right side of images.
  • img_opacity (default: 0.25) – Opacity for faded-out images.

Download jQuery plugin: jquery.silhouette-0.4.js
Download jQuery plugin: jquery.silhouette-0.5.js
(fixes images not scrolling correctly to middle)

If you are using the awesome Zenphoto gallery, I’ve put together a theme that matches my own gallery using the Silhouette plugin.

The theme will require some customization, since I don’t have settings set up for it yet. It will work best if your full images are sized so that their height matches your container/gallery height, and you don’t want to have cropped thumbnails.

Download theme: silhouette-theme-0.4
Download theme: silhouette-theme-0.5
(adds support for protected image URLs, menu and Goggle Analytics settings via theme options)

Posted in: Updates

Tags: , , , ,

New image gallery interface theme: Silhouette

After 2 years with my Galleria and jCarousel mash-up theme for my gallery, I decided it’s time for another face-lift.

While it’s still in development, and a little rough around the edges, I’ve enable the new theme for my gallery. I’m calling it “Silhouette”, and when it’s finished I should have it available both as a zenphoto theme and as a jQuery plugin.

Silhouette features a single large horizontal scrolling/carousel view of the gallery. You can navigate by clicking on images or with the arrow keys. Like my previous theme, I’m going for something that feels Flash-like, but is powered using just HTML/CSS/Javascript.

One neat feature of this theme is that it only loads the full versions of images a few spots before and after what you are looking it. It uses scaled-up thumbnails for the placeholder images. This saves on bandwidth and helps load times so it doesn’t try to load the full versions of the entire album right at page load.

There are still a few kinks to work out (the first image doesn’t always slide right to the middle), and I don’t yet have all the features in place that I originally had in mind (like being able to link to a specific image in the gallery), but I thought it far enough along I’d share it — if you have any comments on it in its current state, please let me know!

Posted in: Updates

Tags: , , ,

New pictures!

First, I’ve updated the galleries with well over 150 new images, with loads of new 2009 albums for stuff I’ve shot since January.

Posted in: Updates