Difference between revisions of "Synfig/C3/Logo-animation/English-timed"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with "{| border =1 | <center>Time</center> | <center>Narration</center> |- | 00:01 | Welcome to the Spoken Tutorial on “'''Logo animation” '''using '''Synfig.''' |- | 00:0...")
 
Line 5: Line 5:
 
|-
 
|-
 
| 00:01
 
| 00:01
−
|  Welcome to the Spoken Tutorial on “'''Logo animation” '''using '''Synfig.'''
+
|  Welcome to the '''Spoken Tutorial''' on “'''Logo animation” '''using '''Synfig.'''
  
 
|-
 
|-
 
| 00:06
 
| 00:06
−
|  In this tutorial we will learn to Create a Mirror object,
+
|  In this tutorial, we will learn to: create a Mirror object,
  
 
|-
 
|-
 
| 00:10
 
| 00:10
−
|Animate a logo
+
|animate a logo,
  
 
|-
 
|-
 
| 00:12
 
| 00:12
−
| Create '''Spherize effect'''
+
| create '''Spherize effect'''.
  
 
|-
 
|-
 
|  00:15
 
|  00:15
−
|  To record this tutorial, I am using '''Ubuntu Linux''' 14.04 OS ,  '''Synfig '''version 1.0.2
+
|  To record this tutorial, I am using:
 +
'''Ubuntu Linux''' 14.04 OS,   
 +
'''Synfig '''version 1.0.2
  
 
|-
 
|-
Line 45: Line 47:
 
|-
 
|-
 
| 00:49
 
| 00:49
−
|  First let us create a background.
+
|  First, let us create a background.
  
 
|-
 
|-
Line 53: Line 55:
 
|-
 
|-
 
|  00:55
 
|  00:55
−
| '''Under''' the''' Tool options '''in''' Layer Type, Create a region layer''' option must be selected.
+
| Under the''' Tool options '''in''' Layer Type, Create a region layer''' option must be selected.
  
 
|-
 
|-
Line 61: Line 63:
 
|-
 
|-
 
|  01:07  
 
|  01:07  
−
|  Right-click and hold on the first node. The context menu opens.
+
|  Right-click and hold on the first '''node'''. The '''context menu''' opens.
  
 
|-
 
|-
Line 73: Line 75:
 
|-
 
|-
 
|  01:23
 
|  01:23
−
|  We get a triangle filled with the default color.
+
|  We get a triangle filled with the '''default''' color.
  
 
|-
 
|-
 
|  01:27
 
|  01:27
−
|  Let us now save the file by pressing '''Ctrl + S keys.'''
+
|  Let us now '''save''' the file by pressing '''Ctrl + S''' keys.
  
 
|-
 
|-
Line 101: Line 103:
 
|-
 
|-
 
|  01:52
 
|  01:52
−
|  Now change the color to green and the layer name to '''Triangle-1.'''
+
|  Now, change the color to green and the '''layer''' name to '''Triangle-1.'''
  
 
|-
 
|-
Line 117: Line 119:
 
|-
 
|-
 
|  02:14
 
|  02:14
−
|  Select all the nodes of '''Triangle-2''' by clicking and dragging the mouse.
+
|  Select all the nodes of '''Triangle-2''' by clicking and dragging the '''mouse'''.
  
 
|-
 
|-
 
|  02:19
 
|  02:19
−
|  Observe that in the '''Tool options, Vertical '''axis has been selected.
+
|  Observe that in the '''Tool options, Vertical axis''' has been selected.
  
 
|-
 
|-
Line 145: Line 147:
 
|-
 
|-
 
|  02:46
 
|  02:46
−
|  Save the file by pressing '''Ctrl+S keys.'''
+
|  Save the file by pressing '''Ctrl+S''' keys.
  
 
|-
 
|-
Line 181: Line 183:
 
|-
 
|-
 
| 03:25  
 
| 03:25  
−
|  Do the same for the green triangle, too.
+
|  Do the same for the green triangle too.
  
 
|-
 
|-
Line 215: Line 217:
 
|-
 
|-
 
|  04:05
 
|  04:05
−
|  Change the '''Group layer '''name to '''ST'''-'''Logo.'''
+
|  Change the '''Group layer '''name to '''ST-Logo.'''
  
 
|-
 
|-
Line 239: Line 241:
 
|-
 
|-
 
|  04:33
 
|  04:33
−
|  Next let us give rotation effect to the '''logo'''.
+
|  Next, let us give rotation effect to the '''logo'''.
  
 
|-
 
|-
Line 263: Line 265:
 
|-
 
|-
 
|  05:00
 
|  05:00
−
|  Again select the '''logo.png layer.'''
+
|  Again, select the '''logo.png layer.'''
  
 
|-
 
|-
Line 283: Line 285:
 
|-
 
|-
 
| 05:18  
 
| 05:18  
−
|  Next let us type some text.  
+
|  Next, let us type some text.  
  
 
|-
 
|-
 
| 05:21
 
| 05:21
−
| So, click on the '''Text tool '''and click on the '''canvas.'''
+
| So, select the '''Text tool '''and click on the '''canvas.'''
  
 
|-
 
|-
Line 315: Line 317:
 
|-
 
|-
 
|  06:02
 
|  06:02
−
|  Now go to the 70<sup>th</sup> frame and move the text upwards and place it below the logo.
+
|  Now, go to the 70<sup>th</sup> frame and move the text upwards and place it below the logo.
  
 
|-
 
|-
Line 323: Line 325:
 
|-
 
|-
 
|  06:14
 
|  06:14
−
|  Now group the '''Spoken tutorial layer '''and change the group name to '''ST-Text.'''  
+
|  Now, group the '''Spoken tutorial layer '''and change the group name to '''ST-Text.'''  
  
 
|-
 
|-
 
|  06:21
 
|  06:21
−
|  Click on the drop-down list of '''ST-Text group layer.'''
+
|  Click on the drop-down list of the '''ST-Text group layer.'''
  
 
|-
 
|-
Line 359: Line 361:
 
|-
 
|-
 
|  07:02
 
|  07:02
−
|  Lastly, we will render our '''logo animation'''. Before that, save the file.  
+
|  Lastly, we will render our '''logo animation'''. Before that, '''save''' the file.  
  
 
|-
 
|-
Line 371: Line 373:
 
|-
 
|-
 
| 07:18
 
| 07:18
−
|Increase the''' Quality '''to''' 9. ''' , And click on the''' Render '''button.
+
|Increase the''' Quality '''to''' 9 ''' and click on the''' Render '''button.
  
 
|-
 
|-
Line 379: Line 381:
 
|-
 
|-
 
|  07:28
 
|  07:28
−
|Right-click on the output and play using '''Firefox web browser.'''
+
|Right-click on the '''output''' and play using '''Firefox web browser.'''
  
 
|-
 
|-
Line 387: Line 389:
 
|-
 
|-
 
| 07:38
 
| 07:38
−
| You can use your own creativity and create in a different method, too.
+
| You can use your own creativity and create in a different method too.
  
 
|-
 
|-
Line 395: Line 397:
 
|-
 
|-
 
|  07:47
 
|  07:47
−
|  Let us summarize. In this tutorial, we learnt to Create a Mirror object,
+
|  Let us summarize. In this tutorial, we learnt to:
 +
create a Mirror object,
  
 
|-
 
|-
 
| 07:53
 
| 07:53
−
|  Animate a logo, Create '''Spherize '''effect  
+
|  animate a logo,
 +
create '''Spherize '''effect.
  
 
|-
 
|-
 
| 07:57
 
| 07:57
−
|  Here is an assignment for you.Create a logo animation using the '''Synfig logo'''.
+
|  Here is an assignment for you. Create a logo animation using the '''Synfig logo'''.
 
   
 
   
 
|-
 
|-
Line 415: Line 419:
 
|-
 
|-
 
|08:12  
 
|08:12  
−
|  The video available at the following link summarizes the Spoken Tutorial project.  
+
|  The video available at the following link summarizes the '''Spoken Tutorial''' project.  
−
 
+
Please watch it.  
−
Pls watch it.  
+
  
 
|-
 
|-
Line 433: Line 436:
 
|-
 
|-
 
|  08:30
 
|  08:30
−
|  Spoken Tutorial Project is supported by NMEICT, MHRD, Government of India.  
+
|  Spoken Tutorial Project is supported by '''NMEICT, MHRD,''' Government of India.  
  
 
|-
 
|-
 
| 08:36
 
| 08:36
−
| More information on this Mission is available at this link.  
+
| More information on this mission is available at this link.  
  
 
|-
 
|-
 
|  08:41
 
|  08:41
−
|  This is Arthi along with the Animation team from IIT Bombay, signing off.  
+
|  This is Arthi from IIT Bombay, signing off.  
  
 
Thanks for joining.  
 
Thanks for joining.  
  
 
|}
 
|}

Revision as of 13:39, 22 September 2018

Time
Narration
00:01 Welcome to the Spoken Tutorial on “Logo animation” using Synfig.
00:06 In this tutorial, we will learn to: create a Mirror object,
00:10 animate a logo,
00:12 create Spherize effect.
00:15 To record this tutorial, I am using:

Ubuntu Linux 14.04 OS, Synfig version 1.0.2

00:26 Let us open Synfig.
00:28 Go to canvas. Click on Properties.
00:31 Under the Image, change the Width to 1920 and Height to 1080.
00:40 Click on Other. Under Locks and Links, tick on all the checkboxes.
00:47 Click on Apply and OK.
00:49 First, let us create a background.
00:52 Select the Spline tool.
00:55 Under the Tool options in Layer Type, Create a region layer option must be selected.
01:01 Draw a right-angled triangle covering half of the canvas as shown.
01:07 Right-click and hold on the first node. The context menu opens.
01:12 Right-click again and select Loop Spline. Now the loop is completed.
01:20 Next, click on the Transform tool.
01:23 We get a triangle filled with the default color.
01:27 Let us now save the file by pressing Ctrl + S keys.
01:32 I will change the default name to Logo-animation.
01:37 And save this file on the Desktop.
01:40 You can give any name that you want.
01:44 Next, we will change the color of this triangle.
01:47 To do so, in the Parameters panel, click on the Color parameter.
01:52 Now, change the color to green and the layer name to Triangle-1.
02:01 Duplicate the layer and change the name to Triangle-2.
02:06 Then change the color to yellow.
02:10 Now go to the Tool box and select Mirror tool.
02:14 Select all the nodes of Triangle-2 by clicking and dragging the mouse.
02:19 Observe that in the Tool options, Vertical axis has been selected.
02:25 Now click on the top left node of the triangle.
02:29 Flip it in the vertical direction as demonstrated.
02:33 Once again in the Tool options, change the axis to Horizontal.
02:38 Now, click on the bottom left node of the triangle.
02:41 Flip it in the horizontal direction as demonstrated.
02:46 Save the file by pressing Ctrl+S keys.
02:50 As we go forward, I will not explicitly say so. But please do so at regular intervals.
02:57 Next, let us animate these 2 triangles.
03:00 Select the Transform tool.
03:02 Click on Turn on animate editing mode icon.
03:06 Type 20 in the current frame box and press Enter.
03:11 In the Keyframes panel, add a keyframe.
03:15 Come back to the zeroth frame.
03:17 Click on the green dot of the yellow triangle and move it outside the canvas, as demonstrated.
03:25 Do the same for the green triangle too.
03:28 Click on Turn off animate editing mode icon.
03:32 Move the Time cursor between zeroth and 20th frame to check the animation.
03:39 Next, let us import the Spoken Tutorial logo.
03:42 I have the logo in my Documents folder.
03:46 You can find this logo file in the Code files link that is provided along with this tutorial.

Please download and use it.

03:55 Go to File and click on Import.
03:59 Since I want to give Rotate effect to the layer, we will first group the logo layer.
04:05 Change the Group layer name to ST-Logo.
04:09 Reduce the size of the logo using the orange dot in the handle.
04:14 Now click on Turn on animate editing mode icon.
04:18 Go to the zeroth frame.
04:20 Then click on the drop-down list of ST-Logo group layer and select logo.png layer.
04:27 In the Parameters panel, change the Alpha amount to zero.
04:33 Next, let us give rotation effect to the logo.
04:37 For that, first right-click on logo.png layer.
04:41 Then click on New layer, Transform and lastly on Rotate.
04:47 Now go to the 50th frame.
04:50 In the Keyframes panel, add a keyframe.
04:54 In the Parameters panel, change the rotation amount to 360.
05:00 Again, select the logo.png layer.
05:04 Now go to the 60th frame.
05:06 Move the logo a little upward, as demonstrated.
05:10 Click on Turn off animate editing mode icon.
05:14 Click outside the canvas to deselect the logo.
05:18 Next, let us type some text.
05:21 So, select the Text tool and click on the canvas.
05:25 A text box appears. Here I will type Spoken Tutorial. Click on Ok.
05:34 In the Parameters panel, change the color of the text to black and size of the text to 100.
05:43 I will change the layer name to Spoken Tutorial.
05:47 Click on the Transform tool and select the green dot of the text.
05:53 Move the text outside the canvas in the downward direction as demonstrated.
05:59 Click on Turn on animate editing mode icon.
06:02 Now, go to the 70th frame and move the text upwards and place it below the logo.
06:09 Once again, click on Turn off animate editing mode icon.
06:14 Now, group the Spoken tutorial layer and change the group name to ST-Text.
06:21 Click on the drop-down list of the ST-Text group layer.
06:25 Right-click on Spoken Tutorial layer and then on New layer.
06:30 Now click on Distortions and then on Spherize.
06:35 Click on the middle green dot of the Spherize effect and drag to the starting of the text.
06:42 Click and drag the left green dot to make the effect bigger.
06:47 Once again click on Turn on animate editing mode icon.
06:51 This time go to the 100th frame and move the effect outside the canvas.
06:57 Now click on Turn off animate editing mode icon.
07:02 Lastly, we will render our logo animation. Before that, save the file.
07:08 Now go to File and click on Render.
07:11 Change the Extension to avi. . Change the Target to ffmpeg.
07:18 Increase the Quality to 9 and click on the Render button.
07:25 Let us now check our file. Go to Desktop.
07:28 Right-click on the output and play using Firefox web browser.
07:34 Our logo animation looks like this.
07:38 You can use your own creativity and create in a different method too.
07:43 With this we have come to the end of this tutorial.
07:47 Let us summarize. In this tutorial, we learnt to:

create a Mirror object,

07:53 animate a logo,

create Spherize effect.

07:57 Here is an assignment for you. Create a logo animation using the Synfig logo.
08:03 The logo has been given to you in the Code files link.
08:08 Your completed assignment should look like this.
08:12 The video available at the following link summarizes the Spoken Tutorial project.

Please watch it.

08:18 Please post your time queries in this forum.
08:21 The Spoken Tutorial Project Team conducts workshops and gives certificates.
08:26 For more details, please write to us.
08:30 Spoken Tutorial Project is supported by NMEICT, MHRD, Government of India.
08:36 More information on this mission is available at this link.
08:41 This is Arthi from IIT Bombay, signing off.

Thanks for joining.

Contributors and Content Editors

PoojaMoolya, Sandhya.np14

Retrieved from "https://script.spoken-tutorial.org/index.php?title=Synfig/C3/Logo-animation/English-timed&oldid=44434"