Difference between revisions of "Inkscape/C3/Design-a-visiting-card/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with "'''Title of script: Design a Visiting card''' '''Author:''' Arthi. A '''Keywords:''' Document settings for a visiting card in Inkscape, Design a visiting card, Settings to...")
 
Line 17: Line 17:
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Learning Objectives (Slide)
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Learning Objectives (Slide)
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| In this tutorial
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| In this tutorial, we will learn:
 
+
 
+
We will learn to
+
 
+
* Document settings for a visiting card
+
* Design a visiting card
+
* Settings to print multiple''' '''visiting cards<br/>
+
 
+
 
+
  
 +
* Settings for a visiting card
 +
* Designing a visiting card
 +
* Settings to print multiple copies of the visiting card
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| System requirement (Slide)
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| System requirement (Slide)
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| To record this tutorial, I am using
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| To record this tutorial, I am using
 
  
 
* '''Ubuntu Linux''' 12.04 OS
 
* '''Ubuntu Linux''' 12.04 OS
 
* '''Inkscape''' version 0.48.4
 
* '''Inkscape''' version 0.48.4
 
 
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Open '''Inkscape'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Open '''Inkscape'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us open''' Inkscape.'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us open''' Inkscape.'''
 
 
 
  
 
|-
 
|-
Line 50: Line 38:
  
  
Change the''' Default Orientation '''to''' Landscape and Default units '''to''' Inches.'''
+
Change the '''Default units '''to''' Inches''' and ''' Default Orientation '''to''' Landscape.
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Go to''' File. '''Click on''' Document properties.'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Go to''' File. '''Click on''' Document properties.'''
  
  
Change the''' Default Orientation '''to''' Landscape '''and '''Default units '''to''' Inches.'''
+
Change the '''Default units '''to''' Inches''' and the ''' Default Orientation '''to''' Landscape.'''
  
  
Line 62: Line 50:
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the '''canvas'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the '''canvas'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us now start designing the visiting card now.
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us now start designing the visiting card now.
 
 
 
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Draw a rectangle
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Draw a rectangle
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| So draw a rectangle using the '''Rectangle tool. '''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| So, draw a rectangle using the '''Rectangle tool. '''
  
  
 
On the '''Tool controls bar, '''change the '''width to 3.5 '''and '''height '''to '''2.'''
 
On the '''Tool controls bar, '''change the '''width to 3.5 '''and '''height '''to '''2.'''
 
 
 
  
 
|-
 
|-
Line 90: Line 72:
  
 
|-
 
|-
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| '''Bezier tool''' >> Draw straight line
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| '''Bezier tool''' >> Draw straight line >> '''Object menu >> Fill and Stroke'''
  
 
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Select the '''Bezier tool ''' and draw a wavy line.  
'''Object menu >> Fill and Stroke'''
+
 
+
 
+
 
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Select the '''Bezier tool. '''Draw a wavy line.  
+
  
  
 
Go to '''Object menu.''' Open '''Fill and Stroke.'''
 
Go to '''Object menu.''' Open '''Fill and Stroke.'''
 
 
 
  
 
|-
 
|-
Line 112: Line 86:
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Draw a wavy line
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Draw a wavy line
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now draw a straight line below the straight line.
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now draw a straight line below the straight line.
 
 
 
  
 
|-
 
|-
Line 120: Line 91:
  
  
'''Extensions menu >> Modify path >> Interpolate'''
+
'''Extensions menu >> Generate from path >> Interpolate'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Select both the lines. Go to '''Extensions menu.'''  
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Select both the lines. Go to '''Extensions menu.'''  
  
  
Click on '''Modify path''' and then on '''Interpolate.'''
+
Click on '''Generate from path''' and then on '''Interpolate.'''
  
 +
|-
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| click on '''Apply''' >> '''Close'''
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Keep the default settings and click on '''Apply''' button.
  
  
 +
Now click on '''Close''' button.
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Move it to the top left
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Move it to the top left
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Notice the '''interpolation''' effect is applied.
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Notice the '''interpolation''' effect is now applied.
  
  
Line 142: Line 117:
  
 
Go to '''Filters menu.''' Click on '''Shadows and Glows '''and then on''' Glow.'''
 
Go to '''Filters menu.''' Click on '''Shadows and Glows '''and then on''' Glow.'''
 
 
 
  
 
|-
 
|-
Line 155: Line 127:
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Show the''' Spoken Tutorial logo'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Show the''' Spoken Tutorial logo'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us import the '''Spoken Tutorial''' '''logo''' now.  
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us import the '''Spoken Tutorial logo''' now.  
 
+
 
+
I have saved it in my Documents folder.
+
 
+
  
  
 +
I have saved it in my '''Documents''' folder.
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Show the''' Spoken Tutorial logo'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Show the''' Spoken Tutorial logo'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| The logo has been given to you in the '''Code files''' link.
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| The logo has been given to you in the '''Code files''' link.
 
 
 
  
 
|-
 
|-
Line 175: Line 141:
  
 
Resize and keep on left corner
 
Resize and keep on left corner
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Go to '''File.''' Click on '''Import.'''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Go to '''File''' and click on '''Import.'''
  
  
Line 181: Line 147:
  
 
|-
 
|-
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Type''' Spoken Tutorial >> '''Make it '''bold >> '''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Type''' Spoken Tutorial >> '''Make it bold >>  
  
  
'''Font size to 16 '''
+
'''Font size''' to '''16 '''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Type '''Spoken Tutorial''' to the right of the '''logo.''' Make it '''bold.'''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Type '''Spoken Tutorial''' to the right of the logo. Make it bold.
  
  
 
Change the font size to 16.
 
Change the font size to 16.
 
 
 
  
 
|-
 
|-
Line 212: Line 175:
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the visiting card
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the visiting card
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Next we have to create multiple copies of the visiting card.  
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Next, we  
 +
will learn to create multiple copies of the visiting card.  
  
  
 
We can do this by '''cloning''' method.
 
We can do this by '''cloning''' method.
 
 
 
  
 
|-
 
|-
Line 225: Line 186:
  
 
'''Ctrl + G'''
 
'''Ctrl + G'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| For doing that we should group all the elements.  
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| For doing that, we should first group all the elements.  
 
+
 
+
Press '''Ctrl + A''' to select all and press '''Ctrl + G '''to group them.
+
 
+
  
  
 +
Press '''Ctrl + A''' to select all the elements and '''Ctrl + G '''to group them.
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| '''Edit menu >> Clone >> Create Tiled Clones'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| '''Edit menu >> Clone >> Create Tiled Clones'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now, go to '''Edit menu. '''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now, go to the '''Edit menu. '''
  
 
Click on '''Clone''' and then on '''Create Tiled Clones.'''
 
Click on '''Clone''' and then on '''Create Tiled Clones.'''
  
 
+
|-
 
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"|
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"|The '''Create Tiled Clone''' dialog box opens.
  
 
|-
 
|-
Line 250: Line 209:
  
  
Click on '''OK.'''
+
|-
 
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Click on '''Create''' button >> close the dialog box.
  
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"|Now, click on '''Create''' button.
  
 +
And then close the dialog box.
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the visiting cards
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the visiting cards
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Notice multiple copies of the visiting card is created.
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Notice that multiple copies of the visiting card appears in the draw area.
  
 
+
|-
In this way we can print multiple visiting cards.
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"|
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"|In this way, we can print multiple copies of the visiting card.
  
 
|-
 
|-
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Delete the topmost visiting card
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Click on the topmost visiting card >> move it from its position
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| On the top there are 2 visiting cards.  
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"|Turn your attention to the visiting card at the top left.  
  
  
Click on it and delete.
+
Click on it and move it from its position.
  
 +
|-
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Delete it
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now delete this card as it is an extra copy.
  
 +
|-
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the visiting cards
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| What if there are some changes to be incorporated? 
  
 +
 +
Will we have to change each and every copy of the visiting card?
  
 
|-
 
|-
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Point to the visiting cards
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"|  
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now if any change is required in all the cards, it is enough if we make the correction only on the original card.
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Not at all.  We will have to make the correction only in the original visiting card.
 
+
  
  
 +
The same will be reflected in the copies.
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Move the contact details to the left
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Move the contact details to the left
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| For example, let me move the contact details to the left side on the original card.  
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let's try this.  Let's move the contact details to the left side on the original card.  
  
  
Observe the changes are made in all the visiting cards.
+
Observe the changes are reflected in all the visiting card copies.
  
  
Line 291: Line 261:
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Press '''Ctrl + S'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Press '''Ctrl + S'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now let us save the '''SVG''' file.
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Now let us save the file.
 
+
 
+
Press '''Ctrl + S''' to save the '''SVG''' file. Let me save the file in '''Desktop.'''
+
 
+
  
  
 +
Press '''Ctrl + S''' to save the '''SVG''' file.  I will choose '''Desktop''' as the location to save my file.
  
 
|-
 
|-
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Type''' ST_visiting card >> '''Click on '''Save'''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Type''' ST-visiting-card >> '''Click on '''Save'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Type the '''Filename''' as '''ST_visiting card''' and click on '''Save. '''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| And I will type '''ST-visiting-card''' as the '''Filename''' and click on '''Save. '''
 
+
 
+
 
+
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| '''Go to File >> Save As'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| '''Go to File >> Save As'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Next let us save the file as '''PDF. '''
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| After this, we will save the file in '''PDF''' format.
  
  
Go to '''File.''' Click on '''Save As.'''
+
Once again, go to '''File''' and click on '''Save As.'''
  
 
|-
 
|-
Line 317: Line 281:
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Change the extension to '''PDF''' and click on '''Save.'''
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Change the extension to '''PDF''' and click on '''Save.'''
  
 +
|-
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Close '''Inkscape''' >> come to the Desktop >> point to the pdf file >> double-click to open it.
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us close '''Inkscape''' now and come to the Desktop.
  
<nowiki><<PAUSE>></nowiki>
 
  
|-
+
Here is the file that we saved - '''ST-visiting-card.pdf'''
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Summarize
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us summarize
+
  
  
In this tutorial, we learnt to
+
Let's open it.
  
 +
Here are the visiting cards that we created.
  
* Settings for a visiting card
+
<nowiki><<PAUSE>></nowiki>
* Design a visiting card
+
* Settings to print multiple''' '''visiting cards
+
  
 +
|-
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Summarize
 +
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Let us summarize.
  
 +
 +
In this tutorial, we learnt about
 +
* Settings for a visiting card
 +
* Designing a visiting card
 +
* Settings to print multiple copies of the visiting card
  
 
|-
 
|-
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Assignment
 
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:none;padding:0.097cm;"| Assignment
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Create a Visiting card on your name.
+
| style="border-top:none;border-bottom:0.05pt solid #000000;border-left:0.05pt solid #000000;border-right:0.05pt solid #000000;padding:0.097cm;"| Here is an assignment for you.
 +
 
 +
Create a visiting card with
 +
*your name
 +
*your institute/organisation name
 +
*your institute/organisation logo
 +
*your institute/organisation website address
  
 
|-
 
|-

Revision as of 16:22, 2 June 2015

Title of script: Design a Visiting card

Author: Arthi. A

Keywords: Document settings for a visiting card in Inkscape, Design a visiting card, Settings to print multiple visiting cards


Visual cue
Narration
Opening Slide Welcome to the Spoken Tutorial on “Design a Visiting card” using Inkscape.
Learning Objectives (Slide) In this tutorial, we will learn:
  • Settings for a visiting card
  • Designing a visiting card
  • Settings to print multiple copies of the visiting card
System requirement (Slide) To record this tutorial, I am using
  • Ubuntu Linux 12.04 OS
  • Inkscape version 0.48.4
Open Inkscape Let us open Inkscape.
Go to File >> Document properties >>


Change the Default units to Inches and Default Orientation to Landscape.

Go to File. Click on Document properties.


Change the Default units to Inches and the Default Orientation to Landscape.


<<PAUSE>>

Point to the canvas Let us now start designing the visiting card now.
Draw a rectangle So, draw a rectangle using the Rectangle tool.


On the Tool controls bar, change the width to 3.5 and height to 2.

Change color to dark green Change the color to dark green.


Move it to the top left corner of the canvas.


Let us design a pattern now.


<<PAUSE>>

Bezier tool >> Draw straight line >> Object menu >> Fill and Stroke Select the Bezier tool and draw a wavy line.


Go to Object menu. Open Fill and Stroke.

Change stroke color to yellow. Change the stroke color to yellow.
Draw a wavy line Now draw a straight line below the straight line.
Select both lines >>


Extensions menu >> Generate from path >> Interpolate

Select both the lines. Go to Extensions menu.


Click on Generate from path and then on Interpolate.

click on Apply >> Close Keep the default settings and click on Apply button.


Now click on Close button.

Move it to the top left Notice the interpolation effect is now applied.


Move it to the left of the visiting card.

Filters menu >> Shadows and Glows >> Glow Let us give some glow effect to the Interpolate design.


Go to Filters menu. Click on Shadows and Glows and then on Glow.

Point to the design Observe the glow effect is applied to the design.


<<PAUSE>>

Show the Spoken Tutorial logo Let us import the Spoken Tutorial logo now.


I have saved it in my Documents folder.

Show the Spoken Tutorial logo The logo has been given to you in the Code files link.
File >> Import >>


Resize and keep on left corner

Go to File and click on Import.


Resize the logo and keep it on the top left corner.

Type Spoken Tutorial >> Make it bold >>


Font size to 16

Type Spoken Tutorial to the right of the logo. Make it bold.


Change the font size to 16.

Type contact details >>


Font size to 12

Type the contact details in the middle area.


Change the font size to 12.

Point to the visiting card Now our visiting card for Spoken Tutorial is ready.


<<PAUSE>>

Point to the visiting card Next, we

will learn to create multiple copies of the visiting card.


We can do this by cloning method.

Press Ctrl + A and


Ctrl + G

For doing that, we should first group all the elements.


Press Ctrl + A to select all the elements and Ctrl + G to group them.

Edit menu >> Clone >> Create Tiled Clones Now, go to the Edit menu.

Click on Clone and then on Create Tiled Clones.

The Create Tiled Clone dialog box opens.
Under Symmetry tab >>


change the number of rows to 4 and columns to 3

Under the Symmetry tab, change the number of rows to 4 and columns to 3.


Click on Create button >> close the dialog box. Now, click on Create button.

And then close the dialog box.

Point to the visiting cards Notice that multiple copies of the visiting card appears in the draw area.
In this way, we can print multiple copies of the visiting card.
Click on the topmost visiting card >> move it from its position Turn your attention to the visiting card at the top left.


Click on it and move it from its position.

Delete it Now delete this card as it is an extra copy.
Point to the visiting cards What if there are some changes to be incorporated?


Will we have to change each and every copy of the visiting card?

Not at all. We will have to make the correction only in the original visiting card.


The same will be reflected in the copies.

Move the contact details to the left Let's try this. Let's move the contact details to the left side on the original card.


Observe the changes are reflected in all the visiting card copies.


<<PAUSE>>

Press Ctrl + S Now let us save the file.


Press Ctrl + S to save the SVG file. I will choose Desktop as the location to save my file.

Type ST-visiting-card >> Click on Save And I will type ST-visiting-card as the Filename and click on Save.
Go to File >> Save As After this, we will save the file in PDF format.


Once again, go to File and click on Save As.

Change the extension to PDF >> Save Change the extension to PDF and click on Save.
Close Inkscape >> come to the Desktop >> point to the pdf file >> double-click to open it. Let us close Inkscape now and come to the Desktop.


Here is the file that we saved - ST-visiting-card.pdf


Let's open it.

Here are the visiting cards that we created.

<<PAUSE>>

Summarize Let us summarize.


In this tutorial, we learnt about

  • Settings for a visiting card
  • Designing a visiting card
  • Settings to print multiple copies of the visiting card
Assignment Here is an assignment for you.

Create a visiting card with

  • your name
  • your institute/organisation name
  • your institute/organisation logo
  • your institute/organisation website address
About Slide The video available at the following link summarizes the Spoken Tutorial project. Please watch it.
About Slide The Spoken Tutorial Project Team conducts workshops and gives certificates for those who pass an online test.

For more details, please write to us.

About Slide Spoken Tutorial Project is supported by the NMEICT, MHRD, Government of India.

More information on this Mission is available at this link.

Acknowledgment We have come to the end of this tutorial.

This is Arthi and Saurabh from IIT Bombay, signing off. Thanks for joining.

Contributors and Content Editors

Arthi, Nancyvarkey