Freeze Frame Titles 2

As I mentioned in the previous breakdown, shot selection for this kind of look is very important. This time all of the selected shots were better suited for the look I had in mind, because the type was placed over the talent, rather than to the left or right. 

020_Salt 025_Tomorrow_When_The_War_Began 021_Wall_Street_2 022_Death_At_A_Funeral 023_Paper_Man 024_Eclipse

Layer Breakdown


The original shot.


The edit was imported into Photoshop Extended, where each freeze frame was deep etched, the background cloned then duplicated, with a Watercolor filter applied. The deep etched character, cloned background and watercolour background were all placed in a Layer Set, ready for import into After Effects.


The cloned background. Cloning out the character or at least the edge of the character was important for a clean composite of the deep etched character back over the shot. Here it was easy to remove the character completely.


The cloned base was converted to a Smart Object in Photoshop, allowing the use of Smart Filters (filters that you can modify after they have been applied). Keeping the filters live is important if you may want to come back and make changes later.

005_Watercolour_1 006_Watercolour_2

The basis of the look was created using free watercolour stills sourced  online.


These stills were combined with the cloned background using After Effects Blend Modes.


Next, After Effects Curves effect was used for colour grading.

009_Backgrounds_combined_with mask

The composited background was then combined with the Photoshop watercolor version using a soft feathered mask.


Digital Juice Motion Designers Toolkit 6 provided realistic watercolour style animated elements.


The watercolour splats were used as mattes for the background composite…

012_Digital_Juice_Watercolour_Splat_2 013_Combined_background_and_splat

…and added on top using After Effects Blend Modes.


The last 6 frames of each shot before the freeze frame were rotoscoped using After Effects Rotobrush tool. This allows the watercolour transition to start slightly before the freeze frame, for a smoother transition. After Effects masks were used to clean up the fingers.


The deep etched character from Photoshop was combined with watercolour layers. These get heavier towards the end of the clip, making the character appear to be “mixing in” with the canvas.


Red Giant Software’s Key Correct Matte Feather EZ was used for a more natural composite of the foreground into the background.


The title (Avenir Heavy) was combined with Digital Juice splats, filled with white and masked to certain areas of the type.


The type comp was then used as a matt for watercolour background.


In the final composite, the text was treated with After Effects Texturize effect, with Curves and Magic Bullet Mojo for the final colour grade.

  1. Tim

    looks great John

    • John Dickinson

      Thanks Tim, I appreciate your feedback. Best, John.

  2. Joel Lisbona

    Very good look John, i ´m wondering how many hours did you spent in the final piece.

    • John Dickinson

      Thanks Joel, I had about 4 days on this one. These kinds of layouts are very fiddly!

  3. Charlie Karlsson

    Amazing as usual John! Thats why you’re an icon in this business!
    All of them are pretty much perfect.

    You’re definitely the one person I’m looking up to!
    Keep going, John, you’re doing so much for us others in this business.


    • John Dickinson

      Thanks Charlie, I would have liked to have more time on this and perhaps created my own watercolour effects. I appreciate your feedback. Best wishes, John.

  4. Jin

    sweeet! kinda like sherlock holmes end titles.

    whats the song?

    • John Dickinson

      Thanks Jin, I had actually forgotten about the Sherlock Holmes titles! That would have been a good reference! The song is a production piece sourced by Cameron, the editor of the spot.

      • Jin

        is there any chance to get the song somehow?

  5. ashcat

    Very cool, like the use of MDTK gives me a few ideas, thanks for sharing.

  6. Troy Pickford

    Another great tutorial and a nice technique. You obviously liked it so much that you redesigned your webpage header with that technique.

    Can i ask, did you also do the On Demand ads where each letter of On Demand has a texture or shape applied to it? ie the latest one with hair on one letter and the pin-pression for the N? If so a tute on that would be great. Cheers.

    • John Dickinson

      Hi Troy, those spots were created by my team mate Brett. I was involved as assistant creative and I modelled the Psycho House, the Spaceship A and the Spy Recorder M. We’ll be doing a full breakdown 😉 Best, John.

  7. Izzy

    Pretty sick John, very nice work man:)

  8. samhs

    Excellent work and really nice to see a breakdown of the steps you took. I often forget I can use Photoshop to create more sophisticated graphic effects that I can easily achieve directly in After Effects – must write that on my forehead or something!

    Keep up the good work John – really appreciate all your posts.

  9. James

    when you discuss the treatment to the footage, what is meant by “deep etched” ?

    • John Dickinson

      Deep etch means to cut the image out of it’s background.

  10. Ben Lane

    Great work as always John! I always like to see the promos on foxtel, always something a little different and challenging!

  11. clay asbury

    Very nice breakdown.
    Cool that you did a lot of the treatment in Photoshop Extended instead of AE.
    The Rotoscoping was a really nice touch.
    I learn something every-time I watch your tutorials.

  12. Phillip

    Great insight + work.

  13. peter pham

    what collection,nice post.

  14. akalaurel

    Nice work John, you spare no effort!
    Good design too… keeping the same angle/placement for the font along with each movie trailer’s textured BG.
    Really like the water technique on “The Last Airbender.”

    Thanks for your insights, very helpful.

  15. Jack

    Wonderful work John, as usual a benchmark. Well done.

Leave a Comment

  • (will not be published)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>