introduction to programming with tynker · web viewintroduction to programming with tynker note:...

Introduction to Programming with TynkerNote: This document was created using Tynker version 3.12.28 and may be inconsistent with other versions.

Tynker can be used to make an animation, a game, or a program that helps you solve a problem. You can add actors to your program and give them instructions to follow to make them do things like move around the screen and interact with the user. Work with your group and follow the steps below.

Note: This document is a paper-based version of the interactive video presentations “Introduction to Tynker” and “Understanding the Grid” that are available in the curriculum course.

1. Open Tynker on your device.

2. Find the projects screen and create a new project. If you are given options for different types of projects, select Blank Template in order to start with a brand new project.

3. Tynker starts out with the default actor in the center of its stage. Click on the actor and click the Code icon to view the actor’s code.

© 2015 Project Lead The Way, Inc.PLTW Launch Introduction to Programming with Tynker –

4. You can see that this actor already has some code. Not all of the actors in Tynker come with code, but this one does. The code looks like puzzle pieces snapped together. Review the code that is already there. Can you tell what it is instructing the actor to do?

5. Click the Play button to see what the actor does. Did you guess correctly?

6. Click on the Code|Stage button to go back to the stage setup.

7. Click on the actor again and click the trash can icon to delete the actor. Confirm the delete action by clicking Yes.

8. It is good practice to give your project a meaningful name so you can find it easily the next time you are in Tynker. To rename your project:


a. Click the Code|Stage button to switch back to the Code view.

b. Click the Pencil tool next to the project name at the top of the screen.

c. Enter the name “A3-2” followed by the initials of all the group members. Separate them by spaces. For example, use “A3-2 JK LS DG.”

d. Click Done to save the new project name.

9. Go back to the Stage view and click on the + icon to add a new actor.

10.Tynker’s graphics are organized in categories. Select the Fantasy theme and choose an actor. Don’t spend too much time looking at all of the actors right now. You will have time later to explore everything!


11.When you select the actor, it is added to the center of the stage. You can drag it to another position on the screen and resize it by pinching in and out with two fingers or by using your mouse. Try dragging and resizing the actor now.

12.Click the actor and select the Code tool to view the code section. Some actors come with built-in code ready to be used (like the default actor did). Others have no code at all. In either case, you can add your own code to program the actor to give it new or additional instructions.

13.Browse through the different categories of blocks on the left.


Browse through the categories for about two minutes but don’t pull out any blocks yet.

14.Before adding code to your actor’s program, it is always good to ask the following questions:

a. What behavior do I want the actor to do?

b. When do I want the actor to do that behavior?

The answer to (a) will help you figure out what type of block to use (Motion, Looks, Drawing, Functions, etc.)

The answer to (b) will help you determine which event to use. In other words, you will be able to choose from the Control/Flow category or the Sensing category to determine the event that will trigger the actor to do the behavior you want it to do.

Let’s say you want the actor to move 200 pixels when the Play button is clicked. A pixel is the smallest element, or dot, of the display on a digital screen. An electronic screen is made of thousands of pixels that form a grid. You will learn more about this grid later in this tutorial.

a. What behavior do I want the actor to do? Move 200 pixels

b. When do I want the actor to do that behavior? When Play button is clicked (which means “on start”)

Drag out the blocks to make the actor move 200 pixels when the play button is clicked (on start).

15.Click the Code|Stage button to return to the stage screen.

16.Test your code by clicking the Play button.


Did your actor move? Did it move far?

17.Take a close look at the picture of the Tynker screen shown below. Notice that it has a slightly visible grid with vertical lines and horizontal lines, as well as a main horizontal line labeled “X Axis” and a main vertical line labeled “Y Axis”. This is known as the coordinate plane, and it is typically used for graphing.

In Tynker, the coordinate plane is used to locate the center of each actor. Points, or locations, on a coordinate plane are represented in parenthesis, listing the x-value and then the y-value. These values come from counting out from the origin, or center of the coordinate plane, shown by a red circle in the picture above. Since the origin is in the center, on both the x-axis and the y-axis, it is represented by (0, 0).

You will notice that above the happy dwarf actor in the picture above, there is a (0, 0). This is indicating that the happy dwarf actor is currently centered on the origin. If you were to drag him four spaces to the right, that coordinate would change to (4, 0). If you were to drag him three spaces down, that coordinate would change to (4, –3).

In the picture below, notice how points A, B, C, and D are labeled with their coordinates. Can you figure out the coordinates for points E, F, G, and H?


Drag your actor around the screen. Notice how the actor’s coordinates change as you move it around. You will also see two other numbers after the coordinates. The first is a percentage, which tells you how big or small the actor is. To change the actor’s size, pinch in and out with two fingers or click on the pencil. The third number is the actor’s rotation, represented in degrees. To change an actor’s rotation, swivel it around with your fingers or click on the pencil to change its angle.

18.Note that there are several useful tools at the top of the screen:

a. You can view an actor’s properties, duplicate the actor, or delete it using the options button on the actor picture.

b. You can switch between actors by clicking on the actor pictures.


c. You can get information about any block by dragging the block onto Codey, the blue character in the upper right corner.

After dragging a block onto Codey, a description of the block will appear. Click the white x to close the block description window.

d. You can copy blocks from one actor to another. This can save you a lot of time, so remember this trick! Click on any block or group of blocks and drag it to the picture of any actor in the top bar. The blocks will be copied to the new actor, and Tynker will automatically switch you to that actor’s view where you will see the newly copied blocks. Note: the original actor still has its copy of the blocks, too.


19.Take a few minutes to try out different blocks from the Motion and the Looks categories. Each time you change the program, click the Play button to see if the blocks make the actor do what you expected. It’s okay to make mistakes and then try to fix things. That is one of the best ways to learn!

Note: There are some blocks that only work when using a keyboard (like the event of pressing an arrow key), so you should avoid using them.


introduction to programming with tynker · web viewintroduction to programming with tynker note:...

Documents