I took yesterday to create a new presentation of jennasteely.com. I've used javascript in the past for image swapping, but the code was tedious and difficult to update, so I wrote JS off as something for someone else to do. But I really wanted to add some interaction again.
Some discussion on image galleries:
Dislikes: small images, pop-ups, anything that opens over the main content, having to rely on a "next" button or having to click a number, waiting for effects to finish (i know its only fractions of seconds, its still a hassle if I have to watch your image unfold and zoom and then X out of it to get to the next one)
Likes: quick transitions, big images, the ability to click anywhere, fun and snappy interactions.
When it comes to image galleries, I guess I'm kindof a snob. I look at a lot of portfolios for inspiration, and generally I don't like how most of them function. So when I like one, its extra special! In the past I merely stacked my images because I felt it was better to scroll than having to rely on people clicking through to see my work-- i didn't think I had the ability to construct something cool and dynamic, but look at what a little fiddling can do.
I really like the transitions on
Pearlfisher's site so I hunted down a plugin called
slideViewer 1.1 and figured out how to integrate and control it. I'm sure any reasonably decent coder out there is laughing at me, but hey, I'm proud of it! The best part is that it just takes an unordered list in your HTML to create the gallery, no tricky intergration bullshit like I've done in the past. (cough thanks for nothing 51-327 cough)
The finishing touch was making and adding a preloader. Essential because it tells the user to just hang on, don't leave, something is happening, while the images load. But i've never done it before so figuring out where and how to place it was a little irritating, but you'll see its doing what it should do now.
The result is a sexy image slide, that is quick and snappy, (the best part is going from the last image to first... mmm) you can click anywhere on the image, and have an alternative navigation at the bottom. Woohoo!