Distributing (Fun + Learning): The Distributive Property

1. Distributing (Fun + Learning):The Distributive Property By: Peggy Li Under the direction of Professor Susan Rodger Duke University, June 2011

2. Overview • This tutorial will help you make an Alice world that lets you practice the distributive property. • An expression in the form a(bx+c) will appear, where a, b, and c are nonzero integers. • A possible answer for the expanded form will also show up. The user clicks Y if he/she thinks it is right, and N if he/she thinks it is wrong. • Concept can be further developed to practice more advanced concepts like adding algebraic expressions or using fractions.

3. Creating a new world • Open Alice and create a new world. • Select a template of your choice. (This tutorial uses Grass, but any other works too.) • Click Open to start building your world. • Remember to save your world somewhere you can find it later!

4. Adding a person • Click the green Add Objects button. • In the Local Gallery, scroll to the right until you reach the People folder. Click on the folder. • Scroll to the right until the very end. • You can use hebuilder and shebuilder to create your own character.

5. Why hebuilder/shebuilder Just a quick explanation! • You might have noticed there are lots of other cool people to choose from in the People folder! • We’re going to use the Character Builder because it comes with some built-in methods that will be helpful later on. • Once you’re comfortable working in Alice, you can use an existing character and create new methods for it.

6. Customizing your person • Customize your person! You can choose: • Body: head, torso, and legs • Face: skin tone, eyes, and lips • Hair: length/style and color • Clothing: shirt, pants, and shoes • Give your character a name and enter your name in the Created By box. Now click OK! Note: The person in this tutorial is named Guide. This will come up in future slides.

7. Rotating the arms • Your person’s arms will be spread out like in the picture. Let’s move them back down to his/her side. • Find the Object Tree on the left. • Click the + next to your person’s name, then click the + next to upperBody and Chest. • You should now see parts called rightUpperArm and leftUpperArm.

8. Rotating the arms • Right-click on rightUpperArm in the Object Tree. • Now go to Methods, select roll, and right. Click on Other and type in 0.2. • Do the same for leftUpperArm, but this time roll it to the left, again by 0.2. • Your person’s arms should look like this:

9. Adding 3D text objects • Click on Add Objects again and return to the Local Gallery. • Scroll all the way to the right until you reach Create 3D Text, and click that. • Enter “a(bx+c)= ” for the text. • If you want, you can change the font. The tutorial will use Arial bold. • Make another 3D Text that says “abx+ac”.

10. Renaming and turning 3D text • In the Object Tree, right-click on the first 3D Text you made and rename it “expression”. • Rename the second one “answer”. • Right-click on expression in the Object Tree. Go to Methods >> turn to face >> camera. • Repeat Step 3 for answer. • Both objects should now be facing you.

11. Repositioning objects • Locate the object control buttons. Use them as needed to move and resize the objects until they look roughly like this:

12. Changing 3D text color • We can change the color of the expression and answer text objects. • To do this, click expression in the Object Tree and go to the Properties tab. • Click the arrow next to color and choose any color. This tutorial will use blue. • Do the same for answer. The tutorial will use magenta.

13. Making answer buttons • Now let’s make two answer buttons: one Y (yes/correct) and one N (no/wrong). • Go to Local Gallery >> Shapes folder and add two squares to your world. • Rename them yesButton and noButton. • Turn both squares to face the camera by right-clicking and going to methods >> turn to face >> camera. • In their Properties tabs, change the yesButton color to green and the noButton color to red.

14. Making answer buttons • Now create two new 3D text objects, one that says “Y” and the other that says “N”. You can choose a font; the tutorial uses Arial, bold. • Rename them Yes and No and them to face the camera. • Move and resize them so that each is directly in front of the corresponding square. • Under Properties, set the vehicle of Yes to yesButton and No to noButton. This “glues” the letter to the square.

15. Positioning answer buttons • Move the answer buttons forward and/or down (resize if needed) so they look like this:

16. Getting a random expression • Let’s make a new method that will give us a random expression in the form a(bx+c). • Click on world in the Object Tree, go to the methods tab, and click create new methodwith the name getExpressions. • Click create new variable and make a new variable with namea and type number. Set its value to 0 (select other and type in 0). • Make two identical variables called b and c.

17. Setting random numbers • Now we’ll set random values for a, b, and c. • Drag a while into the method and select true. • From the variables list, drag a over true, select a ==, and set b to 0.

18. Setting random numbers • Drag another a, this time into the while loop. Select set value, and choose any number (we will change this in a moment). • Go back to world in the object tree. Under the functions tab, find the random number (under the third section Random). • Drag random number into the method, over the value you set a equal to.

19. Setting random integers • Click the more right next to random number and set the minimum to -10. • Repeat Step 1 to set the maximum to 11 and integerOnly to true. • When we get a random number, it can include the minimum, but goes up to not including the maximum. Here we want numbers from -10 to 10, so maximum = 11. • We want integerOnly so the numbers are easy to work with – not long decimals!

20. Getting a random expression • Click the more arrow at the end of the line and set duration to 0 seconds. • Drag the entire while loop to the clipboard in the upper right, to “copy” the contents. • Drag the clipboard back into the method, under the while loop, to “paste” the contents. • Repeat Step 3. You should have a total of three while loops in the method right now.

21. Getting a random expression • In the second while, change both instances of a to b. Then, in the third while, change both instances of a to c. • The while statements ensure that a, b, and c are all nonzero so we don’t get anything too easy like 0(0x+2). Remember that a, b, and care were all set to 0, so the while loop makes sure a new number is generated until the variable is no longer equal to 0.

22. Getting a random expression • Now create two new number variables and name them ab and ac. Set both values to 0. • Drag ab into the method (below third while), and select set value >> expression >> a. • Click the arrow by a and choose math >> a* >> expression >> b. This just means a x b. • Repeat Steps 2-3 for ac, but remember to choose c instead of b. • Set the duration for both ab and ac to 0.

23. Getting a random expression • Go to world’s functions tab, and scroll down until you find absolute value of a in Math. • Drag absolute value into the method, over the entire a*b (not just a). Repeat for a*c. • This means that ab and ac are both positive. We do this for formatting reasons, as we will see shortly.

24. Getting a random expression • Create five new variables, all type String and set to default value. Name them aString, bString, cString, abString, and acString. • Drag aString into the method and set its value to default string for now. • Under world’s functions, find and drag the what as a string over default string. Choose expressions >> b. • Repeat steps 2-3 for the other four variables. Make sure you use the matching number! • Set the duration for each line to 0.

25. Casting integers to strings • Scroll to the bottom of world’s functions and find int a as a string. Drag this over a, b, c, ab, and ac in the five lines and reselect the right variable name in expression. • What this does is remove the decimal format that otherwise comes with making an integer a string using just what as a string. In other words, when 4 becomes a string, it is now just 4 instead of 4.0. • You do need to keep what as a string in addition to int a as a string.

26. Setting integers as strings This is how the last five lines should look now. Make any changes or corrections if needed.

27. Formatting the expression • Drag an if/else into the method.

28. Shuffling the answers array • Go back to world’s methods tab and create a new method called shuffle. This will put the answers in random order in the array. • Click create new parameterto make a new parameter named answerArray. Make it an array of type Other >> String.