I wanted to do a beauty/cinemagraph project for a long while. About two years ago, I saw the site cinemagraphs.com. Their fashion cinemagraphs were extremely tastefully done. I really enjoyed viewing the images. These images really consumed my mind for a while. I’ve been looking for a photographer to collaborate with and create images in the same genre. Unfortunately, I couldn’t find one. Until recently when Wendy Hope agreed to do such project with me, but for beauty genre instead of fashion.
What is a cinemagraph is?
Let’s try to understand what a cinemagraph is first. Essentially a cinemagraph is a fusion between (cinema)tography and photo(graph)y. It’s the thing that happen when we merge a still life image with motion from a video. It’s truly enchanting when you watch an image, and then all of a sudden you notice some motion going on. I must admit that while it’s not a new thing on the web anymore, it still grabs my attention every single time if it’s done right.
Initially, cinemagraphs were great for sharing on forums and social media. Size and dimensions were creating a limit. Now, if done right, most cinemagraphs are rarely over 1 MB in size. Combine that with the a great spread of digital displays for advertising, and TADA! cinemagraphs aren’t limited to the web anymore.
How to create a cinemagraph?
You need to plan ahead and understand your composition and where you want to introduce movement.
The motion needs to be subtle and controlled in the specific area where you want to draw the attention to. For Example, in our series we wanted the attention to be on the eyes and nails.
The next step is to shoot quality footage. The clips don’t need to be very long. Depending on the motion you planned, I would say 10-30 seconds is the perfect duration in most cases. You’ll most likely edit it down significantly (as I did) so you end up with like 3-8 seconds clips with perfect motion.
Once I got down to working with the video files I used After Affects as my tool of choice. I know there are a number of tools out there specifically for creating cinemagraphs, but I find them limiting if you need precise control over editing.
I loaded the video clips in After Effects and decided on the motion I thought would work the best and deleted the rest. I redid the timing to make it smoother and more precise because initially it was choppier than I hoped for. I stabilized the video because it’s very difficult for a model to be perfectly still when shooting up close. Even if you think you don’t move there are micro movements and when shooting up close they’re really visible and messing up the video. You have to fix it.
When I was done with video editing I exported the “hero frame” to Photoshop for retouching. This is the frame that stays still while the rest of the photo is moving. On the other photos I only retouched the relevant areas. It’s always nice to have images that look their best. After the retouching part was over I brought the still back to After Effects, Then, I masked out the areas where movement was happening. This way you get this magic feel where the image appears to be still but when it’s time it moves. It’s pretty cool I must say.
Outputting the files
Now my cinemagraphs were done and I needed to prepare them for the web. At this point, you will be faced with an additional challenge. First of all, you can’t produce GIFs from After Effects, because it doesn’t support this format. You need to either render video, open it in Photoshop and save it as GIF from there or you can produce the series of high-quality preferably PNG still images and then assemble them in Photoshop animation panel. Only then you save them as GIFs.
The first choice (i.e. vidoe to GIF conversion) is easier, but won’t let you produce highly optimized GIF files. You’ll face the same issue that more conversions are facing. The resulting GIF will be very heavy.
Fortunately, there is an alternative – a second option and a better way to produce optimized GIFs. The bad news it requires additional work:
- First, in After effects, you render still images from you project file.
- When it’s done you need to pick your key frames and manually re-create the animation in Photoshop.
- This way your frames count will be really low and your GIF will optimize much better when saving.
- I’ve got up to 90% file size reduction: from 1.4 MB to about 150 KB with the same dimensions and even better quality.
Once you’re done with creating the GIF file, you can freely share your cinemagraph in an email, on social media and in chats while not worrying about it being too heavy. Internet quality is still an issue in many parts of the word and I believe cinemagraphs over 2.5 MB aren’t acceptable. Ideally, files should be under 1 MB if possible.
Fortunately producing cinemagraphs for offline viewing is much easier. You just output your files with the best quality possible and don’t worry about the size. You can also add more motion to your cinemagraphs or make them longer as file size does not matter anymore.
- Photographed by Wendy Hope
- Retouched by Alexey Adamitsky
- Model is Idriss Bozhilov with Parts Models
- Makeup by Georgina Billington for Judy Casey using Make up Forever
- Nails by Chiharu using Sally Hanson
- Cinemagraphs by Wendy Hope and Alexey Adamitsky