Page de Jean-Paul Molina

Drawing segments progressively

 

The purpose is to simulate a progressive drawing of segments using the Transform effect.
I suppose you know well how to create objects, thus I will not insist on.

⇒ animation ⇐

Creating Objects

1 - Set up a movie scene : width 160, height 120 and a background color #000066.
Set Frame Rate to 35.

2 - Right now you gonna create a set of horizontal and vertical lines (color #FF9900), 2 pixels spaced.
Inasmuch as it's repetitive, I'll give the parameters to set in tab Transform in the following array.

Anchor point	X	Y	W	H
Center Left	55	35	50	0
Top Center	105	35	0	50
Center Right	105	85	50	0
Bottom Center	55	85	0	48

Anchor point	X	Y	W	H
Center Left	55	37	48	0
Top Center	103	37	0	46
Center Right	103	83	46	0
Bottom Center	57	83	0	44

Anchor point	X	Y	W	H
Center Left	57	39	44	0
Top Center	101	39	0	42
Center Right	101	81	42	0
Bottom Center	59	81	0	40

Anchor point	X	Y	W	H
Center Left	59	41	40	0
Top Center	99	41	0	38
Center Right	99	79	38	0
Bottom Center	61	79	0	36

Anchor point	X	Y	W	H
Center Left	61	43	36	0
Top Center	97	43	0	34
Center Right	97	77	34	0
Bottom Center	63	77	0	32

Anchor point	X	Y	W	H
Center Left	63	45	32	0
Top Center	95	45	0	30
Center Right	95	75	30	0
Bottom Center	65	75	0	28

Anchor point	X	Y	W	H
Center Left	65	47	28	0
Top Center	93	47	0	26
Center Right	93	73	26	0
Bottom Center	67	73	0	24

Anchor point	X	Y	W	H
Center Left	67	49	24	0
Top Center	91	49	0	22
Center Right	91	71	22	0
Bottom Center	69	71	0	20

Anchor point	X	Y	W	H
Center Left	69	51	20	0
Top Center	89	51	0	18
Center Right	89	69	18	0
Bottom Center	71	69	0	16

Anchor point	X	Y	W	H
Center Left	71	53	16	0
Top Center	87	53	0	14
Center Right	87	67	14	0
Bottom Center	73	67	0	12

Anchor point	X	Y	W	H
Center Left	73	55	12	0
Top Center	85	55	0	10
Center Right	85	65	10	0
Bottom Center	75	65	0	8

Anchor point	X	Y	W	H
Center Left	75	57	8	0
Top Center	83	57	0	6
Center Right	83	63	6	0
Bottom Center	77	63	0	4

Anchor point	X	Y	W	H
Center Left	77	59	4	0
Top Center	81	59	0	2
Center Right	81	61	2	0

Installing Effects

You are about to make each segment to progressively appear as if it was handdrawn.
In Timeline, for each segment, you gonna set a Transform effect over 10 frames.

Open the Properties dialog box of Transform effect. In every tab Cascade, enter

In each tab Transforms, you should adjust that follows.
Here is the example for the very first horizontal line which 'll appear progressively from left to the right.

By default, point X=0, Y=0 stands at the middle of the segment.
Nothing to do with the anchor point.
This segment is 50 wide and considering the fact that X increases from left to right, you have to set the starting point as being the left end of the segment to get the right direction for the drawing effect.
At start, X scale is set to 0, Y scale is set to 100. At end, all is set to 100.

To sum up :
- To get an horizontal drawing effect from left to the right, set a negative X starting point ( half width ) and a X scale set to 0.
- To get an horizontal drawing effect from right to the left, set a positive X starting point ( half width ) and a X scale set to 0.
- To get a vertical drawing effect from top to bottom, set a negative Y starting point ( half height ) and a Y scale set to 0.
- To get a vertical drawing effect from bottom to top, set a positive Y starting point ( half height ) and a Y scale set to 0.

Just finish up the example considering the previous explanations.
Nevertheless, it 'd better to build this example using only a script.

Remark : Here is an example of a sloped line using Transform.
Scene : 320x240.
Transform Effect :
Start : X = -160 Y = 120 Scale 0% X=Y
Anchor Point : Bottom Left

⇒ animation ⇐