Work In Progress: Week One

This week I have looked at other image galleries for inspiration. I have decided to create an image gallery with photos I have taken from the snow so there is a theme and I can edit the images as I see fit. I want them to all be one consistent size but I haven’t thought about this any further. This week I want to aim to get started on my html coding, and editing my images down to size and making them look pretty. I did a basic javascript tutorial on codecademy but other than that haven’t made any attempt to learn javascript yet.


Research (1): Example Photo Galleries

I googled “good image gallery designs” and “examples of image galleries”. Here are some examples from around the internet that I found interesting, you know the drill.

Screen Shot 2014-07-23 at 10.28.05 am


Ben Trovo has created an image gallery, which although it doesn’t include all the specifications our brief has to have (doesn’t have the ability to choose which picture to navigate to), I think the navigation and image description is quite interesting. I haven’t really seen anything like it, and I like how it is all together in one group. I don’t like how it is placed on the image, though. I feel like it could cover important parts of other images.

Screen Shot 2014-07-23 at 10.33.00 am

As a design element I like the little clickable dots on image slideshows, but one potential problem is that you can’t see which image you are clicking too.

Camera is a slideshow plugin which I find very interesting because when you hover over the dots it shows a preview of the picture. The slideshow also auto plays automatically, and shows how long each picture is playing for using a circle on the top right. When you hover over an image, however, the timer stops. It has lots of effects which when used together is a little bit of an over kill imo. But I do like the ideas of these different effects so may borrow one or two for my assignment.

Screen Shot 2014-07-23 at 10.43.52 am

In regards to image slideshow designs, this one is my favourite thus far (although that is largely helped by the fact that the images are beautiful). If you look closely down the bottom of the image slider it shows which image has been selected using an opaque border around the outer inside of the image. The navigation arrows are somewhat opaque and disappear when you are not hovering over the slideshow. I like how the images are laid out, they aren’t crammed together and have breathing space. The images don’t have captions like is required in our assignment.

– –

For my assignment I want to try to incorporate aspects of these three themes into one photo gallery.