Activity 1.1.3 Count Me In - lennoniedactc.weebly.comlennoniedactc.weebly.com/uploads/2/2/6/4/22641690/1.… · Web viewIn this activity, imagine that a group of students have interviewed

Activity 1.1.3 Count Me In

Introduction

How do computers work?

A computer—whether a laptop, a smartphone, or a computer under the hood of a car—follows one instruction at a time. Each instruction tells a processor to do one simple task such as "add two numbers together." Programs are lists of those instructions, one instruction after another.

Programs also define new instructions that are more abstract, such as "count the number of people in a picture."

How are programs created?

A software developer uses a computer language to write a program, listing instructions for the computer to follow. The program might respond to input such as the keyboard, mouse, or touch screen. The program might produce output such as sound, graphics, or motor movement.

Materials Computer with browser

© 2015 Project Lead The Way, Inc.

Introduction to Computer Science Activity 1.1.3 Count Me In – Page 1

Android device with AI Companion Google ID 1.1.3 sourceFiles.zip

Procedure 1. Form pairs as directed by your teacher. Practice a professional

greeting that includes shaking hands and saying something enthusiastic with a smile and eye contact.

2. At the end of this lesson, you will build an app to help meet a need that you identified through interviewing three people. This activity demonstrates the first steps you will need to take when it is time to solve the problem. In this activity, imagine that a group of students have interviewed three people in your community and have identified their needs as described below.

Alisha works at a retail store, Paul sells tickets at school sporting events, and Mrs. Lang works in the school lunchroom. The student team realized that the three prospective clients all described different versions of the same need. They all need an app that will help them tally.

At the retail store, Alicia sometimes has to take inventory, counting how many of each item are on the shelves. She has to write down or type in the number in stock of each item, but she needs her hands free to climb ladders for the high shelves and to be able to move things around to count them.

Paul sells tickets for some of the school's sporting events. He also is on the athletics committee that sets the various prices for the tickets. The committee is discussing prices for some of the games that have free attendance. Paul would like to be able to quickly count attendees at the free games so that he can bring this information back to the committee to inform the discussion.



Mrs. Lang in the lunch room wants a count of how many people intended to eat hot lunch each day. The school used to poll students for that data but quit doing so. She wonders if a kiosk tablet by the door might be able to help get attendance and lunch count information.

3. You will be creating your own tally counter, a variation of the one you just used. To create the tally counter, you will learn how to decompose a problem into smaller steps. Problem decomposition is a central concept in learning to program.

Review the presentation about problem decomposition. Note that the first user story on the backlog has been broken down into the list of sprint tasks. Describe other ways in which the content and format of the product backlog and the sprint task list demonstrate the main point of that presentation.

Backlog

1. Person tallying wants to increment a counter so they can count people or things without keeping track of the total so far.

2.Person tallying wants to count several tallies at once so they can compare the counts of different items being tallied.

3.Person tallying wants to control the tally counter by voice so that they can have both hands free.

4.Person tallying wants the tally to accumulate automatically



so they don't have to pay close attention to the device’s screen.

5.Person tallying wants text message or email alerts when various counters reach certain thresholds so they can respond with action.

Sprint Task List for Backlog Item #1

When the user presses a button, add 1 to a counter.

Make the interface attractive with an image for the button, some color, and a label for the counter.

Make a sound when the user presses a button so they know it has been pressed.

When the user presses a reset button, make the counter 0.

A checkbox can enable or disable whether the tally button works.

4. Open MIT App Inventor by following these steps:

a. App Inventor authenticates you by asking Google to check your credentials. Sign in to a Google account at https://google.com. Before typing a username or password in a browser, always check the schema (HTTPS) and domain name (google.com).



https://google.com/

b. Navigate to the App Inventor website http://ai2.appinventor.mit.edu and allow Google to provide your user name to App Inventor. Continue past the splash screen(s).

5. Select Start New Project. Name the “Last Name”CountMeIn (remember all words must be sqeezed together so we capitalize each word) and create a new folder, 1.1.3, within your ICS folder on the P:drive for your work.

6. In this step, you will create the interface in the Designer view. In the next step, you will add functionality in the Blocks view.

One of the students sketched the interface she wanted. Her sketch is shown below. Create the interface with the following steps as described in the video on the basic tally app.

a. Drag the components (a button and two labels) onto the interface from the User Interface drawer. Place the two labels



http://ai2.appinventor.mit.edu/

inside a horizontal layout component from the Layout drawer. Rename the components to say what type of component they are and why they are there.

Component Name

Button Button1_Tally

Label Label1_CounterDescription

Label Label2_CounterNumber

b. Set some of the initial values of the components' properties using the Properties panel in the Designer view. The following properties will initialize the text of the labels and to initialize the size of the button.

Component Name Property Value

Label1_CounterDescription Text Counter #1:

Label2_CounterNumber Text 0

Button1_Tally Text Count on Me!

Button1_Tally Width 200 pixels

Button1_Tally Height 200 pixels© 2015 Project Lead The Way, Inc.


3

c. Make the button display an image as follows.

i. Upload an image file using the Media panel. The image countMeIn.JPG is provided in the activity's source files.

ii. Select the button in the Components panel and then in the Properties panel, set the button's ‘Image’ property to use that file.

d. Make a sound component to play a clicking sound when the button is pressed.

i. Drag a sound component from the Media drawer into the interface Viewer. The component will appear at the bottom of the viewer as a non-visible component.

ii. Upload the ‘click’ sound file using the Media panel.

iii. Select the sound component in the Components panel and then in the Properties panel, set the ‘Source’ to your sound file.

Insert a snip of the Viewer screen (be sure to include your project name):



7. In the Blocks view, create an event handler for when the button is clicked. The handler should play the sound and increment the tally when the button is clicked.

I don’t know why they all of a sudden changed Tally to Count, but it is the same thing. Don’t look for Button1_Count in your coding; Button1_Tally is correct.

Select ‘Save Project As..’ and save as version 1, such as “Your Name”CountMeIn1.

Insert a snip of the Block coding:

Select ‘Save Project As..’ and save as version 2, such as “Your Name”CountMeIn2. If you don’t, as you change your coding, AppInventor will change your saved version 1 by automatically saving as you make changes.

8. Test your program by connecting to the device with the following steps:

(If this is the first time you are connecting a device to the computer, make sure the driver has been loaded with ADBDriverInstall.)

a. Start AiStarter on your desktop



b. Start AI Companion app on your phone/tablet

c. Select Connect in the top ribbon of AppInventor

d. In the Connect drop down menu, select USB

9. Create solutions for the following challenges. Save each of these as new versions of your program.

a. The user is getting tired of adding large numbers to the inventory counterer . Add a new counter button to increase the counter by 10. Things to do: Resize the counter to 150 pixels by 150 pixels. Add a second button (150 pixels by 150 pixels) in a horizontal arrangement with the first counter button. Add new text for this button that explains what it does for the user. Add a new picture of your choosing (you will have to download it to your P:drive first) for its background. Add new Block coding to accomplish the task of adding 10 to the counter every time the button is selected.

Insert a snip of the Block coding and a snip of your Viewer screen:

Select Save Project.

Select ‘Save Project As..’ and save as version 3.

b. Add a reset button. When the user presses the reset button, make the counter go back to zero.






c. The user wants to be able to carry the Android device around as they're tallying, but doesn't want to accidentally tally while holding the tablet when walking. Add an "enabled" checkbox so that the user can enable or disable whether the tally button works. You will use the if-then block as shown here.






d. Challenge d, extension: Add two sounds to the app to give the user more feedback. Add behavior so that when the tally button is pressed the app makes one sound if the counter is enabled and another sound if the counter is not enabled. Use the following steps.

i. In the Designer view, use the Upload File button in the Media panel. Upload two sound files. You will need to have these saved in your P:drive first.

ii. Add two Sound Components from the Media drawer.

iii. Set the Source property of each sound to one of the sounds you uploaded.

iv. Create the behavior that the tally button plays one sound if the checkbox is enabled and plays the other sound otherwise. You will probably want to use an if-then-else block, which you create as follows.



1. Use an if-then block and select its mutator, the blue gear.

2. Drag an else from the mutator palette on the left to the block configuration on the right.

e. Use a second set of buttons to tally a second type of object. The new item should have a separate set of labels for the description and tally. You will have to change the heights and widths properties for the Tally buttons to make everything fit correctly.



Conclusion Questions1. What is an event handler? Describe how you create an interface with

event handlers in App Inventor.



2. The number 1000 could be several different types of data. Explain.

3. Think of a problem you solve frequently in your day-to-day life. Explain how you use or could use problem decomposition to solve that problem.

4. Developers start working on the top item of a backlog before thinking too much about how to clearly define items that are lower on the backlog list. Explain why you think developers often start development before completing all details of a plan that goes from start to finish.



Documents

Activity 1.1.3 Count Me In - lennoniedactc.weebly.comlennoniedactc.weebly.com/uploads/2/2/6/4/22641690/1.… · Web viewIn this activity, imagine that a group of students have interviewed