Arthi at 11:58, 4 November 2020

2020-11-04T11:58:05Z

Arthi at 10:36, 4 November 2020

2020-11-04T10:36:26Z

PoojaMoolya: Created page with "{| border=1 | Time | Narration |- | 00:01 | Welcome to the Spoken Tutorial on “'''Underwater- animation” '''using '''Synfig.''' |- | 00..."

2018-10-25T07:09:05Z

Created page with "{| border=1 | <center>Time</center> | <center>Narration</center> |- | 00:01 | Welcome to the Spoken Tutorial on “'''Underwater- animation” '''using '''Synfig.''' |- | 00..."

New page

{| border=1
| <center>Time</center>
| <center>Narration</center>

|-
| 00:01
| Welcome to the Spoken Tutorial on “'''Underwater- animation” '''using '''Synfig.'''

|-
| 00:05
| In this tutorial we will familiarize ourselves with animating images in '''Synfig.'''

|-
| 00:12
| We will learn to Import '''png '''and '''svg'''

|-
| 00:16
| Animate the images by using '''distortion'''

Add '''Noise Gradient'''

|-
| 00:22
| And use '''Random '''option for '''random animation'''

|-
| 00:26
| Using the above, we will learn to create an underwater animation.

|-
| 00:32
| To record this tutorial, I am using

'''Ubuntu Linux''' 14.04 OS and '''Synfig''' '''studio '''version 1.0.2

|-
| 00:43
| We are in the '''Synfig interface'''.

|-
| 00:46
| I have saved my '''Synfig '''file as '''Underwater-animation.'''

Pls do so likewise.

|-
| 00:54
| Now let us start creating our underwater animation.

|-
| 00:59
| For underwater animation we will need a background, some bubbles and some water plants.

|-
|01:06
| We will also need some creatures like fish, frog, crab, etc.

|-
| 01:13
| To create this animation, I am going to use the images that I created earlier.

|-
| 01:19
| For practise, learners can use the images provided in the '''Code Files '''link of this tutorial.

|-
| 01:26
| Background, octopus, water plant, Bubble, Fish as '''png '''images.

|-
|01:32
| Frog and crab as '''svg''' images.

|-
| 01:36
| Let us start to import the''' png''' images for our underwater animation one by one.

|-
| 01:43
| For that, go to '''File '''and click on '''Import.'''

|-
| 01:47
| Click on '''Desktop''' and Double click on '''Underwater animation'''

And select '''background.png.'''

|-
| 01:54
| Then click on''' Import.''' We get the image on the '''canvas'''.

|-
| 02:00
| In the same way, import Water plant, Fish-1, Fish-2 Octopus, Frog, Crab, Bubble as demonstrated.

|-
| 02:10
| You should see a list like this in '''Layers panel'''.

|-
| 02:14
| To create separate group of each graphic like Plant, Fish-1 etc.

Select imported layers respectively.

|-
| 02:24
| Then right click on '''Layer. ''' Select '''Group layer.'''

|-
| 02:30
| Let’s now rename this '''group layers, '''as demonstrated.

|-
| 02:37
| Come back to the '''Canvas. '''

Scale all the images and arrange the underwater scene as shown here.

|-
| 02:46
| Sometimes while importing '''svg '''file it may show errors in '''synfig'''. As you can see here frog eyes are missing so i will draw it again.

|-
| 03:01
| We will now go to the '''Time track panel.'''

Place the '''Time cursor '''on '''start frame'''.

|-
| 03:07
| Click on''' Turn on animate editing mode icon.'''

|-
| 03:10
| Go to '''Layers panel. '''Click on the triangle to expand '''Fish-1 group layer'''.

|-
| 03:16
| Right-click on the '''Fish-1 layer. png'''

Go to''' New layer '''then select''' Distortion''' and click on''' Twirl.'''

|-
| 03:26
| Now we will animate the tail part of the fish.

Back to the '''canvas'''. Place the '''Twirl effect, '''as demonstrated'''.'''

|-
| 03:34
| Adjust the '''Twirl.'''

|-
| 03:36
| Now, move the cursor to the 10th frame.

Go back to the '''canvas. '''

|-
| 03:44
| '''Twirl''' effect can be done by moving the '''Twirl '''handles that is the blue dot as demonstrated.

|-
| 03:52
| We see the '''Rotation '''value''' '''as -50.60 degree.

|-
| 03:56
| Move the '''cursor''' to the 18th and 24th '''frames''' one by one and repeat the same steps.

|-
| 04:03
| Change the amount of''' rotations''' as 32 degrees and -5 degrees, respectively.

|-
| 04:10
| Likewise, I will give '''twirl''' effects twice, for animating the upper and lower fins of the fish.

|-
| 04:24
| For repeatative animation till the end, we need to give a '''Time Loop.'''

|-
| 04:29
| For that, right-click on the topmost layer of the '''Fish group '''layer'''. '''

Now Go to '''New layer''', then''' Other''' and click on '''Time Loop'''.

|-
| 04:40
| Now go to '''Layers panel''' and select''' Fish layer.'''

|-
| 04:44
| Go to''' '''the '''Time track panel '''and''' '''Place the '''cursor''' on the zeroth frame.

Move the fish as demonstrated.

|-
|04:53
| Go to''' Time track panel '''and place the '''Cursor''' on the 100th frame.

Move the fish as demonstrated.

|-
| 05:03
| Similarly, we will animate '''Fish-2'''.

|-
| 05:11
| Let’s save our file before proceeding further.

|-
| 05:15
| Now let’s animate the crab claws.

Go to '''Layers panel.'''

|-
| 05:20
| Click on the triangle to expand '''Crab group''' layer.

|-
| 05:24
| Here, i need to do separate groups for different parts of the crab.

|-
| 05:35
| Then select the first part of '''Claw-1''' and right-click on it.

|-
| 05:40
| Go to '''New layer''' and then '''Transform''' and click on''' Rotate'''.

|-
| 05:47
| Adjust the rotate handle as demonstrated.

|-
| 05:50
| Go to the '''Time track panel''' and place the cursor on the 10th '''frame'''.

|-
| 05:55
| Now go to the''' Parameters panel '''and change the '''Rotate amount '''to '''18 '''degrees'''.'''

|-
| 06:02
| Again, go to the '''Layers panel.'''

Select the second part of '''Claw-1 '''and right-click on it.

|-
| 06:09
| Go to '''New layer''' then '''Transform''' and click on '''Rotate'''.

Adjust the '''rotate handle''' as demonstrated.

|-
| 06:17
| Go to '''Time track panel''' and place the cursor on the 10th '''frame'''.

|-
| 06:22
| Go to '''Parameters panel '''and change the '''rotate Amount '''to -7 degrees.

|-
| 06:28
| Likewise, animate '''Claw-2.'''

|-
| 06:35
| Next, we will animate the eyes of the crab. Go to '''Layers panel '''and open the''' Eye group layer'''.

Select the black parts of both the eyeballs '''using Ctrl key.'''

|-
| 06:51
| Go to '''Time track panel''' and place the '''cursor '''on the 9th '''frame'''.

Now go to the '''Canvas''' and move the black parts of both the eyeballs''' '''as demonstrated.

|-
| 07:07
| Again, go to the '''Time track panel '''and place the cursor on the 18th '''frame'''.

|-
| 07:12
| Now go to the '''Canvas''' and move the black parts of both the eyeballs''' '''as demonstrated.

For repeatative animation till the end apply the '''Time loop'''

|-
| 07:26
| Once again let’s save our file before proceeding further.

|-
| 07:32
| Next we will animate the mouth and tongue of the frog.

To do that, first go to the '''Layers panel''' and open the''' Frog group layer'''.

|-
| 07:44
| Select the layers of mouth and tongue and group them together.

|-
| 07:50
| Let’s name this group as''' Mouth and tongue.'''

|-
| 07:55
| Go to''' Layers panel '''and select the mouth of the frog.

|-
| 08:00
| Then go to the '''Time track panel'''. Place the''' cursor''' on the 23rd frame.

Move the''' nodes''' of the layer as demonstrated.

|-
|08:11
| Go to''' Layers panel''' and this time, select the tongue of the frog.

|-
| 08:18
| Now go to the '''Time track panel '''and place the''' cursor '''on the 23rd frame.

|-
| 08:25
| Go to '''Parameters panel''' and open the vertices group by clicking on triangle icon of vertices group.

|-
| 08:32
| Select the number of vertex 1 and right-click on it.

|-
| 08:37
| Click on '''Mark active point as off''' option. Do likewise for '''Vertex''' numbers 2 to 12 on the same '''keyframe'''.

|-
| 08:52
| Go to '''Layers panel''' and right-click on '''Water plant''' png layer

|-
| 08:58
| Go to''' New layer, '''then to''' Distortion''' and click on '''Twirl.'''

|-
| 09:04
| Go to '''Time track panel''' and place the cursor on the 13th frame.

|-
| 09:09
| Go to''' Parameters panel'''.

Change the '''Rotation '''value of '''Twirl''' to 23 degrees.

|-
| 09:15
| Now go to 25th frame. Here change the '''Rotation '''value of '''Twirl''' to -9 degrees.

|-
| 09:23
| Save the file once again.

|-
|09:27
| Next we will animate the octopus.

Select '''Octopus group layer'''.

|-
| 09:32
| Go to '''Canvas''' and move the '''Octopus '''on '''keyframes '''0''', '''75, 135 and 185 as demonstrated.

|-
| 09:46
| Go to''' Layers panel '''and select '''Octopus png layer.'''

Right-click on that layer.

|-
| 09:53
| Now go to '''New Layer,''' then '''Distortion '''and click on '''Stretch'''.

|-
| 09:59
| Go to '''Time track panel '''and place the''' cursor '''on 138 '''frame.'''

Come back to the '''canvas'''.

|-
| 10:06
| Move the orange dot to get '''stretch''' effect on the octopus image, as demonstrated here.

|-
| 10:12
| Similarly, place the '''cursor '''on 145, 150, 160, 168, 172 and move the orange dot of '''stretch''' as demonstrated.

|-
|10:30
| Next, select the '''Bubble layer'''. Right-click on it and go to''' New Layer''' and then '''Transform'''.

Click on''' Translate'''.

|-
| 10:41
| Go to '''Parameters panel''' and right-click on '''Origin'''.

Then go to '''Convert '''and click on '''Random.'''

|-
|10:49
| Go to Layers panel. Select the''' Bubble''' '''layer''' and click on '''Duplicate layer''' icon.

|-
| 10:55
| Repeat 3 more times and arrange the bubbles as shown here.

|-
| 11:05
| Go to Layers panel. Select the topmost layer.

Right-click on it and go to '''New layer '''then''' Gradient.'''

Click on''' Noise Gradient.'''

|-
| 11:19
| Go to '''Parameters panel.''' Change the '''Amount '''to 0.5

|-
| 11:23
| Change the '''Blend method to''' '''Multiply '''

and Change''' '''the '''Size '''to 60 to 300''' pixel '''as demonstrated.

|-
| 11:34
| Go to '''Time track panel''' and place the''' cursor''' on 200th frame.

|-
| 11:39
| Go to '''Parameters panel. '''Increase the value of '''Random Noise Seeds.'''

|-
|11:46
| Lastly, save the file.

|-
| 11:49
| Go to''' File '''and click on''' Render.''' Go to''' Render setting window'''.

Click on '''Choose '''

|-
| 11:56
| Change the''' '''extension to''' avi'''. Go to '''Target '''drop-down menu and select''' ffmpeg'''.

|-
| 12:05
| Click on '''End time''' and change it to 200.

And click on '''Render. '''

|-
|12:16
| To see the animation, go to '''Desktop. ''' Select''' Underwater-animation. avi'''

Double-click on it.

|-
| 12:24
| With this, we have come to the end of this tutorial.

|-
| 12:30
| Let us summarize. In this tutorial we learnt about '''Underwater '''animation in '''Synfig.'''

|-
| 12:38
| We also learnt to Import png and svg

|-
| 12:42
| Animate with '''Distortions''' options like '''twirl, stretch.'''

Add '''Noise Gradient.'''

|-
| 12:49
| Use '''Random '''option for '''random animation'''

|-
| 12:53
| Here is an assignment for you. Locate the simple design shape file which is provided in the '''Code files '''link.

Import this file

Animate by using twirl effect

|-
| 13:05
| Your completed assignment should look like this.

|-
| 13:09
| The video at the following link summarizes the Spoken Tutorial project.

Please watch it.

|-
| 13:14
| We conduct workshops using Spoken Tutorials. And give certificates.

Please contact us.

|-
| 13:21
| Please post your timed queries in this forum.

|-
| 13:24
| Spoken Tutorial project is funded by NMEICT, MHRD, Government of India.

|-
| 13:30
| This is Shital along with the Spoken Tutorial Animation Team from IIT Bombay, signing off.

Thanks for joining.

|}

@@ Line 473: / Line 473: @@
 |-
-| 12:24
+| 12:26
 | With this, we have come to the end of this tutorial.

@@ Line 437: / Line 437: @@
 | Change the '''Blend method to''' '''Multiply '''
-and Change''' '''the '''Size '''to 60 to 300''' pixel '''as demonstrated.
+and Change''' '''the '''Size '''to 300''' pixel '''as demonstrated.
 |-
@@ Line 455: / Line 455: @@
 | Go to''' File '''and click on''' Render.''' Go to''' Render setting window'''.
 |-

Synfig/C3/Underwater-animation/English-timed - Revision history

Arthi at 11:58, 4 November 2020

Arthi at 10:36, 4 November 2020

PoojaMoolya: Created page with "{| border=1 | Time | Narration |- | 00:01 | Welcome to the Spoken Tutorial on “'''Underwater- animation” '''using '''Synfig.''' |- | 00..."