In Scratch, in addition to standard block categories such as "Movement", " Appearance" and so on, which are immediately available in all projects, there are others. They are called extensions or add-ons. To see all available extensions, you need to click on the "Add extension" button, which is located on the "Code" tab at the very bottom. After that, it will open window where you can select an add-on.

Most add-ons involve the use of external devices, such as a microphone, camera, robot, etc. However, this does not apply to the first two - “Music” and “Pen”.

After selecting the "Pen" extension, a new section appears in the "Code" tab of the Scratch programming environment with command blocks that allow you to draw on the stage. This means that sprites will be able to leave behind a visible line when they move.

Here is an example script for a cat:

Having played it, we get the following picture:

When the sprite's pen is raised, it does not leave a line when moving. When the pen is down, no matter how you move the sprite from point A to point B, a line of the set color and thickness will be drawn from A to B.

The "print" command prints the image of the sprite in the place where it is located.

In Scratch, you can create a scenario where, when you start it, the user himself will draw, moving the hero. Let's add a pencil sprite to the scene and program it as follows:

The game should be launched in full screen mode. In programming mode, the script will not work correctly.

Once launched, the pencil can be moved with the mouse and it will leave a mark. You can paint anything on stage. However, the line will not come from the tip of the pencil, but from its middle, which is incorrect. This can be corrected by editing the costume.

In the center of the canvas there is a little visible point, which marks the center of the sprite. It is from this center that the line is drawn. You need to move the tip of the pencil to the center of the canvas.

Drawing with a mouse is not very convenient. Let's change the keyboard controls:

The pencil is now controlled by the keyboard arrows. When we press the spacebar, we alternately change the state of the pen. By lifting the pen, we can move the pencil around the scene without drawing a line.

The sprite script can be complicated by adding scripts for changing the pen thickness and color. Let the color, for example, be set randomly:

But what if we want the pencil to print not itself, but some other sprite? This other sprite should appear from the tip of the pencil when you press, say, the 0 key.

Squire Trelawney, Dr. Livesey and other gentlemen asked me to write everything I know about Treasure Island. They want me to tell the whole story, from beginning to end, without hiding any details except geographical location islands. It is currently still impossible to indicate where this island lies, since even now treasures are stored there that we did not take away. And so this year, 17..., I take up my pen and mentally return to the time when my father had the Admiral Benbow tavern and an old tanned sailor with a saber scar on his cheek settled in this tavern.

Robert Stevenson, "Treasure Island"

Procedures

The spell did not have the slightest effect: the eggs, contrary to his expectations, did not disappear. He repeated the whole procedure from the beginning - and again he failed.

L. F. Baum, “Tik-Tok from Oz”

Problem 1. Staircase (3 kuk). The cat is standing at the top of the stairs. Help the performer go down.

The background for the scene with a ladder design is located at: practical/fonlib/Miscellaneous/Ladder.png

Solution

1. Preparation
2. stage.

“I would write a program for this task like this,” said Cucaracha, and showed his students a very strange script:

1. Preparation (set the cat to the first stage)
2. Repeat descent onto the step 4 times (Step command)

The names of actions highlighted in the algorithm turned into commands

— The program almost literally repeats the algorithm, it looks short and understandable!

Except for one thing: are the teams and are included in SKI?

— There are no such commands in Scratch. It’s impossible to provide commands for all occasions! But Scratch allows the programmer create your own teams, and this is common programming practice.

How to create a new team

1. In the Other blocks group, click the Create block button
2. Write down the name of the new command
3. Putting together a script for a new command under the Define header

Now a homemade block can be used in scripts along with other blocks!

What will the new team do? Nothing! Nothing until we explain how it should work:

The actions that need to be performed on a new command are specified by the script

Script with name programmers call it a procedure.

Procedure name(script name) can be used as a command. This command is called a procedure call.

Procedure- this is a script that describes what the new "homemade" command should do - procedure call

A procedure is a script with cap-name.

A procedure call is a command whose name is the same as the procedure name. This command starts the procedure.

What we learned about the procedures:

• The script procedure contains the program for the new command.
• The programmer comes up with this command for the convenience of solving his problem.
• So that Scratch knows what to do when executing a new command, the programmer creates a script procedure for it.
• This team exists only within the framework of the project in which it is created.
• This command will launch a script procedure that specifies the program for its operation.

Lesson 1 says that scripts are triggered by events. Let's add now: with the exception of procedures. These scripts are launched with special “homemade” commands. The names of these commands are the same as the names of the procedures.

Procedure name

The procedure allows you to expand the system of executor commands with new commands.

This is why it is so important to choose the right name for the procedure!

The name of the procedure should be chosen so that it is clear what the new command does.

Preparation - good name for a procedure that prepares the performer to descend the stairs.

Cheerful cat is a bad name, because it doesn’t say anything about what the performer has to do (prepare to go down the stairs).

Top-down procedural programming

Have you forgotten the problem we are solving yet?

Help the cat climb a 4-step staircase

We wrote down the solution algorithm:

1. Preparation(set the cat to the first stage).
2. Repeat descent 4 times stage.

And using this algorithm we compiled the following program:

In this program, the script for the Step procedure has not yet been compiled

Is it possible to run this program, since the script for the Step procedure has not yet been compiled?

It’s not possible, but it’s necessary! To check the correctness of an already compiled part of the program. Empty procedure A step won’t hurt - such procedures are called plugs.

The stub is empty procedure, it only contains a cap with a name. The name can be used as empty command, which does not cause any action by the performer.

Checking the operation of the program with a stub

Examination. Drag the cat to any place in the scene, click on the flag () and make sure that the cat is in the correct position (on the top step).

We continue to develop the program. What should the team do? She must move the cat first along horizontal, then by verticals.

1. Horizontal. Move the performer horizontally 90 steps.
2. Vertical. Lower the performer vertically 60 steps.

We describe the Step procedure using two new commands:

Script for the stub The stage is composed using two new stubs

First, we create the Horizontal procedure and run it for testing by clicking on it with the mouse:

So that the cat’s movement is not instantaneous, we collect 90 steps by repeating 10 steps in a cycle 9 times

We compose the Vertical procedure and run it for testing by clicking on it with the mouse:

So that the cat’s movement is not instantaneous, we collect 60 steps by repeating 10 steps in a cycle 6 times

Now you can check the entire program by clicking on the green flag.

The video of the project can be viewed at: video/01/unit03/Ladder.mp4

Project video: video/01/unit03/Ladder.mp4
Please note: the program should not assume that the executor is located in the right place and turned in the right direction before it starts

Using the example of the Lesenka project, a method of building programs was shown, the name of which is:

The method is called "procedural" because procedures are used.

The method is called method "top down" because program development begins with the main actions that solve the problem (that is, above, and not from below, from the details). If there are no commands for these actions in the SKI, a stub procedure is written with speaking name(Preparation, Stage).

The development of stub procedures is repeated in the same way - the main actions are described using new stub procedures (Horizontal, Vertical).

Top-down procedural programming

1. We make the main script with stub procedures Preparation and Stage.
2. We program the Preparation and Stage stubs. In the last script we use the new Horizontal and Vertical stubs.
3. We program the Horizontal and Vertical stubs.

Note that top-down program development is graphically represented as a tree. First, we create the root Ladder, then the descendants of the root - Preparation and Step and, finally, the descendants of the top Step - Horizontal, Vertical

Procedural top-down programming is about getting deeper into the details.

An airplane designer works the same way: first he draws the body, then the internal structure of the cockpit, then he designs the control panel, general outline chairs and, finally, the parts from which they consist.

Top-down design is a universal method of product development. This is how programmers, designers, fashion designers, designers, designers work.

What is attractive about this method?

It allows you to always think about the main thing, about on top, that is, about the entire product. Details ( bottom), are created taking into account the intended properties of the product.

If you start with parts, it may turn out that the product assembled from them will not work.

Coordinates

Having made several more orbits in the same orbit and established the exact location of the rocket on the lunar surface, the cosmonauts made the necessary calculations, after which the electronic self-regulating machine was put into operation, which turned on the braking mechanism at the right moment.

Nikolay Nosov, “Dunno on the Moon”

Coordinates are quantities that determine the position of an object.

Direct coordinates

If the performer moved only along a horizontal line, one could consider his coordinates to be the distance from the “house” (center of the stage) on this line.

Moreover, the coordinates to the left of the house can be assigned a minus sign to distinguish them from the coordinates to the right of the house.

But the Little Fox is to the left of the house, and the Cat is to the right, which means the coordinates of the Cat are (x:4), and the coordinates of the Little Fox are (x:−4)

Question. For which point of the sprite are the coordinates indicated?

Answer. For the center of the sprite. Or rather, for projections the center of the sprite on the axis.

The projection of the center onto the axis is the point on the axis left by a straight line drawn from the center onto the axis at an angle of 90°.

The center of the sprite can be conditionally “moved” to another place in the image in graphic editor Scratch with the tool (“set the center of the suit”). Each sprite costume can have its own "center" location.

Question. Coordinates are measured in performer steps. What is one step equal to?

Answer. The performer's environment is located on a computer screen, so the performer walks along screen points - pixels. This means that one step is one pixel.

If the performer moved only along a vertical line, one could consider his coordinates to be the distance from the “house” (center of the stage) on this line.

Moreover, the coordinates below the house can be assigned a minus sign to distinguish them from the coordinates above the house.

The cat and the little fox are at the same distance from the origin of coordinates - at a distance of 4 steps.

But the Little Fox is below the house, and the Cat is above, which means the coordinates of the Cat are (y:4), and the coordinates of the Little Fox are (y:−4)

Plane coordinates

We know very well that the performer can be anywhere on his flat stage! How to determine its coordinates?

It's a good idea to specify not one number, but two as coordinates! The first is the distance from the center of the scene along the X axis, the second is along the Y axis:

Plane coordinates

Frog coordinates: (x:2,y:3). Crow coordinates: (x:−5,y:−2 )

Scene Scratch

The Scratch scene dimensions are 480 pixels horizontally and 360 pixels vertically. The origin coincides with the center of the scene:

Scene Scratch
Plus sign coordinates on stage: (x:240,y:−100)

We will write the coordinates in the form of a list of two numbers without indicating the axes, that is, as is customary in mathematics: (240,−100).

The first number is the X coordinate.
The second number is the Y coordinate.

Commands for working with coordinates

There are two ways to influence the position of a sprite on the stage:

1. Install sprite V given coordinates(x,y).
2. Change current sprite coordinates on specified values ​​(x only, y only, or both coordinates at once).

In the first case, the sprite installed in specified coordinates regardless of its current location. In the second - current coordinates change to specified values.

The difference in these approaches is illustrated by the following figure:

Let the current coordinate be 3
Install V 1 means put into 1
Change on 1 means increase the current coordinate by 1

Commands for working with sprite coordinates are located in the Movement group.

Install in...

Team	Coordinates to	after
Sets the sprite to the given coordinates	Doesn't matter	Now: (100.50)
Smoothly moves a sprite from its current location to specified coordinates	Doesn't matter	Now: (100.50)
The y coordinate does not change. The x coordinate is set to the specified value	Was: (?,50 )	Now: (100.50)
The x coordinate does not change. The y coordinate is set to the specified value	Was: (100,? )	Now: (100.50)

Change to …

Team	Coordinates to	after
The y coordinate does not change. The x coordinate changes to the specified value	Was: (50.50) y does not change	Now: (100.50) x changes to 50
The x coordinate does not change. The y coordinate changes to the specified value	Was: (100.0) x does not change	Now: (100.50) y changes to 50
The sprite moves in the current direction by given number steps	Was: (0,0 )	Now: (8.66.5)

Feather

In spring, when the grass grows,
Remember my words.

“I’ll try,” said Alice.

And in summer the night is shorter than the day,
And maybe you'll understand me.

Deep autumn in silence
Take a pen and write it down.

“Okay,” said Alice. “As long as I haven’t forgotten them by then.”

Lewis Carroll, "Alice Through the Looking Glass"

Look, among the Scratch command set there is a Feather group.

What kind of teams are gathered in this group?

Lower, raise the pen. Set the pen color, thickness, size... These are drawing commands!

Every sprite performer has a feather in stock. It is located exactly in its center. And if you give the command to Lower the pen, the sprite, as it moves, will leave a mark on the stage. Everything is very simple!

The center of the sprite can be conditionally “moved” to another place in the image in the Scratch graphic editor with the tool (“set the center of the suit”). The point at which the pen attaches to the sprite will change accordingly.

Problem 2. Square (2 cookies). Compose procedure drawing a square with side 100.

TK. The first side of the square is drawn according to current direction performer. The second is after turning 90° counterclockwise. Upon completion of drawing, the performer must take starting position and direction

Solution

1. Lower the pen.
2. Repeat 4 times:
   1. Walk 100 steps.
   2. Rotate 90° counterclockwise.
3. Raise the pen.

Procedure code Square

Examination

In the Square procedure, neither the color nor the thickness of the pen are specified, how does it work? The fact is that the color and thickness of the pen are already set in the Scratch environment default, like all other properties of the environment and executors.

The Square procedure performs the traversal of a square with the pen down, and this makes it universal. You can use it to draw squares different color, with lines of different thicknesses, without changing anything inside the procedure itself.

Programmers often name their programs code.

Firstly, because the program encodes contractor to perform some work.

Secondly, because to the uninitiated the program seems like a secret code, and they wonder whose eyes and ears can accommodate such “gibberish”!

Problem 3. Square pattern (3 cookies). You can receive interesting pictures, if you rotate the square around one of its vertices. Build a program that draws such patterns.

Red square pattern rotated 10° counterclockwise 36 times

Solution

The main algorithm of the green flag () is composed of three actions:

1. Preparation. The performer is in the center. Clear the scene. Set pen properties.
2. Drawing. Draw a pattern.
3. Completion. Move away from the pattern.

This algorithm corresponds to a script with three “homemade” procedure commands:

Main green flag script

The Preparation and Completion procedures are quite simple:

Preparation and Completion Procedures

Let's create an algorithm for the Drawing procedure:

1. Repeat 36 times:
   1. Draw a square.
   2. Rotate 10° counterclockwise.

Using this algorithm it is easy to assemble a script:

Procedure Drawing

Explanations

Why does rotating a square create a circle?

The “square” pattern contains a circle! Why?

Recall that a circle consists of points at equal distances from one point, called center of the circle.

The figure on the right shows that all points on the circle, including points A and B, are the same distance r from the center of the circle O. A segment connecting a point on a circle to the center is called radius of the circle.

When a square rotates around its vertex O, that vertex becomes the center of the circle, and the other two adjacent vertices move around the circle with a radius equal to the square's side r.

In fact, it turns out not one circle, but two. The first is passed by points A and B (neighboring to O), the second by point C (on the diagonal OC)

There is a special tool for constructing a circle - compass. But a circle can be constructed using improvised means.

Left: constructing a circle with a compass. Right: using a rope and two pegs

Programming from below. Procedure libraries

From this general rule there is one apparent retreat - procedure libraries.

A procedure library is a collection universal procedures on a topic (for example, drawing geometric shapes).

Why program drawing shapes every time, if you can do it once, and then use it whenever you need it!

But when developing library procedures, the programmer does not work “bottom up,” as it might seem, but “from the bottom,” that is, he creates a part that can be used in different projects.

When creating a library procedure, the programmer still works “top-down,” that is, first programs the main actions (using stubs with meaningful names), and then the details from which these actions are assembled.

Note, however, that the constructed Square procedure can be called a library procedure with some stretch. For universality, this procedure is not enough input data, which could be set as:

• Side length (now always 100).
• Drawing direction (now the square is always drawn counterclockwise).

In the future, Cucaracha will teach how to create such universal procedures.

House in the sun Let's make a project in which the sprite will act as an artist and draw a house in the sun. We have already created a similar background for the scene in a graphics editor. If desired, the drawing made by the sprite can be saved by right-clicking and selecting the desired command: The algorithm for creating this drawing consists of 8 steps:

1. Draw the sky.

2. Draw a path.

3. Draw a fence.

4. Draw the sun.

5. Draw clouds.

6. Draw the body of the house.

7. Draw windows.

8. Draw the roof.

9. Place the sprite in the corner

For greater clarity, each step of the algorithm will have its own script. And as headings we will use the command “When key 1,2,3.. is pressed..”

1. Draw the sky

Among the drawing blocks there is no command to fill any shape with color. Let's get out of this situation by setting the pen size to 300 points. The height of the scene is 360 pixels, so with one broad stroke we will paint over in the right color almost the entire space. The main thing is to lower the pen and raise it at the desired point. In our example, we draw a line from left to right from the point: x=-240, y=40 to the point: x=260 (we specifically go beyond the scene), y=40. To create such a line, the movement command “swim() seconds to point x() y()”, which makes it possible to set both the duration of creation of the line and its end point. Although the same final result can also be obtained with the command “go 480 steps”:. Before you start drawing, it’s better to raise the pen just in case, otherwise you may suddenly find random lines that the sprite made uncontrollably.

2. Draw a path

Let's move the pen to the bottom of the scene, change its color and width to draw a line of the path.

3. Draw a fence

To draw a fence, we use a cycle with which we will draw 25 multi-colored fence boards. And to get a unique color, we use a block random numbers for the color and shade of each plank.

4. Draw the sun

Just lower the pen once yellow color measuring 70 points at the indicated location.

5. Draw clouds

Let's draw clouds in a similar way, just change the color, size and coordinates. How many clouds will our script draw? How can this be determined?

6. Draw the body of the house

Everything is very simple here - let's draw a line of a certain color and size from one coordinate point (x=-40, y=-100) to another (x=40, y=-100). The size of the feather is equal to the height of the body of our house.

7. Draw windows

Because You cannot change the shape of the pen to draw square windows painted with any color (we will make them white), our artist needs a special suit - square , which we will print 2 times in those places of the picture where the windows should be. Make a costume using a graphic editor. Call it “square” as shown in the picture. If you wish, you can not just depict White square, but draw curtains, a flower, etc. Let's print 2 windows:

8. Draw the roof

We use the same approach as with the windows to draw a triangular roof of a certain color. Draw a triangle-shaped suit in a graphics editor so that you can print it on the site of the roof of our house. Call it “triangle” as shown in the picture. Print this costume at the desired location in the scene.

2. Using drawing commands, combined with control and motion blocks, you can create programmable works computer graphics- living drawings that change over time and communicate with the viewer. To create your own living canvas, you can simultaneously launch a whole group of artist sprites with feathers of different colors, shades and sizes.

3. Using a sprite copy printing block, you can create a forest from one image of a tree or a flower meadow from one image of a flower. For copies to be unique, mYou can randomly change the color, size and shape of the original before applying the commandseal. Look at the structure of this script. Try using it to create fairy forest from one tree!

The lessons were about “building blocks”, in this lesson we will clarify some approaches to programming in Scratch.

1. Variables

A variable is a memory location into which a program can write values: numbers, strings, and use (read) them later to calculate new values.

In Scratch, variables can be created and used using blocks in a group Variables. When you create a variable, you specify a name that is used in commands to refer to its current value. In addition, when created, it is specified whether the variable is accessible to all sprites (global variable) or only to one specific sprite (local variable).

To assign and change the values ​​of variables, the blocks put variable into expression and change variable into expression are used. The value of a variable can be displayed on stage using a monitor. The value can also be changed manually using the slider (lever).

2. Lists

A list in Scratch is an ordered collection of memory locations (elements). Elements can be referenced using the array name and indices. In Scratch, you can create and use lists using group blocks Variables. Using the blocks in this group, you can add elements to the end of the list or in the middle, replace, delete, and reference elements.

3. I/O

When solving problems, it is often necessary to give the program initial data and display the results. In the first case we talk about data input (reading), in the second - about data output (printing, display). In Scratch, you can use data monitors with a lever (for numbers only) and a block to enter data Ask, which makes it possible to enter numbers and texts in dialog mode. The results of variables and/or lists can be output using monitors or a block Speak.

4. Sequence and parallelism

When creating a program, you should take into account that the actions specified by the blocks are performed in a certain order. The simplest case is a sequential process, in which blocks are executed in a row from top to bottom.

Two or more scripts (processes) can be executed simultaneously, i.e. parallel. Parallel execution can be specified in several ways. For example, all scripts in which the first block is a block with a green flag are launched simultaneously and are executed in parallel if you click on the green flag.

Scripts starting with the block are also executed in parallel When will I receive the message, in which the same message is received.

5. Events

Objects can react to certain events: pressing a key, clicking on an object, touching another object or the edge of the scene, etc. Scripts can provide reactions to certain events. The main means of processing an event are the so-called header blocks: When the key... is pressed And When the sprite is clicked.

A block is often used inside scripts touches (sprite | edge | cursor)? If this sprite touches another sprite, the edge of the stage, or the mouse pointer (cursor), then the block returns true.

Basically clicking on the green checkbox and running scripts using blocks hand over And when will I receive the message are also events.

6. Interaction between sprites

If a program consists of several scripts, then there is often a need to coordinate and synchronize their work. One sprite can contact others, who in turn can contact the next, etc. Blocks are used to organize the work of scripts: to send a message; send a message and wait; when will I receive the message.

The program shown next consists of four scripts. The script with the green flag is the main one. The program starts with it and launches the rest. If the user enters the letter “d”, the script is launched Read, and after finishing its work the script is launched Calculate. If a letter other than d is entered, the script is launched immediately Calculate.

So,

This concludes the training part of the workshop. Until Monday, October 11, Workshop participants have time to “tighten up their tails.” I'll be on high alert throughout the week.

I decided to collect general principles drawing, this post will be useful for those who are about to try drawing with markers and don’t know where to start. All pictures in the post are from the Internet.

We will mainly talk about drawing with alcohol markers. Let me remind you: the main difference between alcohol markers is that they are refilled with alcohol-containing ink and when you draw with them, the paint dries very quickly and does not warp the paper.

There are several basic techniques:

Drawing with liners- became popular thanks to Anna Rastorgueva’s master classes. First, the main outline of the future drawing is drawn with a waterproof liner (this is important!), the degree of detail depends on your plan, but it is better to stick to large details. Then the colors and tone of the design are added with markers and finally the final accents are placed with a white pen. A white pen can be replaced with white acrylic or gouache, but many people use a pen simply because it is convenient and they can draw thin, neat lines. The technique of applying an outline at the end, after drawing with markers, also works. If you don't have liner, you can try waterproof mascara, but this can be more labor intensive. On this moment, in my opinion, this is the most common technique.

Drawing with a contour, but not with a liner, but with colored pencils, colored pens so that the outline does not stand out from the overall tone of the picture. It looks interesting, but for some reason few people draw like this.

Drawing without outline, using markers only. It is less common because it is not always possible to draw neat small details with markers. However, large-detailed drawings look very cool in this technique. The fairly famous Pomme Chan paints using this technique.

Another example

Also, drawn by Ryan Spahr and the process is shown step by step here.

Combining markers with other materials. Here the markers act as secondary material, but nevertheless they play important role. You can draw a background for the picture with markers multi-colored pencils, on the contrary, you can use pencils on top of markers (I mostly draw this way). This technique allows you to make the shades smoother and the colors richer. In this case, it’s not scary if you lack some colors of markers - pencils perfectly compensate for them. Plus I like the rough texture of the pencil on top of the relatively smooth texture of the marker.

In general, markers can be combined with watercolors, pastels (backings), gouache, and ink. This is excellent material for those who are not afraid of experiments and know how to invent different techniques drawing.

For those who are just starting to draw, here are a few tricks and secrets:


Finally I collected useful videos with drawing techniques to help you get started.

Basic lesson on mixing colors.

And one more basic lesson about markers.

Lesson from Lisa Krasnova, one of the leading sketchers. Lisa is always very bright and beautiful drawings, I recommend looking at everything you find.

An interesting technique for drawing a white cat.

Another amazing artist Volha Sakovich shows how to draw with copics, check her out channel, there is a lot of interesting things there. I like the artistry of the technique and the minimal outline.

A delightful tutorial on how to draw beautiful skin.

And finally, another great example painting technique markers.

Feel free to experiment and come up with something of your own; there are no strict rules in drawing with markers. On the contrary it is relative new material and it's in your hands to try to make it a great tool for your style.