Skip to main content
All CollectionsCreative Corner
Image effect - "The Teaser"
Image effect - "The Teaser"
Nicoline Gotschalk Dalgaard avatar
Written by Nicoline Gotschalk Dalgaard
Updated over 4 months ago

So many options, so little time. That is usually the designer's challenge.

With Creative Corner, I can inspire you to create the coolest ads. This example shows how to make a nice effect on a static image. I call it "The Teaser". "The Teaser" because the image is being revealed piece by piece.

Alright alright alright, but how do you do it? I'll tell you πŸ€“
See the video-guide or the step-by-step guide below.

Step-by-step guide to "The Teaser" image effect.

  • First thing, add an image that covers the whole format.

  • Add rectangles as covers. In the example, I have added 5 rectangles, but you can always add more or less depending on which effect you want.
    Make sure to make the covers the same size. The example takes part of a format in size 930x600 and each rectangle (covers) are 170x600 px. Place them symmetrical with the exact amount of pixel space.

  • Add other sizes of rectangles as dividers between the covers, so it covers the whole image. I have added four in size 25x600 px.

  • Now add the animations. Start with animation for the covers.
    Add "Resize Y" to each of the cover layers.
    See the settings for the animation below. I have mixed the start time to make a nice reveal of the image.

  • Then add animations to the dividers. Add the Resize X to each layer. I want the dividers to animate at the same time, so the start is the same on all four layers. See the setting for that animation below.

Best practice πŸ’‘
Add the five covers into one group and the four dividers into another group. Then you can minimize the groups and make the layer overview structured.

What you do next, is up to you. I made the image stay for a second, then pushed in a new image, and continued that effect with 5 different images showing different destinations 🌟

Did this answer your question?