Use the Turn Page-film Video F/X in Ulead GIF animator to create a GIF animation to draw attention and sustain interest. Where can you use such an animation? Web pages, multimedia presentations and e-learning courses are some of the choices.
Consider an example: Say, you’ve a sale of your e-books at fifty percent discount on your website. To highlight this info, use a GIF animation, for example, with two objects. The first object is a text, “SALE”. And, the second one is again a text, “50% OFF”. Next, apply the Turn Page-film Video F/X in GIF animator to each of the two objects.
Set the delay time for each of the two objects and the in-between turn page-film effect frames. What is delay time? It’s how long a GIF Animator animation frame will display before moving to the next frame. That’s it, your animation is ready! Save it as a GIF file and insert it in your web page.
Step-by-Step Tutorial to Create a GIF Animation with Turn Page-Film Video F/X in GIF Animator
View the Turn Page-Film Video Effect animation.
1. Start GIF Animator. The Startup Wizard appears.
The Startup Wizard
………………………………………………………………………………………………………………………………………..
2. Click Blank Animation.
For this tutorial, I’ve used a canvas size of 233X68 pixels. If your canvas size is not the same, click the Canvas Size button on the Standard Toolbar.
Click the Canvas Size button (shown highlighted)
The Canvas Size dialog appears.
The Canvas Size dialog
Uncheck the Keep aspect ratio checkbox and set the canvas size to 233X68 pixels. Click OK.
TIP: Rather than use two text objects for this animation, you can also use two images. The images should be of the same dimension for precise results.
To insert an image:
Click File > Add Image or press the Insert key. The Add Image dialog appears.
Select an image and click Open.
Click Frame > Add Frame or press Ctrl+Alt+F to add a new frame.
Repeat Steps A and B to insert the second image in the new frame.
Go to Step 13 to create the turn page-film video effec
………………………………………………………………………………………………………………………………………..
3. Type the first text object: Click the Text Tool in the Tool Panel.
Click the Text tool (shown highlighted) in the toolbar
Click the cursor anywhere on the canvas. The Text Entry Box dialog appears.
The Text Entry Box dialog
Select 50 for the text size in the Size field. Click the B button to type the text in Bold. Type the text, SALE in the text editor. Click OK. The text appears on the first frame.
Type the text size and text and select a text style
The text you typed appears on the canvas in frame 1
………………………………………………………………………………………………………………………………………..
4. Click the Pick Tool in the Tool Panel. Click the Center Both button in the Alignment Toolbar to center the text both horizontally and vertically.
Click the Pick Tool (shown highlighted) in the Tool Panel
Click the Center Both button (shown highlighted)
………………………………………………………………………………………………………………………………………..
5. Type the second text object: Click Frame > Add Frame or press Ctrl+Alt+F to add a new frame.
Click Frame > Add Frame
Click the “eye” square to the right of the image object (rectangle) in the Object Manager Panel to show the rectangle (if not already showing).
Type the text, “50% OFF” using the text tool , and center the text, as outlined in Steps 3 and 4.
Click the “eye” square in the Object Manager Panel and type the text
………………………………………………………………………………………………………………………………………..
6. Click the rectangle object in the Object Manager Panel. Make sure the eye icon is displaying in the first square next to the rectangle. If not, click it.
Click the rectangle object in the Object Manager Panel
………………………………………………………………………………………………………………………………………..
7. Select a foreground color for the rectangle: Click the foreground color swatch in the Tools Panel to select a different color for the rectangle (if you wish to change its default white color). The Ulead Color Picker dialog appears.
The Ulead Color Picker dialog
Pick a color that contrasts well with the text color. Click OK.
………………………………………………………………………………………………………………………………………..
8. Click the Fill Tool in the Tools Panel and then click the rectangle object in the design window. GIF Animator fills the rectangle with the selected color.
Fill a color for the background of the text
………………………………………………………………………………………………………………………………………..
9. Add a Neon effect to the first text object: Click the first frame in the Frame Panel to select it. Use the Pick Tool, and in the design window click the text object to select it.
Select the text “SALE” in the design window
………………………………………………………………………………………………………………………………………..
10. Double-click the selected text object and from the context-sensitive menu, click Neon.
Double-click the text and select Neon from the menu
The Neon Settings dialog appears.
The Neon Settings dialog
………………………………………………………………………………………………………………………………………..
11. Check the Neon checkbox. Click OK. GIF Animator adds the neon effect to the text.
………………………………………………………………………………………………………………………………………..
12. Add the Neon effect to the second text object: Click the second frame in the Frame Panel. Use the Pick Tool, and in the design window click the text object to select it.
Click the second frame in the Frames panel to add the neon effect
Repeat Steps 10-11 to add the neon effect.
The neon effect added to the contents of the second frame
………………………………………………………………………………………………………………………………………..
13. Click the first frame in the Frame Panel to select it.
………………………………………………………………………………………………………………………………………..
14. In the main menu, click Video F/X > Film > Turn Page-film. The Add Effects dialog appears.
Click Video F/X > Film > Turn Page-film
The Add Effects dialog
Click OK. GIF Animator adds fifteen effects frames between the first frame and the last frame.
GIF Animator adds the effects frames in the frames panel
………………………………………………………………………………………………………………………………………..
15. Play the animation: Click the Play Animation button in the Frames panel. The animation starts and loops continuously. Click the Stop Animation button to stop the animation.
………………………………………………………………………………………………………………………………………..
16. The animation works a bit fast, right? To make the first and the last frames pause for more time, right-click the first frame and from the context-sensitive menu, select Frame Properties. The Frame Properties dialog appears.
Select Frame Properties
The Frame Properties dialog
To delay the first frame for one second, type 100 in the Delay field. Remember, the value you type in that field is one-hundredth of a second. So, 100 equal 100/100, which is one second.
Click OK.
………………………………………………………………………………………………………………………………………..
17. Set the delay time for the last frame also to one second, as above.
Play the animation: Click the Play button in the Frames Panel. If the timing is OK, go to next step. Otherwise, repeat Steps 16-17.
………………………………………………………………………………………………………………………………………..
18. To apply the Turn Page-film video effect to the Last Frame, click it.
Repeat Step 14, but in the Add Effects dialog, to the turn the page opposite to that of the First Frame, click the relevant page direction arrow button.
………………………………………………………………………………………………………………………………………..
19. Play the animation: Click the rewind button and then the play button.
View the Turn Page-Film Video Effect animation.
Written by S Viswakumar
Professional Content Writer and E-Learning Developer