Difference between revisions of "Activities/TurtleArt/Tutorials/Turtle Art Tutorial gci2012"

From Sugar Labs
Jump to navigation Jump to search
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
Created during Google Code In 2012 http://www.google-melange.com/gci/task/view/google/gci2012/7966208
 +
 
==TURTLE ART==
 
==TURTLE ART==
 +
[[File:Turtle-a.png|150px]]
  
 
===1 LEARNING WITH TURTLE ART===
 
===1 LEARNING WITH TURTLE ART===
Line 12: Line 15:
 
===2 GETTING STARTED===
 
===2 GETTING STARTED===
 
You program with Turtle Art by snapping together blocks. Each block is a command for the turtle, e.g., there is a block to tell the turtle to go forward, to turn right, etc.
 
You program with Turtle Art by snapping together blocks. Each block is a command for the turtle, e.g., there is a block to tell the turtle to go forward, to turn right, etc.
 +
 
The blocks are organized on palettes: one for the turtle, one for the pen, etc.
 
The blocks are organized on palettes: one for the turtle, one for the pen, etc.
 
Start by clicking on the turtle to show the turtle palette. Try dragging blocks from the palette onto the turtle canvas. Click on them to see what they do...
 
Start by clicking on the turtle to show the turtle palette. Try dragging blocks from the palette onto the turtle canvas. Click on them to see what they do...
Line 32: Line 36:
 
clear the screen of all drawings and will bring the turtle
 
clear the screen of all drawings and will bring the turtle
 
in her initial position.
 
in her initial position.
Page | 6
+
 
 
Using this commands and snapping blocks together we can create a "flow" from top to bottom.Just like in the example...
 
Using this commands and snapping blocks together we can create a "flow" from top to bottom.Just like in the example...
 
The commands are executed in the order of the blocks.When we click start the turtle goes forward with 100 spaces then turns left 90 degrees and goes forward again, next turns right 90 degrees and goes again forward.
 
The commands are executed in the order of the blocks.When we click start the turtle goes forward with 100 spaces then turns left 90 degrees and goes forward again, next turns right 90 degrees and goes again forward.
Page | 7
+
 
 
===4 PEN COMMANDS===
 
===4 PEN COMMANDS===
 
The command pen up will
 
The command pen up will
Line 43: Line 47:
 
Set pen size will set the width of the pen.
 
Set pen size will set the width of the pen.
 
The larger the number is the fatter the line will be.
 
The larger the number is the fatter the line will be.
Page | 8
+
 
 
Fill screen will fill the entire screen
 
Fill screen will fill the entire screen
 
with the shown color and shade.
 
with the shown color and shade.
Line 52: Line 56:
 
set the color of the line that will be drawn.
 
set the color of the line that will be drawn.
 
The value can be 0 to 99. See the table for colors.
 
The value can be 0 to 99. See the table for colors.
Page | 9
+
 
 
===5 TOOLBARS===
 
===5 TOOLBARS===
 
We will start with the Main toolbar
 
We will start with the Main toolbar
 +
 +
[[Image:TAmain.png]]
 +
 
In version 167 the toolbar looks simple and it is a little bit easily to use. We have again the palettes. Then we see a toolbar which can free our workspace in way that we have only the blocks that we are using and the drawing turtle. Next are the erase canvas, run project fast (rabbit) button and run project slow (snail) button.
 
In version 167 the toolbar looks simple and it is a little bit easily to use. We have again the palettes. Then we see a toolbar which can free our workspace in way that we have only the blocks that we are using and the drawing turtle. Next are the erase canvas, run project fast (rabbit) button and run project slow (snail) button.
The palettes are ten: Turtle movements, Pen attributes, Color attributes, Numeric operators, Logical operators, Logical blocks, Sensor blocks, Media blocks, Customization functions, and Presentation blocks. An eleventh palette is used for restoring blocks from the trash.
+
 
Blocks are dragged from the palette to the surface. To dispose of a block, drag it back to the palette. (It automatically go to the trash palette.)
+
There are ten palettes: Turtle movements, Pen attributes, Color attributes, Numeric operators, Logical operators, Logical blocks, Sensor blocks, Media blocks, Customization functions, and Presentation blocks. An eleventh palette is used for restoring blocks from the trash.
 +
Blocks are dragged from the palette to the surface. To dispose of a block, drag it back to the palette. (It automatically goes to the trash palette.)
 
I will write only about the basic palettes which means Turtle movements, Pen attributes, Color attributes, Numeric operators and Logical operators .
 
I will write only about the basic palettes which means Turtle movements, Pen attributes, Color attributes, Numeric operators and Logical operators .
Page | 10
 
  
Turtle movement palette
+
 
 +
====Turtle movement palette====
  
 
About a part of them I have written in the beginning (basics command for the turtle).
 
About a part of them I have written in the beginning (basics command for the turtle).
 
new elements here are set xy which is used for setting the turtle position, xcor and ycor which holds current x-coordinate and y-coordinate value of the turtle and the seth command. Here you set the heading (it hold current heading value of the turtle).
 
new elements here are set xy which is used for setting the turtle position, xcor and ycor which holds current x-coordinate and y-coordinate value of the turtle and the seth command. Here you set the heading (it hold current heading value of the turtle).
  
Pen palette
+
====Pen palette====
  
 
Here we see again a few unknown commands for example set gray, start fill, and end fill.
 
Here we see again a few unknown commands for example set gray, start fill, and end fill.
 
From the name we can clearly understand that set gray is used for setting the gray level of the pen.
 
From the name we can clearly understand that set gray is used for setting the gray level of the pen.
 
Start and end fill are used for starting and ending a fill polygon.
 
Start and end fill are used for starting and ending a fill polygon.
Page | 11
 
  
Color palette
+
====Color palette====
  
 
About this palette we can simply say that it can be used with the set-pen-color block in place of a number block.
 
About this palette we can simply say that it can be used with the set-pen-color block in place of a number block.
Numeric operators palette
+
====Numeric operators palette====
 
These blocks here are arithmetic and boolean operators.
 
These blocks here are arithmetic and boolean operators.
 
The blocks + - x / < > = are used just as in mathematics.
 
The blocks + - x / < > = are used just as in mathematics.
Line 85: Line 92:
 
The operator OR broadens the search to include records containing either keyword, or both. The OR search is particularly useful when there are several common synonyms for a concept, or variant spellings of a word. {For example: adolescent or teen}
 
The operator OR broadens the search to include records containing either keyword, or both. The OR search is particularly useful when there are several common synonyms for a concept, or variant spellings of a word. {For example: adolescent or teen}
 
Combining search terms with the NOT operator narrows the search by excluding unwanted terms.
 
Combining search terms with the NOT operator narrows the search by excluding unwanted terms.
Page | 12
 
  
Flow palette
+
 
 +
====Flow palette====
  
 
The repeat block makes the turtle repeat instructions that are attached to it. How many times will the turtle repeat the instruction it depend from the value in the purple tab.
 
The repeat block makes the turtle repeat instructions that are attached to it. How many times will the turtle repeat the instruction it depend from the value in the purple tab.
Line 93: Line 100:
 
The if/then block is used when we got a requirement. The expression between the if and then keywords must have a Boolean result type. If the expression evaluates to True then the statement following the then keyword is executed.
 
The if/then block is used when we got a requirement. The expression between the if and then keywords must have a Boolean result type. If the expression evaluates to True then the statement following the then keyword is executed.
 
If the expression evaluates to False, then the statement following the else keyword is executed, if it is present.
 
If the expression evaluates to False, then the statement following the else keyword is executed, if it is present.
Page | 13
+
 
 
The if/then/else block is similar to the if/then block. If the expression evaluates to True then the statement following the then keyword is executed.
 
The if/then/else block is similar to the if/then block. If the expression evaluates to True then the statement following the then keyword is executed.
 
If the expression evaluates to False, then the statement following the else keyword is executed.
 
If the expression evaluates to False, then the statement following the else keyword is executed.
 
For example: IF x<30 THEN the turtle will go right ELSE the turtle will go left(We will generate a random number from 0 to 50(x) and then we will check IF this number is <30 .If the statement is true the turtle will go right .But if the number is > 30 our turtle will follow the ELSE and will go to the left).
 
For example: IF x<30 THEN the turtle will go right ELSE the turtle will go left(We will generate a random number from 0 to 50(x) and then we will check IF this number is <30 .If the statement is true the turtle will go right .But if the number is > 30 our turtle will follow the ELSE and will go to the left).
Page | 14
 
  
Blocks palette
+
====Blocks palette====
  
 
These blocks are for defining variables and subroutines.
 
These blocks are for defining variables and subroutines.
Line 107: Line 113:
 
I will show two examples which you can find between all the samples that comes with Turtle Art. The first is for using actions blocks and the second for the store in block.
 
I will show two examples which you can find between all the samples that comes with Turtle Art. The first is for using actions blocks and the second for the store in block.
 
Here we have our stack which is called square. In square the turtle moves forward 100 spaces then turns right 90 degrees(the command repeats 4 times). To start drawing we use the other part of the program which perform the action square, then the turtle turns right 45 degrees and to complete the picture we repeat this 8 times.
 
Here we have our stack which is called square. In square the turtle moves forward 100 spaces then turns right 90 degrees(the command repeats 4 times). To start drawing we use the other part of the program which perform the action square, then the turtle turns right 45 degrees and to complete the picture we repeat this 8 times.
Page | 15
+
 
 
In this program we store a value in a box. Our initial value is 0. The turtle go forward, back and right. With every repeat we add to the value 2 spaces. When the command repeat 90 times we get the picture above.
 
In this program we store a value in a box. Our initial value is 0. The turtle go forward, back and right. With every repeat we add to the value 2 spaces. When the command repeat 90 times we get the picture above.
 
From the samples you can check the sensor-soundpaint demo which is very interesting too. We can use Turtle Art to write a paint program.
 
From the samples you can check the sensor-soundpaint demo which is very interesting too. We can use Turtle Art to write a paint program.
 
From the sensor palette, we grab a block to tell us when the mouse button is pressed and the x and y coordinates of the mouse.
 
From the sensor palette, we grab a block to tell us when the mouse button is pressed and the x and y coordinates of the mouse.
Page | 16
+
 
 
From the flow palette we grab an if-then-else block. If the mouse button is down, we put the pen down; if the mouse button is up, we put the pen up.
 
From the flow palette we grab an if-then-else block. If the mouse button is down, we put the pen down; if the mouse button is up, we put the pen up.
 
We then set the x-y position of the turtle to the x-y position of the mouse. If we do this forever, we have a simple paint program.
 
We then set the x-y position of the turtle to the x-y position of the mouse. If we do this forever, we have a simple paint program.
Page | 17
+
 
 
If we do this forever, we have a simple paint program.
 
If we do this forever, we have a simple paint program.
 
We can enhance our paint program. In this example, we set the pen size based on the loudness detected by the microphone. Note that we divide the loudness by 25 in order to prevent the pen from becoming too large.
 
We can enhance our paint program. In this example, we set the pen size based on the loudness detected by the microphone. Note that we divide the loudness by 25 in order to prevent the pen from becoming too large.
Page | 18
+
 
 
And here is the result of our paint program.
 
And here is the result of our paint program.
Page | 19
+
 
 
===6 NOW IT IS YOUR TURN===
 
===6 NOW IT IS YOUR TURN===
 
The best way to learn Turtle Art is to experiment. Here are some simple Turtle Art pieces to get you started:
 
The best way to learn Turtle Art is to experiment. Here are some simple Turtle Art pieces to get you started:
Line 127: Line 133:
 
3. Make your turtle draw. When all the blocks are locked together, start your turtle! You can start the turtle by clicking on the first block in your program, or by clicking the Run icon, which looks like a rabbit.
 
3. Make your turtle draw. When all the blocks are locked together, start your turtle! You can start the turtle by clicking on the first block in your program, or by clicking the Run icon, which looks like a rabbit.
 
4. Test your program. Did your turtle draw this shape?
 
4. Test your program. Did your turtle draw this shape?
Page | 20
+
 
 
5. If NOT then you must try to debug your program. If your turtle didn't draw a blue capital A, then your program might have a little problem. When programmers find problems in their programs, they call them 'bugs'. You need to get rid of all the bugs if your program is going to work properly. To find the bugs, check each block on your screen against the ones we have written here. If you find a block that is in the wrong order, or does not have the right value, change it to match and then run your turtle again.
 
5. If NOT then you must try to debug your program. If your turtle didn't draw a blue capital A, then your program might have a little problem. When programmers find problems in their programs, they call them 'bugs'. You need to get rid of all the bugs if your program is going to work properly. To find the bugs, check each block on your screen against the ones we have written here. If you find a block that is in the wrong order, or does not have the right value, change it to match and then run your turtle again.
 
Next try do draw B and C!!
 
Next try do draw B and C!!
Line 133: Line 139:
 
If you can’t…
 
If you can’t…
 
… here is the solution
 
… here is the solution
Page | 21
+
 
 
&
 
&
 
Try to create…
 
Try to create…
Page | 22
+
 
Page | 23
 
 
So if all this is clear you can make something new, something creative, something invented by YOU!
 
So if all this is clear you can make something new, something creative, something invented by YOU!
Page | 24
+
 
  
 
AUTHOR
 
AUTHOR
 
Anna-Mariya Mateyna
 
Anna-Mariya Mateyna
 
2012
 
2012

Latest revision as of 22:24, 22 January 2013

Created during Google Code In 2012 http://www.google-melange.com/gci/task/view/google/gci2012/7966208

TURTLE ART

Turtle-a.png

1 LEARNING WITH TURTLE ART

What exactly is Turtle Art?

Turtle Art is a fun activity in which you learn how command a little turtle to draw pictures and designs. It is a off shoot of the Logo programming language and is intended for children as young as 6 years old to learn about programming and debugging. You can play with Turtle Art to draw colorful art patterns using the turtle that accepts instruction for movement.

What can you learn with Turtle art? It is very fun to get the turtle doing tricks, but the way you do that is also very similar to the way you program a computer, so when you finish figuring out how to program your turtle, you'll be on your way to learning how to predict what each instruction will cause the turtle to create with line art. It helps you understand the repetition of instructions, and understand following instructions only when a certain condition is met, which is important in computer programming, mathematics, and science.

2 GETTING STARTED

You program with Turtle Art by snapping together blocks. Each block is a command for the turtle, e.g., there is a block to tell the turtle to go forward, to turn right, etc.

The blocks are organized on palettes: one for the turtle, one for the pen, etc. Start by clicking on the turtle to show the turtle palette. Try dragging blocks from the palette onto the turtle canvas. Click on them to see what they do...


3 BASIC COMMANDS FOR THE TURTLE

Using the command forward the turtle will move forward with the number of entered pixels. Using the command back the turtle will move back with the number of entered pixels. Page | 5 With the command left the turtle will change her direction to left by the specified angle. With the command right the turtle will change her direction to right by the specified angle. With the command arc you can draw part of a circle. The angle is the part of the circle the turtle draws and the radius determines the width (size) of the circle. And naturally the command clean which will clear the screen of all drawings and will bring the turtle in her initial position.

Using this commands and snapping blocks together we can create a "flow" from top to bottom.Just like in the example... The commands are executed in the order of the blocks.When we click start the turtle goes forward with 100 spaces then turns left 90 degrees and goes forward again, next turns right 90 degrees and goes again forward.

4 PEN COMMANDS

The command pen up will pick up the pen so that the turtle does not draw. The command pen down will pick down the pen so that the turtle can draw. Set pen size will set the width of the pen. The larger the number is the fatter the line will be.

Fill screen will fill the entire screen with the shown color and shade. With the command set shade you can set the brightness of the color. 0 will make it blacker. 99 will make it whiter. With the command set color you can set the color of the line that will be drawn. The value can be 0 to 99. See the table for colors.

5 TOOLBARS

We will start with the Main toolbar

TAmain.png

In version 167 the toolbar looks simple and it is a little bit easily to use. We have again the palettes. Then we see a toolbar which can free our workspace in way that we have only the blocks that we are using and the drawing turtle. Next are the erase canvas, run project fast (rabbit) button and run project slow (snail) button.

There are ten palettes: Turtle movements, Pen attributes, Color attributes, Numeric operators, Logical operators, Logical blocks, Sensor blocks, Media blocks, Customization functions, and Presentation blocks. An eleventh palette is used for restoring blocks from the trash. Blocks are dragged from the palette to the surface. To dispose of a block, drag it back to the palette. (It automatically goes to the trash palette.) I will write only about the basic palettes which means Turtle movements, Pen attributes, Color attributes, Numeric operators and Logical operators .


Turtle movement palette

About a part of them I have written in the beginning (basics command for the turtle). new elements here are set xy which is used for setting the turtle position, xcor and ycor which holds current x-coordinate and y-coordinate value of the turtle and the seth command. Here you set the heading (it hold current heading value of the turtle).

Pen palette

Here we see again a few unknown commands for example set gray, start fill, and end fill. From the name we can clearly understand that set gray is used for setting the gray level of the pen. Start and end fill are used for starting and ending a fill polygon.

Color palette

About this palette we can simply say that it can be used with the set-pen-color block in place of a number block.

Numeric operators palette

These blocks here are arithmetic and boolean operators. The blocks + - x / < > = are used just as in mathematics. The mod, or remainder, operator divides x by y and returns only the remainder. The sign of the result is the same as the sign of x. The value of the result is between 0 and the absolute value of y. Random generates a random number between the minimum and maximum values which can be set by the user. AND, NOT and OR are Boolean operators. The operator AND narrows the search by instructing the search engine to search for all the records containing the first keyword, then for all the records containing the second keyword, and show only those records that contain both. The operator OR broadens the search to include records containing either keyword, or both. The OR search is particularly useful when there are several common synonyms for a concept, or variant spellings of a word. {For example: adolescent or teen} Combining search terms with the NOT operator narrows the search by excluding unwanted terms.


Flow palette

The repeat block makes the turtle repeat instructions that are attached to it. How many times will the turtle repeat the instruction it depend from the value in the purple tab. This example draws a square, moves forward 100 spaces then turns right 90 degrees. This command repeats 4 times. The if/then block is used when we got a requirement. The expression between the if and then keywords must have a Boolean result type. If the expression evaluates to True then the statement following the then keyword is executed. If the expression evaluates to False, then the statement following the else keyword is executed, if it is present.

The if/then/else block is similar to the if/then block. If the expression evaluates to True then the statement following the then keyword is executed. If the expression evaluates to False, then the statement following the else keyword is executed. For example: IF x<30 THEN the turtle will go right ELSE the turtle will go left(We will generate a random number from 0 to 50(x) and then we will check IF this number is <30 .If the statement is true the turtle will go right .But if the number is > 30 our turtle will follow the ELSE and will go to the left).

Blocks palette

These blocks are for defining variables and subroutines. Here we can find the start block which connect the action to toolbar 'Run' button. When we are using this block we only have to push it and the turtle start to compile. The first action block is the top of named action stack and the second is the execute named action stack. The store in block can store a number or a string in a named box. I will show two examples which you can find between all the samples that comes with Turtle Art. The first is for using actions blocks and the second for the store in block. Here we have our stack which is called square. In square the turtle moves forward 100 spaces then turns right 90 degrees(the command repeats 4 times). To start drawing we use the other part of the program which perform the action square, then the turtle turns right 45 degrees and to complete the picture we repeat this 8 times.

In this program we store a value in a box. Our initial value is 0. The turtle go forward, back and right. With every repeat we add to the value 2 spaces. When the command repeat 90 times we get the picture above. From the samples you can check the sensor-soundpaint demo which is very interesting too. We can use Turtle Art to write a paint program. From the sensor palette, we grab a block to tell us when the mouse button is pressed and the x and y coordinates of the mouse.

From the flow palette we grab an if-then-else block. If the mouse button is down, we put the pen down; if the mouse button is up, we put the pen up. We then set the x-y position of the turtle to the x-y position of the mouse. If we do this forever, we have a simple paint program.

If we do this forever, we have a simple paint program. We can enhance our paint program. In this example, we set the pen size based on the loudness detected by the microphone. Note that we divide the loudness by 25 in order to prevent the pen from becoming too large.

And here is the result of our paint program.

6 NOW IT IS YOUR TURN

The best way to learn Turtle Art is to experiment. Here are some simple Turtle Art pieces to get you started: What shape will this set of commands make? Try it and see. 1. Put the blocks together. Drag each block onto the screen and click them together in order. 2. Change the values in the purple bars. Click on each purple bar and type in the numbers. This will set how far the turtle should go, what color the line should be, and what type of curve (or 'arc') it should draw. 3. Make your turtle draw. When all the blocks are locked together, start your turtle! You can start the turtle by clicking on the first block in your program, or by clicking the Run icon, which looks like a rabbit. 4. Test your program. Did your turtle draw this shape?

5. If NOT then you must try to debug your program. If your turtle didn't draw a blue capital A, then your program might have a little problem. When programmers find problems in their programs, they call them 'bugs'. You need to get rid of all the bugs if your program is going to work properly. To find the bugs, check each block on your screen against the ones we have written here. If you find a block that is in the wrong order, or does not have the right value, change it to match and then run your turtle again. Next try do draw B and C!! & If you can’t… … here is the solution

& Try to create…

So if all this is clear you can make something new, something creative, something invented by YOU!


AUTHOR Anna-Mariya Mateyna 2012