12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb...

16
12/12/2017 1 mjb – December 12, 2017 Oregon State University Computer Graphics Scratch ! Mike Bailey [email protected] Oregon State University http://cs.oregonstate.edu/ mjb/scratch ~ mjb – December 12, 2017 Oregon State University Computer Graphics What Kind of People Need to Tell the Computer Where to Put Things?

Transcript of 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb...

Page 1: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

1

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Scratch !

Mike Bailey

[email protected]

Oregon State University

http://cs.oregonstate.edu/ mjb/scratch~

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

What Kind of People Need to Tell the Computer Where to Put Things?

Page 2: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

2

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Programming from Left-to-Right

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Programming from Top-to-Bottom

Page 3: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

3

mjb – December 12, 2017

http://www.skirtsandscuffs.com/2011_03_01_archive.html

When the Green Flag gets waved, what happens?

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Page 4: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

4

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Page 5: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

5

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Put Your Right Hand on Top of Your Head

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Put Your Right Hand on Top of Your Head

Turn Around One Circle

Page 6: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

6

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Put Your Right Hand on Top of Your Head

Turn Around One Circle

Meow Like a Cat

Count to 2

Repeat 3 Times

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Put Your Right Hand on Top of Your Head

Turn Around One Circle

Put Your Hands Down

Meow Like a Cat

Count to 2

Repeat 3 Times

Page 7: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

7

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Put Your Right Hand on Top of Your Head

Turn Around One Circle

Put Your Hands Down

Sit Down

Meow Like a Cat

Count to 2

Repeat 3 Times

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Stand Up

Raise Your Left Hand

Put Your Right Hand on Top of Your Head

Turn Around One Circle

Put Your Hands Down

Sit Down

Smile !

Meow Like a Cat

Count to 2

Repeat 3 Times

Page 8: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

8

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

X

Y

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

X

Y

100 200

100

00

Page 9: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

9

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

X

Y

100 200

100

00

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

X

Y

-100-200

-100

200

100

100

Page 10: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

10

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

X

Y

100 200

100

-100-200

-100

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Scratch Screen Layout

Script Area“Stage” (i.e., the scene)

CommandCategories

CommandsSprite Manipulation

Sprite Selection(the “waiting room”)

Run your Program!

Page 11: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

11

mjb – December 12, 2017

1. Green Flag puzzle piece3 Glide pieces

2. Additional actors3 Glides for each

3. Glides in a forever loop

4. Turn (rotate) and Change size

5. Turn (rotate) and Change size in Forever loops

6. Multiple Green Flags

7. Background

8. Sound

A Good Order to Start Doing Things In

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Page 12: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

12

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Move an Actor

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Keep an Actor Moving

Page 13: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

13

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Keep an Actor Spinning

Page 14: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

14

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Keep an Actor Changing Size

mjb – December 12, 2017

http://www.skirtsandscuffs.com/2011_03_01_archive.html

When the Green Flag gets waved,does only one car get to start, or all of them?

Page 15: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

15

mjb – December 12, 2017

When the Green Flag gets waved,does only one program get to start, or all of them?

mjb – December 12, 2017

Oregon State UniversityComputer Graphics

Page 16: 12/12/2017 Scratchweb.engr.oregonstate.edu/~mjb/scratch/scratchintro.2pp.pdf12/12/2017 2 mjb –December 12, 2017 Oregon State University Computer Graphics Programming from Left-to-Right

12/12/2017

16

mjb – December 12, 2017

Oregon State UniversityComputer Graphics