Sponsored By Tormach

STEM Lesson: Using MIT App Inventor in the Classroom

September 16th, 2012 by

MIT’s App Inventor is a browser-based platform that allows anyone, including your students, to create mobile apps for android based devices. Computer programming is a high level STEM subject requiring the integration of skills in multiple core areas. Using programming to create applications for the devices that students have in their pockets makes computer science relevant, rewarding and fun-as well as potentially profitable.

Discussion/Introduction: Some of the students may have smart phones in their possession, and this is a good chance for them to show off a bit. Have them talk about apps they find useful, things they got rid of and so on. Make sure they are appropriate to school. The nice thing  about App Inventor is that an android phone is not necessary for full functionality, since the interface has a built in emulator.Talk about the major operating systems that run on today’s mobile phones and tablets. Apple’s iOS, Android and Windows should be discussed in terms of popularity/market share, number of available apps, and methods to download apps. Also free vs paid apps and how/why developers get compensated for their efforts.

Would students like to create their own app and possibly get compensated in real money?

The most difficult part of this is starting off with an idea for an app: what functionality is missing, should be improved, or could be integrated, into a phone? Students rarely come up with answers at the beginning of this discussion. Start with a survey: what apps are there now that they use? Most likely it will be social media and games. Check out and demo some other apps on the smart board or other display. What can the electronics of a phone actually do?

Getting Started With App Inventor

App Inventor’s drag and drop interface will make it easy for students of all learning levels to create something they can be proud of.

These video based activities are self directed and self paced. Some students will be completely unfamiliar with the interface, concepts etc and will need some more guidance. Facilitate the learning and let students help each other. Encourage the fast paced learners to teach others before rushing on to more advanced lessons. Students teaching students are a great resource and add to class comraderie and move things along faster than if you were doing it all yourself.

Lesson 1: Drum App

Prior Knowledge: Sprites, App, Android

Estimated Time: 1-2 class periods

Video Tutorial Part 1 is Here. You should show the video to the class as a group and point out any issues and answer questions. Ideally students will have access to the video at their own station and can work from there at their own pace after the introduction and discussion.

In this two part tutorial, students will quickly learn how to create a sound making app and become familiar with the basic building blocks of the App Inventor interface and its components. They will learn to add and rename components, resize the interface and sprites, and some basic if-then logic.

Part 2 of the introductory tutorial is here. There are lots of variables that students will want to use once they get the hang of it, including different sounds and sprites. After adding the sprites and sounds on the canvas, programming takes place in snap together blocks much like those used in Scratch by MIT-a program that students may be very familiar with.

While this is not a game per se, it is good introduction to the interface, since all apps will begin in the same way. Next is a more complex app in which students create a Pong-style game.

Lesson 2: Initialize

This tutorial reinforces the building blocks from the previous lesson, and adds more complex logic and subroutines to the program, with intial movement and initializing a start button. It is divided up into five small parts that are easily managed in a classroom setting with variety of levels. Again as before, rather than having students jump way ahead, keep them in touch by having them help each other move along.Take it slow on this one as it forms the foundation for more complex functions. Lesson two is considerably more involved than lesson one, so allocate extra time  if needed.

Enrichment: rather than have students download paddles or other images, have them create their own in Paint or other drawing program that you have available.

Here the students will learn how to program a start button to initialize the position of the ball and write code for the first time. .

Prior Knowledge: Math

Positioning ball: If you have students who are not familiar with cartesian coordinates, x and y positions should be reviewed. They will  also need to know ‘heading’ in terms of compass direction to be able to get the ball to move where they want it to go.

Lesson 3: The Paddle

This lesson programs the paddle sprite to move according to an algorithm that students determine. Collision detection is introduced in this lesson, important for most games. Here the experience begins to feel more like a game, as the paddle must move in one axis only and respond directly to the touch of the operator. The fundamental blocks are provided in the tutorial but the user must complete the lesson on their own. Be sure to complete this activity yourself in order to have a solution on hand for those who get truly stuck.

Lesson 4: If Statements

What happens if the paddle misses the ball? Game over. Coding this argument is the focus of this lesson. This brings in another fundamental program statement, the ‘If else’ which gives two options based on an initial question. Used time and time again, once students get this they will use it forever in coding. As in part 3, the tutorial asks students to complete the blocks themselves, so leave time for them to experiment and get it to work right.

Lesson 5: Collisions

You might want to give the advanced students this assignment without the aid of the tutorial. Others will see that getting the paddle to interact with the ball is based upon what they have already learned.


Lesson 6: Score Keeping

This two part tutorial provides the students with the ability to convert the start button into a score keeper. Before embarking on this step, students must have a successful game running from the previous lessons. You may very well find that some of your student prefer to do things a bit differently than the tutorial, which is a good thing whether it works or not. They may create a new button rather than convert the existing start button to keep score, or tabulate the numbers differently.


Have your advanced students create a pop up button that provides a marker to the player. For example, a high score! button can be displayed once the highest number has been reached. That will mean at least one additional variable added to the mix. Another button/sprite might popup if the ball is missed by the paddle, such as Oops! Try Again? The possibilities are endless, and that is the whole point after all.



It used to be that programming was the realm of computer science majors only. Today, user friendly tools like MIT App Inventor make programming accessible to all students. Whether or not your STEM students plan to enter the field of computer science, the skills they will learn make use of crosscutting concepts across STEM fields. They will become willing problem solvers and have confidence to innovate thanks to their success. The idea of entrepeneurship should be capitalized on as well, as students can learn to create their own jobs even before graduating if the demand for their product is sufficient. Skills, money and fame are now within reach of any student who can innovate their way to the top.


2 Trackbacks

  1. […]  Teaching computer science is easier than ever thanks to some great open source coursework and easy to use programming applications that even come with complete tutorials. CS Week is a call to action to make real Computer Science […]

  2. […] 15. STEM lesson: MIT app contriver […]

Post a Comment

You must be logged in to post a comment.