9VAe Beginner Tutorial 1 - Input, Select, Move, Resize...

Previous tutorial described an overview of the 9VAe interface. This tutorial shows how to create a quick example animation.

First Step

Let's make a simple animation shown above. The steps we'll take are:

1. Start 9VAe.
2. Draw three circles.
3. Add the second page.
4. Change the color of the left circle to red and change the color of the right circle to blue.
5. Select the red and blue circles together, resize them and move them to touch the center circle.
6. Click Play button to see the animation.

1. Start 9VAe.

9VAe will open a single window with a default page size.

2. Draw circles

1. Click 'Filled circle'(A) in the Tool Box on the upper left of the 9VAe window.
2. Click and drag the pointer from the center(A1) to the outside of the page area to draw the first circle.
3. Click and drag the pointer from the center(A2) to the outside of the page area to draw the second circle.
4. Click and drag the pointer from the center(A3) to the outside of the page area to draw the third circle.

3. Add the next page

1. Click '+' button (B) on the right side of the first page in the Page Bar shown above.
2. Click 'Add Next Page' on the menu. Now the first page will be copied to the second page . The second page will appear on the right side of the first page as follows.

Copy is important in 9VAe. Copied objects are connected to the original objects. Only connected objects can make in-between shapes or colors automatically.

4. Change color

1. Click 'Select Object' button (A) shown above to select objects.
2. Click the left circle (B) to select it.
3. Click Fill Color (C). Now the Color palette will appear. > Click 'red'.
4. Click the right circle (D) to select it.
5. Click Fill Color (C). Now the Color palette will appear. > Click 'blue'.

The button on the right side of the 'Fill Color'(C) is the 'Gradation' button. You can choose the second color of gradation by clicking the 'Second color' button on the right side of the 'Gradation' button. Please try to add color gradation to your center circle.

5. Multiple selections

1. Click the red circle (A) to select it.
2. Holding down the Shift key click the blue circle (B) to select it. > Now the red and blue circle will be selected together as shown above. Selection frame will appear around selected objects .

Shift+clicking on a selected object excludes it from the selection.

6. Resize, Move

1. You can Resize the red and blue circles by dragging the corner handle of the selection frame(C) shown above.
2. You can Move the red and blue circles by dragging the frame of the selection frame(D).

Move and resize the red and blue circle to touch the center circle as follows.

7. Play

1. Click 'Play' button(A) to see animation.

Final Words

This article explained 'Input figures', 'Select objects', 'Change Color', 'Move and Resize objects. You will understand it is very easy to make animation using keyframes in 9VAe.

The next article '9VAe Beginner Tutorial 2' shows how to create an ' AnimeCast'.

Related article

9VAe Introduction

1. 9VAe Free SVG/GIF Animation editor: Introduction
2. 9VAe Download and Install
3. 9VAe's Frequently Asked Questions

9VAe Beginner Tutorials

1. 9VAe Beginner Tutorial 0 - Overview
2. 9VAe Beginner Tutorial 1 - Input, Select, Move, Resize...
3. 9VAe Beginner Tutorial 2 - AnimeCast, Time
4. 9VAe Beginner Tutorial 3 - Edit AnimeCast, Loop
5. 9VAe Beginner Tutorial 4 - Time Curve, Copy Pages, GIF
6. How to make a great short video from 5 pictures