Design thinking of making planar animation using Photoshop CS3

Through the previous three lessons, we have mastered the method of making animation, although the animation is still very simple. Remember when you were learning the basics, were you touching a single color block for a long time? That doesn't affect everyone's level of play now. In the same way, we'll soon start making more elaborate animations. But before all this comes, we must also learn some of the necessary design thinking. The so-called design thinking refers to the planning considerations before making the animation, which includes many aspects.

First, the layer of the Organization, the final production animation is not contain layer information. The layers described here refer only to the fabrication. One obvious problem with animations that take advantage of the change in layer position is that the layers must be reasonably arranged because the smallest unit of movement is the layer, so if you need to make multiple objects with different trajectories, they must be distributed across layers. Also need to think ahead to move the distance, the size of the image and the placement of the location needs to leave enough space for the move, this is one.

The second is to consider whether it will intersect with other layers, as well as the processing at the intersection, who covers who, that is, layer hierarchy, the following figure lists 3 ways to intersect, the leftmost is two layers are 100% times, green covered with red. The other two show different coverage effects at different levels under 50% opacity. If the green cover red, then the intersection is green, instead. This is in the normal blending mode, if you choose other blending mode such as superposition, we should pay more attention to the level.

All of the above are technical issues, and now it is a matter of plot. In general, if an object is always moving in an image, it is not necessary to account for it. But if the object is not in the picture, is later into the screen, or originally in the screen later moved out of the screen, it is necessary for the appearance and disappearance of the object to do an account, this account is the transition, so that viewers have a more natural psychological change. The common trick is to make the object appear (also called Fade in) or fade (also called Fade Out). As shown in the following illustration, the comparison between fading and fading processing is demonstrated in the same text movement.

You can move the mouse over to the playback area to see the actual animation effect, and the move out of the play area stops playing. By comparison, I'm sure everyone will feel better about adding fade processing.

　

In addition, cycle settings are also part of the problem of the plot, which we have mentioned before, that is, some occasions can use an infinite loop of animation, and some occasions are not suitable. For example, a column title text fade into the animation, if repeated, will make the Web page as a whole looks very messy, will make the viewer feel uncomfortable. At this point the most suitable way is to play once, so that can show the effect, and will not affect the overall page. A loop that is set to 2 to 3 times is generally acceptable, but no more.

But the only time to play the animation is best placed on the top of the page, so as soon as you enter the page can be seen. If you put it at the bottom of the page, the animation will be finished when the viewer reads it. In that case, there is no point in making animation, and it is better to replace it with static pictures.