sfe.io/r74
DESCRIPTION
Using graphing / data visualization as a Playground for Literacy and Mathematics. http://sfe.io/r74. @ sparkfun #nsta14. Scratch-ing the Surface of Programming and Enhancing Science. Using graphing as a Playground for Literacy and Mathematics. Brian Huang, Linz Craig, Derek Runberg - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/1.jpg)
http://sfe.io/r74 @sparkfun #nsta14
Using graphing / data visualization as a Playground for Literacy and Mathematics
![Page 2: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/2.jpg)
Scratch-ing the Surface of Programming and Enhancing Science
Using graphing as a Playground for Literacy and
Mathematics
![Page 4: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/4.jpg)
Pause…
Before we move any further, let’s make sure that we all know each other in this room?
Please introduce yourself to the person(s) sitting in your general vicinity. Tell them a few things about yourself, maybe:
– where you’re from– what you teach– why you’re here– what you hope to get out of this….
![Page 5: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/5.jpg)
Schedule
• Introduction to Scratch, History• A few basic functions• Draw and graph• PicoBoard• Adding more functions
![Page 6: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/6.jpg)
About Us
At SparkFun, our focus is all about creation, innovation, and sharing information.
Open Source Hardware is at the core of our business. We emphasize researching, re-mixing, adapting, making improvements, and sharing with the world!
![Page 7: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/7.jpg)
![Page 8: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/8.jpg)
![Page 9: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/9.jpg)
![Page 10: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/10.jpg)
“Teachers that make… Make great teachers”
-Anonymous
![Page 11: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/11.jpg)
Scratch?• MIT Media Lab / Life-long
Kindergarten Lab• Out growth of Seymour Papert
![Page 12: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/12.jpg)
A few things..
• Free, http://scratch.mit.edu– Download version 1.4
• Open source• Create games, animations, & interactive environments• Interfaces with hardware: Picoboard, Makey Makey
![Page 13: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/13.jpg)
Elements \ Vocabulary
• Sprite / Costume• Stage / Background• Script / Blocks
![Page 14: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/14.jpg)
![Page 15: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/15.jpg)
![Page 16: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/16.jpg)
The stage is a background or a “back-drop” for your project..
You can paint, import, or take a photo as your background.
Multiple backgrounds may be used to create different scenes for a story or levels in a game.
![Page 17: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/17.jpg)
Grid space for the stage is setup with a standard Cartesian coordinate system.
The origin - (0,0) is in the center.
Extents are:
X: -240 to +240
Y: -180 to +180
![Page 18: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/18.jpg)
Attributes of the sprite and the stage can be manipulated using a script or set of instructions.
A script consists of a set of blocks that are “strung” together.
Blocks are organized into 8 separate “bins” by how it affects the sprite →
![Page 19: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/19.jpg)
1. Modify your Sprite / Costume and the Stage / Background.
2. Use any of the 8 blocks (or copies of the blocks) to introduce yourself to the class.
3. Right-click on any block and select duplicate to make a copy.
![Page 20: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/20.jpg)
General Usage Tips
![Page 21: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/21.jpg)
A basic function
![Page 22: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/22.jpg)
Cloning..
![Page 23: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/23.jpg)
Creating a sprite
The paint tools in Scratch are standard
![Page 24: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/24.jpg)
Pretty neat, eh?
![Page 25: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/25.jpg)
Hat Blocks
Hat blocks all start with the key word “when”
Hat blocks define the beginning of a script.
Any blocks attached to this will execute (run) when the event XXXX occurs.
![Page 26: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/26.jpg)
So, why Scratch? What else can it do?
• Presentations• Animations / Simulations
And...
![Page 27: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/27.jpg)
GRAPHING!
![Page 28: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/28.jpg)
Paint a simple sprite – just for data
![Page 29: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/29.jpg)
Initialize the position of the sprite
Recall: Grid space is X: -240 to +240, Y: -180 to +180
![Page 30: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/30.jpg)
Introduce a loop or “forever”
Blocks can be placed inside the “forever” bracket.
Any and all code blocks inside this will repeat over and over… forever…
![Page 31: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/31.jpg)
Pen feature(s)
As the sprite moves across the screen, it can place a “pen” down to trace it’s motions.
This feature can be used to sketch simple shapes, plan out maps, or graph data…
![Page 32: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/32.jpg)
Setting up the pen to draw
Rationale / pseudo-code:•Start / go to origin•Clear screen•Pen down
– Increase x– Repeat
![Page 33: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/33.jpg)
Adding a “y” control
For fun, let’s tie the y-axis to the mouse (notice that the blocks are of different colors…)
![Page 34: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/34.jpg)
Reset when it hits the end“If this, then that…”
![Page 35: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/35.jpg)
“If this, then that…”
![Page 36: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/36.jpg)
Adding Sensors (PicoBoard)
![Page 37: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/37.jpg)
Using the sensors
• Right click or ctl click for the menu
![Page 38: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/38.jpg)
A little math…Sensor readings range: 0 – 100.
Scale the number to fit our widow using two points: sensor = 0, y = -180 ; sensor = 100, y = +180
![Page 39: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/39.jpg)
Math operators / order of operations:
![Page 40: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/40.jpg)
Explore other sensors…Add a second sprite & second line?
![Page 41: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/41.jpg)
Advanced – Timing and data output
Introduce timer object reports # of seconds from start of program or since the “reset timer” block was called.
![Page 42: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/42.jpg)
Advanced – Timing and data output
Scaling the timer 480 pixels (points) in the x-direction.
![Page 43: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/43.jpg)
Creating a data list
![Page 44: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/44.jpg)
Creating a data list
![Page 45: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/45.jpg)
Finale
![Page 46: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/46.jpg)
Right-click on the data list and…
![Page 47: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/47.jpg)
Now what?
• Interested in professional development? Want to learn more?– Check-out our SparkFun Inventor’s Kit (SIK)– Also sold as a lab-pack for schools– 15 complete circuits with a full-color experiment guide.– Guide is available as a PDF.
• Teacher Prof. Dev Workshops available:– Contact: [email protected]
![Page 48: sfe.io/r74](https://reader036.vdocuments.site/reader036/viewer/2022081603/56813b18550346895da3c963/html5/thumbnails/48.jpg)
Questions?
email: [email protected]: @bri_huang, @sparkfun, #nsta14
Interested in any of this? E-mail us about our 20% educator discount – [email protected]