Difference between revisions of "Synfig/C2/Draw-a-Toy-train/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with "'''Title of script: Draw a Toy train''' '''Author:''' Arthi '''Keywords:''' Synfig, Draw & color basic shapes, Group & duplicate objects, Align shapes using '''Guideline, ''...")
 
 
(One intermediate revision by one other user not shown)
Line 23: Line 23:
 
* Group & duplicate objects and
 
* Group & duplicate objects and
 
* Align shapes using '''Guideline'''
 
* Align shapes using '''Guideline'''
−
 
−
 
  
 
|-
 
|-
Line 32: Line 30:
 
* '''Ubuntu Linux '''14.04 OS  
 
* '''Ubuntu Linux '''14.04 OS  
 
* '''Synfig version '''1.0.2
 
* '''Synfig version '''1.0.2
−
 
−
 
  
 
|-
 
|-
Line 110: Line 106:
  
  
−
I will change the color to blue.
+
I will change the color to red.
  
 
|-
 
|-
Line 128: Line 124:
  
 
Rename the group layer as '''Compartment-3.'''
 
Rename the group layer as '''Compartment-3.'''
−
 
−
 
−
 
  
 
|-
 
|-
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Resize the layer & place it in the left of the '''canvas'''
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Resize the layer & place it in the right of the '''canvas'''
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Resize the layer using the orange dot of the '''handle'''.
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Resize the layer using the orange dot of the '''handle'''.
  
  
−
Move it to the left of the '''canvas '''using the green dot of the '''handle.'''
+
Move it to the right of the '''canvas '''using the green dot of the '''handle.'''
  
  
−
<nowiki><<PAUSE>></nowiki>
+
<<PAUSE>>
  
 
|-
 
|-
Line 147: Line 140:
  
 
|-
 
|-
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Click outside the '''canvas >> '''
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Click outside the '''canvas'''
  
  
Line 162: Line 155:
 
|-
 
|-
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| '''Tool options''' >> '''Create a region layer >> '''Draw a circle
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| '''Tool options''' >> '''Create a region layer >> '''Draw a circle
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| In '''Tool options,''' '''Create a region layer''' should be selected.
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| In '''Tool options, Create a region layer''' should be selected.
  
  
Line 179: Line 172:
  
 
|-
 
|-
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Select '''Transform tool >> '''
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Select '''Transform tool'''
  
  
Line 186: Line 179:
  
  
−
Observe there is 1 '''handle''' and 3 dots.
+
Observe there is 1 '''handle''' and 2 dots.
  
  
Line 201: Line 194:
 
|-
 
|-
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Drag the third green dot
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Drag the third green dot
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| The third dot is used for resizing.
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| The last dot is used for resizing.
  
 
|-
 
|-
Line 222: Line 215:
  
 
|-
 
|-
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Select all layers >> Group them >>''' '''
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Select all layers >> Group them >> Duplicate twice
−
 
+
−
Duplicate twice
+
  
  
Line 231: Line 222:
  
  
−
Click on the '''Duplicate''' icon twice.
+
Now click on the '''Duplicate''' icon twice.
  
 
|-
 
|-
Line 246: Line 237:
 
|-
 
|-
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Move the '''Compartment-3''' folder layer
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Move the '''Compartment-3''' folder layer
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Do likewise in the '''Compartment-3''' group layer.  
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Do likewise for the '''Compartment-1''' group layer.  
  
 
|-
 
|-
Line 253: Line 244:
  
  
−
<nowiki><<PAUSE>></nowiki>
+
<<PAUSE>>
  
 
|-
 
|-
Line 278: Line 269:
  
 
Change color to yellow
 
Change color to yellow
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Then click on''' '''the '''Rectangle tool '''and draw a rectangle on the top of the circle covering half of it.  
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Then click on the '''Rectangle tool '''and draw a rectangle on the top of the circle covering half of it.  
  
  
Line 312: Line 303:
 
|-
 
|-
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Press''' Ctrl + S'''
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Press''' Ctrl + S'''
−
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Save the file by pressing '''Ctrl '''and '''S''' keys. Click on any one of the compartment’s drop down list.  
+
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Save the file by pressing '''Ctrl '''and '''S''' keys.  
  
  
−
Select and copy both '''Wheel-1 '''and''' Wheel-2 group layers.'''
+
Click on any one of the compartment’s drop down list.  
−
 
+
  
  
 +
Select and copy both '''Wheel-1 '''and''' Wheel-2''' group layers.
  
 
|-
 
|-
Line 331: Line 322:
  
  
−
<nowiki><<PAUSE>></nowiki>
+
<<PAUSE>>
  
 
|-
 
|-
Line 338: Line 329:
  
  
−
This '''guidelin'''e will help us to align the compartments & engine in a straight line.  
+
This '''guideline''' will help us to align the compartments & engine in a straight line.  
  
 
|-
 
|-
Line 371: Line 362:
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Point to the train
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Point to the train
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Now the train drawing is complete.
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Now the train drawing is complete.
−
 
−
 
−
 
  
 
|-
 
|-
Line 380: Line 368:
  
  
−
<nowiki><<PAUSE>></nowiki>
+
<<PAUSE>>
  
 
|-
 
|-
Line 396: Line 384:
 
* Group & duplicate objects and  
 
* Group & duplicate objects and  
 
* Align shapes using the '''Guideline'''
 
* Align shapes using the '''Guideline'''
−
 
−
 
  
 
|-
 
|-
Line 405: Line 391:
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Here is an assignment for you-
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Here is an assignment for you-
  
−
 
+
* Draw a bus in '''Synfig '''as explained in this tutorial.
−
* Draw a bus in '''Synfig '''as explained in this tutorial'''.'''
+
−
 
+
−
 
+
  
 
|-
 
|-
Line 420: Line 403:
  
 
Please download and watch it.
 
Please download and watch it.
−
 
−
 
−
 
  
 
|-
 
|-
Line 430: Line 410:
  
 
For more details, please write to us.
 
For more details, please write to us.
−
 
−
 
−
 
  
 
|-
 
|-
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Spoken Tutorial Forum slide  
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Spoken Tutorial Forum slide  
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Please post your timed queries in this forum.
 
| style="background-color:#ffffff;border:0.5pt solid #000001;padding-top:0in;padding-bottom:0in;padding-left:0.0382in;padding-right:0.0389in;"| Please post your timed queries in this forum.
−
 
−
 
−
 
  
 
|-
 
|-
Line 446: Line 420:
  
  
−
More information on this mission is available at
+
More information on this mission is available at this link.
−
 
+
−
this link.
+
−
 
+
−
 
+
−
 
+
  
 
|-
 
|-
Line 461: Line 430:
  
 
|}
 
|}
−
‘’
 

Latest revision as of 21:00, 15 October 2020

Title of script: Draw a Toy train

Author: Arthi

Keywords: Synfig, Draw & color basic shapes, Group & duplicate objects, Align shapes using Guideline, Draw a toy train


Visual cue
Narration
Opening Slide Welcome to the Spoken Tutorial on “Draw a Toy train” using Synfig.
Learning Objectives (Slide) In this tutorial we will learn to
  • Draw basic shapes
  • Color the shapes
  • Group & duplicate objects and
  • Align shapes using Guideline
System requirement (Slide) To record this tutorial, I am using
  • Ubuntu Linux 14.04 OS
  • Synfig version 1.0.2
Open Synfig Let us open Synfig.
Point to canvas First, we will draw the compartment of the toy train.
Select Rectangle tool For this, select the Rectangle tool.


In the Tool options, check if Create a region layer is selected.

Draw a rectangle >> Change the color to green Now, draw a rectangle on the canvas.


Change the layer name to Part-1.


Go the Parameters panel and change the color to green.

Click on the Transform tool >> Click outside the canvas Click on the Transform tool now.


Then click outside the canvas to deselect the shape.


Remember to do this step after drawing any shape on the canvas.


<<PAUSE>>

Save the file Let us save our file. Go to File. Click on Save as.


Change the filename to Toy-Train-animation. Save it in your Desktop.


<<PAUSE>>

Select the Rectangle tool >> Draw a rectangle on the top of the previous rectangle Now, select the Rectangle tool once again.


Draw a rectangle in the centre of the previous rectangle as shown.


This will be the window of the train. Let’s rename this layer as Window.

Click on Polygon tool >> Tool options >> Create a region layer Next, click on the Polygon tool.

In Tool options, check if Create a region layer option is selected.

Draw a trapezium >> Change the color to blue Draw a trapezium above the rectangle as shown.


Click on the starting point to close the trapezium.


Rename this layer as Part-2.


I will change the color to red.

Select the Transform tool Now, select the Transform tool.
Layers panel >> Group the layers


Rename as Compartment-3

Go to Layers panel.


Select all the layers and group them.


Rename the group layer as Compartment-3.

Resize the layer & place it in the right of the canvas Resize the layer using the orange dot of the handle.


Move it to the right of the canvas using the green dot of the handle.


<<PAUSE>>

Press Ctrl + S Save the file by pressing Ctrl and S keys.
Click outside the canvas


Next let us draw the wheel of the train.


Remember to click outside the canvas to deselect the shape after drawing any shape.

Select the Circle tool Select the Circle tool.
Tool options >> Create a region layer >> Draw a circle In Tool options, Create a region layer should be selected.


Draw a circle as shown and change the color to dark blue.

Select Star tool >> Tool options >> Create a star layer Now select the Star tool.


In Tool options, Create a star layer should be selected.

Draw a star Keep the cursor in the centre of the circle and draw a star.
Select Transform tool


Point to the handle and dots

Now select the Transform tool.


Observe there is 1 handle and 2 dots.


Click and drag the green dot of the handle to change the position of the shape.

Use the blue dot of the handle for rotation.
Drag the middle green dot The middle green dot allows adjustment of the outer edge of the star shape.
Drag the third green dot The last dot is used for resizing.
Group star & circle layers>> Rename as Wheel-1 Select both the star and the circle layers.


Group them and then rename as Wheel-1.

Resize this group layer and place it below the compartment.
Duplicate Wheel-1 >> Rename as Wheel-2 Now duplicate the Wheel-1 group layer.


Rename as Wheel-2 and move to the other end of the compartment.

Select all layers >> Group them >> Duplicate twice


Now select all the group layers. Group them again and rename as Compartment-3.


Now click on the Duplicate icon twice.

Rename as Compartment-2 & Compartment-1 Rename the duplicated folder as Compartment-2 & Compartment-1 respectively.
Move Compartment-2 Select Compartment-2 group layer.


Use the Shift key and drag the middle green dot of the handle.

Move the Compartment-3 folder layer Do likewise for the Compartment-1 group layer.
Press Ctrl + S Save the file by pressing Ctrl and S keys.


<<PAUSE>>

Draw a circle >> Rename as Engine-part-1


Change the color to pink

Next let us draw the engine.


Select the Circle tool and draw a circle as shown.


Rename the layer as Engine-part-1.


Change the color to pink.

Click on Rectangle tool >> Draw another rectangle >>


Rename as Engine-part-2

Change color to yellow

Then click on the Rectangle tool and draw a rectangle on the top of the circle covering half of it.


Rename the layer as Engine-part-2 and change the color to yellow.

Draw another rectangle >>

Rename the layer as Engine-part-3

Change the color to green

Draw one more rectangle on the top of the current rectangle.


Rename the layer as Engine-part-3 and change the color to green.

Draw the window >>

Rename the layer as Engine-window

Using the same rectangle tool, draw the window as shown.


Rename the layer as Engine-window.

Group rectangle & circle layers >> Rename as Engine Select the layers of the engine and group them.


Then rename as Engine.

Press Ctrl + S Save the file by pressing Ctrl and S keys.


Click on any one of the compartment’s drop down list.


Select and copy both Wheel-1 and Wheel-2 group layers.

Paste in the Engine group layer


Paste in the Engine group layer.


Using Shift key drag these wheels to the bottom of the engine.


<<PAUSE>>

Drag & place the guideline in the bottom of the compartments Now, drag a guideline from the top ruler and place it at the bottom of the compartments.


This guideline will help us to align the compartments & engine in a straight line.

Align the engine Next, move & align the Engine next to Compartment-1.
Draw a Belt >> Color it black Then draw a rectangle to link all the compartments.


Rename the layer as Belt and change the color to black.


Move the Belt layer to the bottom of the Layers list.

Click on the Rectangle tool Lastly, let us draw the rail.


Click on the Rectangle tool.

Draw a rectangle >> Change the layer name as Rail >> Change the color to black. Draw a rectangle below the wheel, as demonstrated here.


Change the layer name as Rail and change the color to black.

Point to the train Now the train drawing is complete.
Save the file Lastly, press Ctrl + S to save our file once again.


<<PAUSE>>

Summary (Slide) With this, we have come to the end of this tutorial.


Let us summarize.


In this tutorial, we learnt to

  • Draw basic shapes
  • Color the shapes
  • Group & duplicate objects and
  • Align shapes using the Guideline
Assignment

(Slide)

Here is an assignment for you-
  • Draw a bus in Synfig as explained in this tutorial.
Completed assignment Your completed assignment should look like this.
About project slide This video summarizes the Spoken Tutorial project.


Please download and watch it.

Workshop slide The Spoken Tutorial Project team conducts workshops and gives certificates on passing online tests.


For more details, please write to us.

Spoken Tutorial Forum slide Please post your timed queries in this forum.
Acknowledgment Spoken Tutorial Project is funded by NMEICT, MHRD, Government of India.


More information on this mission is available at this link.

Acknowledgment This is Arthi along with the Spoken Tutorial Animation Team from IIT Bombay, signing off.


Thanks for joining.

Contributors and Content Editors

Arthi, Nancyvarkey

Retrieved from "https://script.spoken-tutorial.org/index.php?title=Synfig/C2/Draw-a-Toy-train/English&oldid=54043"