Introduction to Scratch January 26, 2010 What is Scratch? • Scratch is a free programmable toolkit that enables kids to create their own games, animated stories, and interactive art • and share their creations with one another over the Internet. What is Scratch? • Scratch builds on the long tradition of Logo and LEGO/Logo, but takes advantage of new computational ideas and capabilities to make it easier for kids to get started with programming (lowering the floor) and to extend the range of what kids can create and learn (raising the ceiling). What is Scratch? • The ultimate goal is to help kids become fluent with digital media, empowering them to express themselves creatively and make connections to powerful ideas. What is Scratch? • Scratch is built on top of the Squeak environment developed by Alan Kay and colleagues. What is Scratch? • Scratch is being developed by the Lifelong Kindergarten research group at the MIT Media Lab, in collaboration with KIDS research group at the UCLA Graduate School of Education & Information Studies. Learning • Mathematical concepts (coordinates, variables, random numbers, etc.) • Computational concepts (iterations, conditionals, variables, etc.) • Process of design. • Logical thinking. • Meaningful and motivating context. • 21st century learning skills and digital fluency • Sharing and collaboration Programming • Designed for children, teens, and beginning programmers • Building block programming with low floor, high ceiling • Media and manipulation • Sharing and collaboration • Open source, closed development Creating • Dynamic interactive media. • Combine music, animation, graphics, and other media in one program. • Name comes from hip-hop disc jockey scratching technique – creativity. • Sharing – download a complete program for use or pick pieces for your own program. Advantages • Free. • Multiplatform. • Good resources/references. • Sharing and collaboration opportunities. • Open source. • Complex capabilities. • Vast audience. Disadvantages • You have to have the software installed (or program online) to use the final production. • Some of the shared programs have some glitches/nuances. • There are a lot of programs out there to fish from (good and bad). • Takes time and training. Let’s Get Started! • To Open Scratch, double-click on the Scratch (cat) icon or click on Scratch.exe Getting Started With Scratch Once you’ve opened Scratch, you should see this default screen: The Basic Buttons • New Sprite Buttons – The Scratch objects and characters are called Sprites • Get a new cat Sprite (Default) • Paint your own Sprite • Choose an image for a new Sprite • Get a surprise Sprite The Basic Buttons • Sprite Costumes – Change your Sprite’s Look with a costume change – Click on the Costumes tab. To add a costume click Import – To modify your Sprite using the paint function, click Edit – Any image can be used The Basic Buttons • Scratch Blocks – By snapping these blocks together you create a script – When you double click on a script, your program will run – The Scratch blocks are in 8 color- coded categories based on function Exercise #1 The “Cat Walk” Doin’ the “Cat Walk” • We will create a Sprite fashion show. • This exercise will teach you how to make your Sprite: • Change Color • Walk • Undergo a Costume Change Setting the Stage • Before you can begin to move blocks onto the Script Area – Click on the “Scripts” tab – The tab should be pale blue Color Change 1. Click on “Control” from the Palate. 2. Click and pull the block onto the Script Area. 3. Click on “Looks” from the Palate. 4. Click and pull the block onto the Script Area. 5. Snap the two blocks together. Color Change - Your Design & Control Center Screen should look like this. - Hit the space bar and watch your Sprite change colors. Sprite Starting Position These are your (x:) and (y:) coordinates for your stage. 1. Click on “Motion” from the Palate. 2. Click on and pull the block onto the Script Area. Click on the white holes and type in -139 for (x:) and 0 for (y:). This will be your starting point. Sprite Starting Position 3. Click on “Control” from the Palate. 4. Click and pull the block onto the Script Area. 5. Snap the two blocks together. 6. Click on the green flag and watch your sprite change locations. Experiment with position by changing your (x:) and (y:) values. Sprite Starting Position - Your Design and Control Center Screen should look like this. - You can now position your Sprite and change colors. Walking 1. Click on “Control” from the Palate. 2. Click and pull the blocks , , and onto the Script Area. 3. Click on “Looks” from the Palate. 4. Click and pull the block onto the Script Area. Click on the arrow in the costume1 box and select costume2. Walking 5. You should have 2 separate blocks for , that say “Costume1” and “Costume2”. 6. Click on “Motion” from the Palate. 7. Click and pull the block onto the Script Area. 8. Snap the blocks and together as shown. Walking 8. Stack the remaining blocks in this pattern. 9. Click on the and drag your new stack of blocks into the space in the block. IMPORTANT If you do NOT click on the block then your complete stack of blocks will NOT stay together when moved. The blocks will come apart instead of moving together. Walking - Press the green flag and watch! - Experiment with the purple change effects block. Click on the arrow to see the options. - Press the space bar to see the new changes. Making Project Notes • Using the project notes option you can type and leave instructions for other people who look at your Scratch programs. • This is also a great area to leave any comments about the design of your project. Project Notes Icon – can be found in the upper right hand corner of the Scratch Design and Control Center Screen From one Project to Another • Click on Save to save your work – The file should be named “Exercise 1” • Click on New to begin a new program. Exercise #2 The Digital Picasso A Digital Picasso with Animated Painting • We will design digital artwork. • This exercise will teach you how to: – Create a customized Sprite using: • The Paint Function • Animation • Sound Learning How to Paint We will make a sprite that is your name. From the New Sprite Buttons, Click on the button to get started! The paint function will appear in the middle of your screen. Learning How to Paint 1. Click on the paintbrush and select a color from below. 2. Click on the capital T. A black box and a blue vertical line will appear. 3. Click in the paint area. You will now be able to type your name. Click “OK”. Animation & Sound 1. Click on “Control” from the color palate. 2. Click and pull the blocks and onto the scripts area. 3. Click on “Sound” from the color palate. 4. Click and pull the block 4 times into the script area. For two of the blocks, click on the arrow in the 48 box and change the value to 40. The other two stay the same. Animation & Sound 1. Click on “Motion” from the color palate. 2. Click and pull the blocks , , , and onto the scripts area. Note: You need 2 of each for these blocks… Turn Left Turn Right Glide Ignore the numbers at this point. Animation & Sound 3. Enter your values and variables: • In the block type in 3 for the seconds area and (x:) 140 with (y:) as 50 • In another block type in 3 for the seconds and (x:) -135 with (y:) -157 • For the 2 blocks and the 2 blocks have 1 Left and 1 Right stay at 15 degrees • Type in 30 degrees for the other 2 blocks • The should say x: (0), y: (0) Animation & Sound 4. Using what you have learned so far stack your blocks into this order. 5. Click the green flag and watch your Sprite go! 6. Celebrate Success!! 7. Save your new script under “Exercise 2”. 8. Open a new page and be creative. Examples • Paul Bunyan http://scratch.mit.edu/projects/Broadhead/432801 • Brer Rabbit http://scratch.mit.edu/projects/VAOgracie/425415 • The Ant and the Grasshopper • http://scratch.mit.edu/projects/ncosta2/365377 Potential Classroom Uses • Great way to integrate educational subjects (e.g. Math and Language Arts). • Secondary classes can create stories or games for elementary students. • Teacher can create unique ways for students to learn/retain material. • Multimedia integration and editing. • Get elementary students started in programming. Resources • Scatch Home - http://scratch.mit.edu/ • Scratch Reference/Resources – http://scratch.mit.edu/howto • Scratch Educators- • http://scratched.media.mit.edu/ • Have Fun and Let’s Create!!