Difference between revisions of "Synfig/C2/Overview-of-Synfig/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
 
(One intermediate revision by the same user not shown)
Line 62: Line 62:
  
 
| style="background-color:#ffffff;border:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Next, let us learn some of the features of '''Synfig.'''
 
| style="background-color:#ffffff;border:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Next, let us learn some of the features of '''Synfig.'''
* It works on '''Linux, Windows''' and '''Mac''' OS
+
* It works on '''Linux, Windows''' and '''Mac''' Operating System
 
* It can draw various shapes
 
* It can draw various shapes
 
* Creates text animation   
 
* Creates text animation   
Line 89: Line 89:
  
 
'''Installation of Synfig on Ubuntu OS'''
 
'''Installation of Synfig on Ubuntu OS'''
| style="background-color:#ffffff;border:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Next we will see how to install '''Synfig''' on '''Ubuntu OS.'''
+
| style="background-color:#ffffff;border:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Next we will see how to install '''Synfig''' on '''Ubuntu Linux OS.'''
  
 
|-
 
|-
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"|  
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"|  
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| To follow the installation procedure, you need to be connected to the '''internet'''.
+
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| To follow the installation procedure, you need to be connected to the '''Internet'''.
  
 
|-
 
|-
Line 106: Line 106:
  
 
Enter the system password if required.
 
Enter the system password if required.
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Now in the '''terminal''' type''' sudo apt-get install synfigstudio''' and press '''Enter. '''
+
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Now in the '''terminal''' type''' sudo space apt hyphen get space install synfigstudio''' and press '''Enter. '''
  
  
Line 144: Line 144:
 
|-
 
|-
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Open your default web browser
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Open your default web browser
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| To follow the installation procedure, you need to be connected to the '''internet'''.  
+
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| To follow the installation procedure, you need to be connected to the '''Internet'''.  
  
  
Line 227: Line 227:
 
|-
 
|-
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Click on '''Close.'''
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Click on '''Close.'''
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Click on '''Close. Synfig''' is now successfully installed.  
+
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Click on '''Close.  
 +
 
 +
Synfig''' is now successfully installed.  
  
 
|-
 
|-
Line 375: Line 377:
  
 
|-
 
|-
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"|  
+
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| '''Cutout animation.'''
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| The next tutorial is '''Cutout animation.'''
+
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| The next tutorial is '''"Cutout animation".'''
  
 
In this tutorial we will learn to  
 
In this tutorial we will learn to  
Line 384: Line 386:
 
|-
 
|-
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Show '''Cut out animation''' tutorial
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Show '''Cut out animation''' tutorial
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Here is a glimpse of the tutorial.
 +
 +
|-
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| '''Rocket animation.'''
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| The next tutorial is '''"Rocket animation".'''
 +
 +
In this tutorial we will learn to create
 +
* Fire effect
 +
* Noise Gradient and
 +
* Feather effect
 +
 +
|-
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Show '''Rocket animation''' tutorial
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Here is a glimpse of the tutorial.
 +
 +
|-
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| '''Underwater animation.'''
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| The next tutorial is to create '''"Underwater animation".'''
 +
 +
In this tutorial we will learn to
 +
* Import '''PNGs''' and '''SVGs'''
 +
* Animate the image using '''Distortion effect'''
 +
* Add '''Noise gradient''' and
 +
* Use '''Random option''' for random animation
 +
 +
 +
Using the above, we will learn to create an '''underwater animation'''.
 +
|-
 +
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Show '''Underwater animation''' tutorial
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Here is a glimpse of the tutorial.
 
| style="background-color:#ffffff;border-top:none;border-bottom:1pt solid #000001;border-left:1pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.009cm;padding-right:0.191cm;"| Here is a glimpse of the tutorial.
  

Latest revision as of 16:39, 24 September 2018

Title of script: Overview of Synfig

Author: Arthi & Shital

Keywords: Synfig, Drawing and animating in Synfig, Video tutorial


Visual Cue Narration
Slide: Welcome to the Spoken Tutorial on Overview and Installation of Synfig.
Slide:

Learning objectives


In this tutorial, we will learn about:
  • Interface of Synfig
  • Drawing and animating in Synfig and
  • the content available in various tutorials under this series
Slide:

System Requirements

To record this tutorial, I am using:
  • Ubuntu Linux OS version 16.04
  • Synfig OS version 1.0.2
Slide:

Pre-requisites

To follow this tutorial, you should have knowledge of
  • Inkscape
  • Principles of animation
Slide:

Synfig


First, let us learn about Synfig.
  • Synfig is a 2D animation software.
  • It is a free open source software.
Slide:

Features of Synfig


Next, let us learn some of the features of Synfig.
  • It works on Linux, Windows and Mac Operating System
  • It can draw various shapes
  • Creates text animation
Slide:

Features of Synfig

  • It can import png images and animate those images
  • Creates Cutout animation
  • It also creates Character walk cycle
  • Output can be rendered in gif, avi and various other formats
Slide:

Who can use Synfig?

Synfig can be used by
  • 2D Animators
  • School and college students who are interested in animation.
Slide:

Installation of Synfig on Ubuntu OS

Next we will see how to install Synfig on Ubuntu Linux OS.
To follow the installation procedure, you need to be connected to the Internet.
Press Ctrl + Alt + T together Open the terminal by pressing Ctrl + Alt + T keys together.
Type sudo apt-get install synfigstudio

Press Enter.


Enter the system password if required.

Now in the terminal type sudo space apt hyphen get space install synfigstudio and press Enter.


Enter the system password if required.

Disk space message appears It will display a message of how much disk space will be occupied.
Type Y and press Enter Type Y and press Enter to confirm this.

This will install Synfig.


<<PAUSE>>

Let us check whether the Synfig is installed successfully.
Type synfigstudio and press Enter In the terminal, type synfigstudio and press Enter.
We can see the Synfig console opens.
Slide:

Installation of Synfig on Windows OS

Now let us learn the installation of Synfig on Windows operating system.
Open your default web browser To follow the installation procedure, you need to be connected to the Internet.


Open your default web browser.

In the address bar>>type "https://www.synfig.org/download-stable"


Press Enter

In the address bar, type the url:

https://www.synfig.org/download-stable


Press Enter.

Select windows 64bit / windows 32bit In Choose your OS drop down box, select your OS details - Windows 64bit / Windows 32bit.


I’ll select Windows 64bit.

Type 0(zero)

Press GET SYNFIG

Type your email-id and press Continue

In Name a fair price field, type 0(zero) and press GET SYNFIG.

A popup window appears.


Type your email-id as shown. Click on Continue

Select your location in dropdown box and press Continue.

Click on Complete Checkout

Next, select your location in dropdown box and press Continue.

Click on Complete Checkout.

Check your email <help@paddle.com>


Click on Download

You will get an email from Paddle <help@paddle.com>

Check your email and click on Download button in the mail.

Click on Save


Go to Downloads folder >> Double click on .exe file of synfig.

A popup window appears. Click on Save.


Go to Downloads folder and double click on .exe file of Synfig.

Click on Run button A pop up window appears. Click on Run button.

Synfig Studio Setup window appears.

In License Agreement section, choose I Agree.


Click on Next. Click on Install.

In License Agreement section, choose I Agree.


Click on Next and then on Install.

Click on Close. Click on Close.

Synfig is now successfully installed.

Windows >> Synfig To check, click on Windows button and type Synfig.


You can see Synfig opens up.

Now, we will briefly go through the individual tutorials in this series.
Slide:


Bouncing ball animation


The first tutorial in this series is “Bouncing ball animation”.


Here we will learn to

  • Use Synfig interface
  • Draw a ball in Synfig
  • Add keyframes and waypoints
  • Do a ball animation with squash effect
  • Render the animation in gif format
Show “Bouncing ball animation” tutorial Here is a glimpse of the tutorial.
Slide:

E-card animation


The next tutorial is “E-card animation.

This will help us to

  • Import png images
  • Animate the images
  • Do text animation

Also we will learn to

  • Preview the animation
  • Render the animation in avi format
Show “E-card aniamtion” tutorial Let me play this tutorial.
The next tutorial is “Create a Star animation”
Slide:

Create a Star animation

In this tutorial, we will learn to create
  • Gradient color animation
  • Group layers
  • Star animation
Show “Create a Star animation” tutorial Here is a glimpse of the tutorial.
Slide:

Draw a toy train”

The next tutorial is “Draw a toy train”

In this tutorial, we will learn to

  • Draw basic shapes
  • Color the shapes
  • Group & duplicate objects and
  • Align shapes using Guideline
Show “Draw a toy train” tutorial Let's have a look at this tutorial.
Slide:

“Animate a toy train”

The next tutorial is about “Animate a toy train”.


In this tutorial we will learn to animate the toy train which we created in the previous tutorial.

Show Animate a toy train tutorial Here is a glimpse of the tutorial.
Slide:

Plant animation


The next tutorial is “Plant animation”

Here we will learn to-

  • Add a vertex using Insert item
  • Use Split tangent option
  • Use Mark active point as off option
  • Animate the shapes
Show Plant animation tutorial Here is a glimpse of the tutorial.
Logo animation The next tutorial is “Logo animation”

In this tutorial we will learn to-

  • Use Mirror tool
  • Animate a logo
  • Create Spherize effect
Show Logo animation tutorial Let us have a look at this tutorial
Basic bone animation The next tutorial is “Basic bone animation”

Here, we will learn to

  • Add and attach bones to character
  • Animate the character using Skeleton option
Show Basic bone animation tutorial Here is a glimpse of the tutorial.
Cutout animation. The next tutorial is "Cutout animation".

In this tutorial we will learn to

  • Use the Cutout tool on an image and
  • Animate the cutout shapes
Show Cut out animation tutorial Here is a glimpse of the tutorial.
Rocket animation. The next tutorial is "Rocket animation".

In this tutorial we will learn to create

  • Fire effect
  • Noise Gradient and
  • Feather effect
Show Rocket animation tutorial Here is a glimpse of the tutorial.
Underwater animation. The next tutorial is to create "Underwater animation".

In this tutorial we will learn to

  • Import PNGs and SVGs
  • Animate the image using Distortion effect
  • Add Noise gradient and
  • Use Random option for random animation


Using the above, we will learn to create an underwater animation.

Show Underwater animation tutorial Here is a glimpse of the tutorial.
This brings us to the end of this tutorial. Let us summarize.
Slide:

Summary


In this tutorial, we
  • learnt about Synfig
  • and saw glimpses of the tutorials in this series.
Slide:

About Spoken Tutorial project

The video at the following link summarizes the Spoken Tutorial project.

Please download and watch it.

Slide:

Spoken Tutorial workshops

The Spoken Tutorial Project Team conducts workshops and gives certificates.

For more details, please write to us.

Slide:

Forum for specific questions

  • Do you have questions in THIS Spoken Tutorial?
  • Please visit this site
  • Choose the minute and second where you have the question
  • Explain your question briefly
  • Someone from our team will answer them
Slide:

Forum for specific questions:


  • The Spoken Tutorial forum is for specific questions on this tutorial
  • Please do not post unrelated and general questions on them
  • This will help reduce the clutter
  • With less clutter, we can use these discussion as instructional material
Slide:

Acknowledgement


Spoken Tutorial project is funded by NMEICT, MHRD, Government of India.


More information on this mission is available at this link.

This is Arthi along with animation team from IIT Bombay, signing off. Thanks for watching.

Contributors and Content Editors

Arthi, Nancyvarkey