2. MIT AI2 1.1.2 DEMO

3. Start New Program Name “My First Program”

4. Drag these 3 Components into your blank area. ComponentDesigner DrawerPurpose ButtonUser InterfaceRespond to being clicked CanvasDrawing and Animation Provide a touch- sensitive surface where you can draw and animate CameraMediaAccess the device's camera

5. Rename Each Components Use Component_Purpose names “Take a Picture!”

6. Designer View

7. Block View

8. Block Locations Drag one of each to the blank area. BlockBlocks DrawerPurpose Camera drawerLets the user take a picture Camera drawerEvent handler! This script will execute after the user takes a picture. Button drawerEvent handler! The script inside this block will be executed when the user releases a button. Canvas drawerSets the background image of the canvas. mouse over on the camera's "After picture" `block Refers to the picture just taken. Only available locally, within the "After picture" event handler.

9. Arrange the times to look like this

10. Snip Designer and Block Screens Paste them into a word document. Document header – Name – Date – Class Period Save document 112SBurgess1.. Use your name Submit doc to LMS 1.1.2 First Code

11. Finish up You program automatically saves.

12. Open My First Program When you first open a program it is automatically in Designer view.

13. Designer View Pull 1 of each of these components ComponentDesigner DrawerPurpose LabelUser InterfaceDisplay text SliderUser InterfaceChange a value as the user slides a control back and forth Horizontal ArrangementLayoutCenter a component or place components side by side

14. Place the Label and Slider in the Arrangement Box

15. Block View The Drawers are color coded. Look at the Block color to see what drawer it comes from.

16. Add buttons to change the color of the pen. Here we've add three buttons, placed them inside a Horizontal Arrangement, and set the Shape and Background Color property of each button. In the Components list of the Designer view, we've also renamed each button to a name like "ButtonBlue." That helps the programmer keep track of the components.

17. Designer View

18. Block View You need a block set for each color. Look at the block color to find the drawer it is located in.

19. Designer View Clear the canvas when you shake the tablet. Add an accelerometer sensor component. ComponentDesigner DrawerPurpose Accelerometer SensorSensorsDetect when the tablet is shaken. Also detects when the tablet is tilted forward or left/right.

20. Block View Remember to look at the color of the blocks to find their location in the drawers.