The Goal

Let's add trees to the Weather Snow Scene component. We'll use a clipping mask to reveal them - the same technique from earlier in the course, but now applied to our snowy landscape.

Here's the final result for reference:

[VIDEO: Final result]

Step 1 - Import the Trees

1. Grab the tree illustrations from the attached lesson file

2. Position them on the left side, above the snow

3. Use the video above as a reference for placement - or feel free to position them wherever works for your scene

[GIF: importing and positioning trees]

Step 2 - Set Up the Mask

We need a way to hide and reveal the trees. Here's how:

1. Create a rectangle on top of the trees, matching their size

2. Set it to 50% opacity so you can see the trees underneath while you work

3. Select the rectangle and group it (Cmd/Ctrl+G). Rename the group to Trees Mask

4. Select the tree shapes and group them. Rename to Trees

5. Set Trees Mask as the Clipping Mask for Trees

[GIF: setting up the mask group]

Step 3 - Test the Mask

Before we animate, let's make sure the mask works:

1. Move the mask below the trees

2. The trees disappear - the mask no longer covers them

3. This is exactly what we'll use to animate the reveal

4. Set the mask opacity back to 0% so it's invisible

[GIF: mask moving below trees]

Step 4 - Set the Start State

In Design Mode, make sure the mask is positioned below the trees so they're hidden by default. This way the trees won't be visible when the scene isn't active.

Step 5 - Animate the Reveal

Switch to Animate Mode and go to the existing Show timeline.

We want the trees to appear after the snowman finishes entering:

1. Go to around frame 40 and add a keyframe on the mask's Position Y - with the mask below the trees (hidden)

2. Move 20 frames forward and add another keyframe where the mask moves up to reveal the trees

3. Add Ease In to the motion

Since this is on the existing Show timeline, the reversed Hide animation already takes care of hiding the trees. Nothing else to set up.

[GIF: mask reveal animation on timeline]

Step 6 - Test It

Go to the main screen and switch to snowy weather. You should see the snowman assemble, then the trees reveal at the end.

[GIF: final result in context]