Difference between revisions of "LibreOffice-Suite-Draw/C3/Flow-Charts-Connectors-Glue-Points/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with '{| border=1 |Visual Cue ||Narration |- |Show Slide Welcome to the Spoken Tutorial on <br/> Flowcharts Glue Points and Beizer curves in LibreOffice Draw. ||<br/> Welcome to the…')
 
 
(One intermediate revision by the same user not shown)
Line 5: Line 5:
 
|-
 
|-
 
|Show Slide  
 
|Show Slide  
−
Welcome to the Spoken Tutorial on <br/> Flowcharts Glue Points and Beizer curves  in LibreOffice Draw.
+
Title Slide
 
||<br/> Welcome to the Spoken Tutorial on Flowcharts, Glue Points and Beizer curves in LibreOffice Draw.
 
||<br/> Welcome to the Spoken Tutorial on Flowcharts, Glue Points and Beizer curves in LibreOffice Draw.
  
Line 11: Line 11:
 
|Show Slide  
 
|Show Slide  
 
Learning Objectives
 
Learning Objectives
−
Draw Beizer curves and Flowcharts.<br/>  
+
*Draw Beizer curves and Flowcharts.<br/>  
−
Connect Flowcharts using <br/> Connectors and Glue points.   
+
*Connect Flowcharts using <br/> Connectors and Glue points.   
 
||
 
||
 
In this tutorial you will learn to  
 
In this tutorial you will learn to  
−
Draw Beizer curves and Flowcharts.
+
*Draw Beizer curves and Flowcharts.
 
You will also learn how to  
 
You will also learn how to  
−
Connect Flowcharts using<br/>  Connectors and Glue points.                   
+
*Connect Flowcharts using<br/>  Connectors and Glue points.                   
  
 
|-
 
|-
Line 24: Line 24:
 
Ubuntu Linux version 10.04
 
Ubuntu Linux version 10.04
 
LibreOffice Suite version 3.3.4
 
LibreOffice Suite version 3.3.4
−
||<br/> Here we are using <br/> Ubuntu Linux version 10.04 and  LibreOffice Suite version 3.3.4.
+
||<br/> Here we are using <br/>  
 +
*Ubuntu Linux version 10.04 and   
 +
*LibreOffice Suite version 3.3.4.
  
 
|-
 
|-
Line 39: Line 41:
 
||
 
||
  
−
Bezier Curves are used mainly in computer graphics
+
Bezier Curves are used mainly in computer graphics to make curves smoother.
−
To make curves smoother.
+
You can use these curves to experiment with the shape and size of curves.
−
You can use these curves to experiment
+
−
With the shape and size of curves.
+
−
 
+
  
 
|-
 
|-
Line 499: Line 498:
 
Connectors and Arrows
 
Connectors and Arrows
 
How are connectors different from Lines and Arrows?
 
How are connectors different from Lines and Arrows?
−
Connectors are lines or arrows  
+
*Connectors are lines or arrows  
−
Whose end points are automatically docked  
+
*Whose end points are automatically docked  
−
To the glue point of an object.
+
*To the glue point of an object.
−
Lines and Arrows do not dock automatically.
+
*Lines and Arrows do not dock automatically.
 
||
 
||
  
 
How are connectors different from Lines and Arrows?
 
How are connectors different from Lines and Arrows?
−
Connectors are lines or arrows  
+
*Connectors are lines or arrows  
−
Whose end points are automatically docked
+
*Whose end points are automatically docked
−
To the glue points of an object.
+
*To the glue points of an object.
−
Lines and Arrows, on the other hand, do not dock automatically.
+
*Lines and Arrows, on the other hand, do not dock automatically.
  
 
|-
 
|-
Line 515: Line 514:
 
Assignment
 
Assignment
 
<< Show the flowchart  here >>
 
<< Show the flowchart  here >>
−
Create the second part of the Spoken Tutorial flow chart  
+
*Create the second part of the Spoken Tutorial flow chart  
−
Color the processes boxes.
+
*Color the processes boxes.
−
Draw a connector with the letter “A”
+
*Draw a connector with the letter “A”
−
It should be the first object in this flowchart.  
+
*It should be the first object in this flowchart.  
 
||Pause this tutorial and do this assignment.<br/>  
 
||Pause this tutorial and do this assignment.<br/>  
−
Create the second part of the Spoken Tutorial flow chart
+
*Create the second part of the Spoken Tutorial flow chart
−
Color the processes boxes.
+
*Color the processes boxes.
−
Draw a connector with the letter “A”
+
*Draw a connector with the letter “A”
−
It should be the first object in this flowchart.  
+
*It should be the first object in this flowchart.  
−
 
+
  
 
|-
 
|-
Line 539: Line 537:
 
||This brings us to the end of this tutorial.
 
||This brings us to the end of this tutorial.
 
In this tutorial, you have learnt about:
 
In this tutorial, you have learnt about:
−
Flowcharts
+
*Flowcharts
−
Connectors
+
*Connectors
−
Glue points
+
*Glue points
  
 
|-
 
|-
−
|Show Slide 13
+
 
−
ACKNOWLEDGEMENT
+
|| Show About Slide
−
||  
+
 
 +
About the Spoken Tutorial Project
 +
 
 +
*Watch the video available at http://spoken-tutorial.org/What_is_a_Spoken_Tutorial
 +
 
 +
*It summarises the Spoken Tutorial project
 +
 
 +
*If you do not have good bandwidth, you can download and watch it
 +
 
 +
||
 +
 
 +
*Watch the video available at the following link
 +
 
 +
*It summarises the Spoken Tutorial project
 +
 
 +
*If you do not have good bandwidth, you can download and watch it
 +
 
 +
|-
 +
 
 +
|| Show About Slide
 +
 
 +
Spoken Tutorial Workshops
 +
 
 +
The Spoken Tutorial Project Team
 +
 
 +
*Conducts workshops using spoken tutorials
 +
 
 +
*Gives certificates for those who pass an online test
 +
 
 +
*For more details, please write to contact@spoken-tutorial.org
 +
 
 +
||
 +
 
 +
 
 +
The Spoken Tutorial Project Team
 +
 
 +
*Conducts workshops using spoken tutorials
 +
 
 +
*Gives certificates for those who pass an online test
 +
 
 +
*For more details, please write to contact at spoken hyphen tutorial dot org
 +
 
 +
 +
 
 +
|-
 +
 
 +
|| Show Acknowledgement Slide
 +
 
 +
Acknowledgements
 +
 
 +
*Spoken Tutorial Project is a part of the Talk to a Teacher project
 +
 
 +
*It is supported by the National Mission on Education through ICT, MHRD, Government of India
 +
 
 +
*More information on this Mission is available at
 +
 
 +
*http://spoken-tutorial.org/NMEICT-Intro
 +
 
 +
||
 +
 
 +
*Spoken Tutorial Project is a part of the Talk to a Teacher project
 +
 
 +
*It is supported by the National Mission on Education through ICT, MHRD, Government of India
 +
 
 +
*More information on this Mission is available at
 +
 
 +
*spoken hyphen tutorial dot org slash NMEICT hyphen Intro
 +
 
 +
|-
 +
 
 +
|| Show About the contributor Slide
 +
 
 +
About the contributor
 +
 
 +
*This tutorial has been contributed by DesiCrew Solutions Pvt. Ltd.
 +
 
 +
*www.desicrew.in
 +
 
 +
*Thanks for joining
 +
 
 +
||
 +
 
 +
*This tutorial has been contributed by DesiCrew Solutions Pvt. Ltd.
 +
 
 +
*Thanks for joining.
  
 
|-
 
|-
 
|}
 
|}

Latest revision as of 10:37, 25 April 2014

Visual Cue Narration
Show Slide

Title Slide


Welcome to the Spoken Tutorial on Flowcharts, Glue Points and Beizer curves in LibreOffice Draw.
Show Slide

Learning Objectives

  • Draw Beizer curves and Flowcharts.
  • Connect Flowcharts using
    Connectors and Glue points.

In this tutorial you will learn to

  • Draw Beizer curves and Flowcharts.

You will also learn how to

  • Connect Flowcharts using
    Connectors and Glue points.
Show Slide

System Requirements Ubuntu Linux version 10.04 LibreOffice Suite version 3.3.4


Here we are using
  • Ubuntu Linux version 10.04 and
  • LibreOffice Suite version 3.3.4.
Let’s learn about Bezier Curves.
Show Slide

Bezier Curves Bezier Curves are used mainly in computer graphics To make curves smoother. Use these curves to experiment With the shape and size of curves.

Bezier Curves are used mainly in computer graphics to make curves smoother. You can use these curves to experiment with the shape and size of curves.

Show Slide

<< Display Figure Two. >>

All curves have a start point and an end point.

The points on the curve are referred to as Nodes.

Switch to the RouteMap file. Let us go to our Routemap file.


Point as per the narration Let’s to go to the Commercial Complex from Home.
Point a right-bottom corner of the Parking Lot. To do so, we have to go right from the Parking Lot.
Refer Figure Three.

Select the Drawing toolbar >> right-click for the context menu >> click Ungroup.

Remember, previously we had grouped the drawing.

So let’s ungroup it.

From the Drawing toolbar >> click Curve >> select Curve. Now, from the Drawing toolbar, click Curve and select Curve.
Click once with your mouse. On the Draw page, click on the start point of the route - this is Home.
Keep the left mouse button pressed and drag straight

downward <<This will look like a straight line.>>

Keep the left mouse button pressed and drag till the Play Ground.

You will see a straight line.

Release the mouse and move the pointer to the side entrance of the school. Release the mouse button.

Now move the pointer to the Commercial Complex.

The line will curve as the mouse moves.

Double-click at the Commercial Complex.

Now, click anywhere on the page.

Double-click at the end point, that is the Commercial Complex.

Move the mouse over the curve to indicate the smoothness of the curve.

We have drawn a curve!

Notice that the curve transition is smooth.

Now let us edit the points on this curve using the Edit Points toolbar.
Click on the curve. Click on the curve.
Right-click on the curve and choose Edit Points. To enable the Edit Points toolbar, right-click on the curve and choose Edit Points.
Point to the end-points of the curve where the blue boxes are visible. When the blue boxes appear at the end-points of the curve, we can edit the curve.
Click on the start point of the curve. Click on the start point of the curve.
Drag so that the dotted line with a control point is shown. You will see a dotted line with a control point.


Drag the curve a little. You can now drag the dotted line to reduce or expand the curve, as required.
Double-click anywhere on the Draw page Double-click anywhere on the Draw page, once you have made a change.
You can use the Edit Points toolbar to insert, move or delete points on the curve to create a smoother curve.
Show Slide

Assignment Draw a Bezier curve Work with all the options Using the Edit Points toolbar.

Here is a small assignment for you.

Draw a Bezier curve and Work with all the options Using the Edit Points toolbar.


Now, let us learn to create Flowcharts.
Go to the Main menu >> select Insert >> click Slide.

Repeat these steps. But in the final video show both the page creations at a fast pace.

Let’s add 2 new pages to the file RouteMap.
Go to the Drawing toolbar >> Move the mouse to Flowcharts icon >> Click on the small black triangle. Draw provides a separate option in the Drawing toolbar for Flowcharts.
Show Slide 3

<< Show the flowchart as show in Figure One.>>

This flowchart shows all the stages in the Spoken Tutorial process.
Let’s create this flowchart.
Go to the Drawing toolbar >> Move the mouse over the Flowcharts icon From the Drawing toolbar click on Flowcharts.
Click on the small black triangle >>

Click Flowchart: Process

Click on the small black triangle and select Flowchart: Process.
Go to the Draw page and draw the Flowchart:Process

<< Refer Figure One to draw the flowchart.>>

Place the cursor on the Draw page

Hold the left mouse button and drag it down.

You have drawn a Process box.
A Process box represents a step or an event in the entire process.
We can insert text in flowchart objects, too.
Double-click on the Process box.

Enter the text “Create the Tutorial Outline to chunk content into 10-minute scripts” inside it.

Let’s double-click on the Process box and type the text “Create the Tutorial Outline to chunk content into 10-minute scripts” inside it.
Formatting options for flowcharts are also similar to that of other objects.
Now, let’s align the text inside the Process box.
Select the text >> Right-click for the Context menu and click Text Let us select the text.

Right-click to view the Context menu and click Text.

The Text dialog box appears The Text dialog box appears.
Check the box “Resize shape to fit text width” >> Click OK. In the Text dialog box, check the box Resize shape to fit text width.

Click OK.

You will see that the Process box has changed its shape to fit the text!
Undo this action, by pressing the Keys CTRL+Z. Now let us undo this action, by pressing the CTRL+Z keys together.
Select the text. Again, let’s select the text.
Go to the Main menu >> select Format >> click Text Go to the Main menu and select Format and click Text.
The text dialog box appears. The Text dialog box appears.
Check the option Word wrap text in shape >> Click OK. Let us check the option Word wrap text in shape.

Click OK.

The text has adjusted itself to fit the shape of the Process box.
Draw a process box beneath it.

Go to the Drawing toolbar >> Move the mouse over the Flowcharts icon >> Click on the small black triangle >> click Flowchart: Process >> go to the Draw page and draw the object.

In the same manner, let us now draw another Process box beneath the first one.
Enter the text “Create Scripts” inside it.

<<Refer Figure One>>

Let us insert the text “Create Scripts” inside it.<Pause>
Go to the Drawing toolbar >> Move the mouse over the Flowcharts icon >> Click on the small black triangle >> click Flowchart: Decision >> go to the Draw page and draw the object.

Enter the text “Review Okay”?

Now, lets draw a Decision box and insert the text “Review Okay?” inside it. <Pause>
A Decision box represents a decision that has to be made.

It directs us to the next process based on the outcome of the decision.

Go to the Drawing toolbar >> Move the mouse over the Flowcharts icon >> Click on the small black triangle >> click Flowchart: Process >> go to the Draw page and draw the object. Let us now draw another Process box beneath the Decision box.


Type the text “Record Video”. Let us insert the text “Record Video” inside it.<Pause>
Circle the area with the mouse to show its approximate location. Next, we need another Decision box here, with the text “Review Okay?”
Point to the earlier Decision box and then point to the empty space after “Record Video” process box. Let’s copy the Decision box we created before and place it here.
Select the decision box “Review Okay”.

Press CTRL+C

So, select the Decision box and press the CTRL+C keys together.
then press CTRL+V. Now press the CTRL+V keys together.
Select the copied decision box and move it beneath the process box ,

Type the rext “Review Okay inside it.

Let’s move this box beneath the previous Process box.

Now enter the text “Review Okay” inside it.

Go to the Drawing toolbar >> Move the mouse over the Flowcharts icon >> Click on the small black triangle >> click Flowchart: Connector >> go to the Draw page and draw the connector as shown in Figure FOUR. Finally let’s draw a flowchart-connector and type A inside it. <Pause>


A flowchart-connector connects two parts of a flowchart.
Point to the flowchart page in the thumbnails on the left panel Let’s say that the first part of the flowchart is on one page …..
Point to the next page in the thumbnails on the left panel ….. and the second part on another page.
Come back to the flowchart page.

Point to the connector. Select and copy the connector.

We draw a flowchart-connector at the end of the flowchart on the first page.
Go to the next page .

Now paste the connector.at the beginning of the page.

Then we draw the same connector at the beginning of the second page.
Point to the objects Before we connect the objects, let us learn about Connector Lines and Glue Points in Draw.
Show Slide 4

Connectors Connectors are lines or arrows Whose ends are attached or docked to an object.

Connectors are lines or arrows Whose ends are attached or docked to an object.

Show Slide 5

Glue Points Glue points are the points That glue the connectors to the objects All objects have glue points.

<<On another slide >>
Glue Points These are invisible. They become visible When a connector is selected from the Drawing toolbar When the mouse pointer is moved over an object.

Glue points as the name indicates are the points That glue the connectors to the objects. All the objects have glue points.

These are invisible; They become visible When a connector is selected from the Drawing toolbar or When the mouse pointer is moved over an object.

Show Slide 6

Glue points are not the same as handles. We use handles to re-size the object. Glue points are used to glue the connector to an object.

Glue points are not the same as handles. We use handles to re-size the object. Glue points are used to glue the connector to an object.

Point to the objects Now, let us connect the objects in the flowchart using connectors.
Drawing toolbar >> click on Connector Go to the Drawing toolbar and select Connector.
Click on the small black triangle next to Connector. Click on the small black triangle to see the different types of Connectors.
Select “Straight Connector ends with arrow”. Let us select the option Straight Connector ends with Arrow.
Point to the small crosses that appear on the flow chart objects in the draw page. When you select the Connector, you will see cross marks on all the objects in the Draw page.

These are the glue points.

Use the “Straight Connector ends with arrow” and join the two process boxes as shown in Figure One.

Now let’s draw a line from the glue point of the first process box to glue point of the next process box.

Move the mouse from top to down on the Draw page

We will connect all the flowchart objects, in a top-to-down manner using connectors. <Pause>
<<Please draw connectors as shown in Figure One.>> You will notice that the every line automatically docks itself to the nearest glue point, wherever you place the cursor. <Pause>
Next let’s connect the Process and Decision boxes.
Click on Drawing toolbar >> select Connector.

Select “Connector ends with arrow”.

From the Drawing toolbar, select the option Connector ends with Arrow.
Draw an arrow as shown in Figure One. From the Process box let’s connect to the Decision box.
Drawing toolbar >> click on the small black triangle next to Connector >> select “Connector ends with arrow”.

Draw an arrow as shown in Figure One.

Similarly, let’s connect the Decision box with the next Process box.
You can also add text to a connector.
On the connector from the Decision box to the Process box, let us type “No”.
Select the connector to the right.

Double-click on it.

To select the connector, just double-click on it.


The end control points become active.

And the text cursor appears.

Type the text No. Let us type the text “No”.
Do this once more for the other connector.

<<Refer to Figure One.>>

Let us do this once more for the other connector.

Press Ctrl+S keys to save the document.

We have created a simple flowchart!

Let’s save our flowchart by pressing Ctrl+S keys.

Point to the Lines and Arrows tool in the Toolbar. Lines and arrows is the next tool to the right of Connectors in the Drawing Toolbar. You can also connect the objects using lines and arrows, too.
Circle the mouse over all the objects from top to bottom in a clock-wise manner, to indicate that they should be grouped. But in that case, you should group the objects.

This is because arrows do not stay docked to objects.

Show Slide 7

Connectors and Arrows How are connectors different from Lines and Arrows?

  • Connectors are lines or arrows
  • Whose end points are automatically docked
  • To the glue point of an object.
  • Lines and Arrows do not dock automatically.

How are connectors different from Lines and Arrows?

  • Connectors are lines or arrows
  • Whose end points are automatically docked
  • To the glue points of an object.
  • Lines and Arrows, on the other hand, do not dock automatically.
Show Slide 8

Assignment << Show the flowchart here >>

  • Create the second part of the Spoken Tutorial flow chart
  • Color the processes boxes.
  • Draw a connector with the letter “A”
  • It should be the first object in this flowchart.
Pause this tutorial and do this assignment.
  • Create the second part of the Spoken Tutorial flow chart
  • Color the processes boxes.
  • Draw a connector with the letter “A”
  • It should be the first object in this flowchart.
<<On the next slide show the image>> It should look like this.
Show Slide 12

Summary

Flowcharts Connectors Glue points

This brings us to the end of this tutorial.

In this tutorial, you have learnt about:

  • Flowcharts
  • Connectors
  • Glue points
Show About Slide

About the Spoken Tutorial Project

  • It summarises the Spoken Tutorial project
  • If you do not have good bandwidth, you can download and watch it
  • Watch the video available at the following link
  • It summarises the Spoken Tutorial project
  • If you do not have good bandwidth, you can download and watch it
Show About Slide

Spoken Tutorial Workshops

The Spoken Tutorial Project Team

  • Conducts workshops using spoken tutorials
  • Gives certificates for those who pass an online test
  • For more details, please write to contact@spoken-tutorial.org


The Spoken Tutorial Project Team

  • Conducts workshops using spoken tutorials
  • Gives certificates for those who pass an online test
  • For more details, please write to contact at spoken hyphen tutorial dot org


Show Acknowledgement Slide

Acknowledgements

  • Spoken Tutorial Project is a part of the Talk to a Teacher project
  • It is supported by the National Mission on Education through ICT, MHRD, Government of India
  • More information on this Mission is available at
  • Spoken Tutorial Project is a part of the Talk to a Teacher project
  • It is supported by the National Mission on Education through ICT, MHRD, Government of India
  • More information on this Mission is available at
  • spoken hyphen tutorial dot org slash NMEICT hyphen Intro
Show About the contributor Slide

About the contributor

  • This tutorial has been contributed by DesiCrew Solutions Pvt. Ltd.
  • www.desicrew.in
  • Thanks for joining
  • This tutorial has been contributed by DesiCrew Solutions Pvt. Ltd.
  • Thanks for joining.

Contributors and Content Editors

Desicrew, Nancyvarkey

Retrieved from "https://script.spoken-tutorial.org/index.php?title=LibreOffice-Suite-Draw/C3/Flow-Charts-Connectors-Glue-Points/English&oldid=9994"