 |
|
|
|
|
| Creating the Drawing in Animation |
|
 |
|
|
| Step 51. |
| For this part of the tutorial we're going to create the animation sequence at the start, that reveals the website. First we're going to animate the menu bar. So, create a key frame (F6) at frame 15 and then extend the frames of the other layers (F5) |
|
|
|
| |
| Step 52. |
| Make the content layer invisible and click on the first frame of the "bar" layer, and use the down arrow key to nudge bar MC, so that it's inline with the grey BG layer. |
|
|
|
| |
|
|
| Step 53. |
| Right click on any frame of the bar layer in the timeline, and choose create motion tween, So now the bar layer will move up in the animation. |
|
|
|
|
| Step 54. |
| Next, create a key frame (F6), at frame 30, on the "menu" layer, and extend the frames of the other layer (F5) |
|
|
|
|
| Step 55. |
| Drag the 1st frame of the "menu" layer to frame 15. |
|
|
|
|
| Step 56. |
| Move the menu buttons, so that theyre hidden behind the menu bar. |
|
|
|
|
| Step 57. |
| And create a motion tween for the menu layer. |
|
|
|
|
| Step 58. |
| Drag frame 1 of the content layer to frame 30. |
|
|
|
|
| Step 59. |
| Then extend all the frames of each layer to frame 45. |
|
|
|
|
| Step 60. |
| Now we're going to make the content reveal using a mask, So, create a layer called "mask" and make a blank key frame (f7) at frame 30. Use the rectangle tool to create a rectangle, at frrame 30, and the same size as the content section. |
|
|
|
|
Step 61. |
| Create a key frame (f6) at frame 45 of the "mask" layer. |
|
|
|
|
| Step 62. |
| Click on frame 30 of the maks layer and use the arrow key to nudge the rectangle upwards, so that its above the content MC. |
|
|
|
|
Step 63. |
| Create a motion tween, which should make the rectangle start from the top and animate to the bottom. |
|
|
|
|
| Step 64. |
| Right click on the mask layer and choose "mask". |
|
|
|
|
Step 65. |
| Now we need to mask the menu bar, while its moving upwards. So, create a new layer called "grey-mask" and a blank key frame at frame 30. |
|
|
|
|
| Step 66. |
| Create a rectangle, covering the menu bar, using the same grey as the BG |
|
|
|
| |
| Step 66. |
| Drag the actionscript frame from frame 1 to frame 45. |
|
|
|
| |
| Step 67. |
| Lastly, add a stop() action to the actionscript. |
|
|
|
|
| And that brings us to the end of this tutorial to create a Full flash website! |
|
|
|
|
|
|
 |
