I have decided to create a series of three moving images, each as cinemagraphs and GIFs, to allow the client to choose a format and file size to best suit their needs.
Cinemagraphs
The appeal of cinemagraphs is the juxtaposition of the static background and the moving subject. It can appear to be a normal photograph until the movement starts, evoking a whimsical feeling in the audience. The stillness of the background allows focus to be drawn to the subject, and can help simplify an otherwise busy image.
The large cinemagraphs match the source formatting - these are the largest files (between 6.7 and 14.8MB) but also the clearest and most detailed. These would be good for the desktop versions of the Wildlife Trust websites, while the scaled-down cinemagraphs would suit mobile versions.
The smaller cinemagraphs are 500 pixels wide and between 1 and 3MB. This means they are more versatile and, in addition to being useful for mobile versions of the websites, more suitable for posting on social media.
Gifs
GIFs are used on websites, but are most commonly used on social media. As people often browse through a large number of GIFs on their phones, these need to be of an appropriate file size for the phone to load quickly without taking up too much bandwidth. Some websites, such as Tumblr, require the resolution of GIFs to be within a certain range. The drawback of having a larger image, however, is the limited colour depth. In order to keep the file size around or below the 1MB mark (the standard for most GIFs), one or the other must be reduced. With this in mind, I have created several GIFs with various characteristics so the client can choose the best one to fit their needs. All of them are below 2MB, with the vast majority around or below 1MB.
To aid comparison, I will set them out as follows:
32 colours, 480x270 pixels (25% of original resolution)
64 colours, 288x162 pixels (15% of original resolution)
128 colours, 288x162 pixels (15% of original resolution)
"Yoink"
"Birds"
"Munch"
Creating the cinemagraphs
In order to create the cinemagraphs, I created a sequence in Premiere Pro with my chosen footage. I added a still image from that clip, and created a mask through which you could see the moving footage, while keeping the rest of the scene still. Initially I tried a fairly large mask that wasn't snapped in to each curve of the creature, but I found that the wind and the changing light were too noticeable. Instead, I zoomed in and matched the mask to every changing point, using a small amount of feather to avoid harsh lines. I also added a Wildlife Trusts logo to each one. I decided to use the core Trusts logo on its own rather than adding text to say "Cornwall Wildlife Trust" - as the end products are fairly small, I wanted to keep this fairly simple and avoid overcrowding the image. This also has the benefit of being usable by any of the Trusts, should they wish.
In the "Munch" sequence, the squirrel is mostly still. This meant that I had to make fewer keyframes with my mask, only really accounting for the slight movement of the front paws and head. I found, however, that this slight movement made it difficult to loop the sequence properly. To counter this, I cut the footage and swapped the halves over, resulting in the jump being in the centre of the sequence. I then added a transition between these two parts, varying the duration in order to create the most seamless finish.
The "Birds" sequence was a lot more difficult; the birds moved so quickly, especially when flapping their wings, that the mask tracking wasn't working successfully. This meant I had to zoom in and re-fit the mask each frame.
In addition to this, there are two birds. The first bird drops a nut that the second bird then eats. To account for this, I had to utilise three masks - one for each bird, and one for the nut.
Fortunately, this clip begins and ends without any birds in it, so I did not have to cut the clip or add transitions to create a successful loop.
The "Yoink" sequence was also simple to loop, although I wasn't sure how best to loop it with the nut in mind. In the end, the cinemagraph shows both the squirrel taking the nut and also the nut staying behind. This happens quickly enough that the duplication isn't very noticeable, and even if it is noticed, it is subtle enough so as not to detract from the sequence overall.
Creating the GIFs
Using the same clips as in the cinemagraphs, I opened Photoshop and imported the video, converting the video frames to layers. I tried limiting frames to every 2, 3 and 4, and ended up using a different number to suit each GIF.
Once I had reduced the number of frames to the amount I wanted, I changed the duration of each frame to compensate. I added the logo - in this one I had added it to the clip in Premiere when I added the transition to smooth the loop. In the other two clips, I added the logo as a separate layer in Photoshop that would be present through the entire sequence.
I then exported the GIF using the Save for Web function. The images were initially 1920 x 1080 pixels, and the colour depth 128. This meant the file size was unusable, so I had to try different combinations of reduced image size and colour depth to create a product of a suitable size.
While adjusting the settings, I found a few combinations that could produce reasonable file sizes for a variety of uses, so I ensured I saved multiple versions of each GIF to provide a range of products for the client to choose from.
I had managed to shoot the footage of the squirrels and birds just days before the lockdown was announced. I would have loved to go out and capture footage of less commonly seen animals, such as foxes, badgers, deer, otters, woodpeckers, Cornish choughs, or even seals. The lockdown meant that this was not possible, so I decided to use the videos I took at Tehidy woods a few days earlier. If I were to create more GIFs, however, I would definitely venture further afield when possible to capture footage of a wider range of animals. After considering the available space for the logo, the main reason I chose the more general Wildlife Trusts logo rather than with the addition of the word "Cornwall" is partially due to the animals featured. While I was hoping to include more animals that are associated with Cornwall, using squirrels, a crow and a jackdaw allowed for a wider audience. These animals are common around the country, and as such, the GIFs may be of interest to all branches of the Wildlife Trusts, not just the Cornwall branch. Squirrels are particularly popular because they are fluffy and cute, and featuring close-ups of the squirrels may be well-received by the audience.
Experimenting with the cinemagraph and GIF file sizes was interesting. I learned a lot about when to sacrifice certain elements and how to balance adjustments in order to create the right type of end product depending on its intended use. I am satisfied that the Wildlife Trusts could use these final results across a variety of platforms, and that they are of a suitable quality and fit for purpose.
I thoroughly enjoyed creating both the cinemagraphs and the GIFs and hope to refine my skills in the future. There are some things I would like to improve - largely my masking technique - and other parts of my work that I am less keen on but unsure how to fix. There are some small continuity errors, particularly in the "Yoink" sequence where the nut either disappears or duplicates. I am unsure if this is something that can be edited, or whether my approach is the best way of dealing with it. In any case, I will try to be more mindful of continuity when shooting footage in the future.
Comments