1. Starting AppInventor in the Classroom
Dale
CAS Conference June 2011

2. Scope Starting with AppInventor Create a (very) simple app
Consider howthis could be developed in the classroom

3. Why Apps? Inspiring Computing, incorporating ICT
Challenge – to analyse needs, create and refine a solution
Creating something that works
Solving problems, Developing thinking
“Solving problems creatively by using ICT to explore ideas and try alternatives”
“Consider systematically the information needed to solve a problem”
“Solve problems…”
“Use ICT to make things happen by planning, testing and modifying…”
Ticks boxes in NC
Children are aware of apps in the marketplace, might like to see how they are cresated
Become creators rather than consumers

4. What to use? iPhone SDK Android SDK AppInventor Windows Phone SDK
See iOS Dev Center
Android SDK
Eg Eclipse
AppInventor
Windows Phone SDK

5. Making it real Authentic context
Technical knowledge (of the dev environment)
Technical know-how (to make the dev environment do the right things)
Creative flair
Use stimulus cards?
4 things need to come together

6. Feasibility Analyse It Design It Develop and Test It Implement It
Systems Life Cycle
Design It
Develop and Test It
Check out the Ideas Cards for starting points
Implement It
Evaluate It

7. Feasibility/Analysis
Do we need another app for burps? Is there still a market for a voice-changing tomcat animation? (Apparently so…)

8. Design It Design Appearance Navigation Interface Inputs Outputs
Screen layout
Credits
Corporate identity
Splash Screens
Navigation
Buttons
Image map
Interface
Inputs
Sound
Touch
Movement
Position
Outputs
Sound
Vibration
Storage
Assets
Sounds
Images
Text
Movies

9. Data flow and navigation
Splash Screen
Instructions
Page 1
Page 2
About
Credits
Don’t really create new screens. AppInventor won’t do multiple screens – it will allow one app to open another, or you can show/hide arrangements

10. Design Tools Storyboards
Screen mock-ups (some good iPhone templates at modoku.com)

11. Make It!
Our brief (though curiously unreliable) market research suggests that there is an opening for an app that changes the colour of text and its background at the press of a button. Please develop an app that will do this.

12. Using AppInventor Get a Google Account
Works on Google Apps for Education too
Start AppInventor at and log in.
3 parts to AppInventor:
Designer – where assets are compiled
Blocks editor, where you tell things what to do
Emulator, a virtual mobile device
(or connect a real one)

13. Using Appinventor Start the designer and create a new project.
Assemble assets according to your design plan
Drag and drop AppInventor components
Give them appropriate names (eg btnBlkOnRed)
Upload other assets (images, sounds) and name them
Tell assets what to do in the Blocks Editor
See what it looks like in the Emulator (or on the device)
Design editor isn’t quite WYSIWYG – it will be on the phone.

14. Using AppInventor – Drumkit
Assemble assets in the designer
Upload pictures, sounds
Insert buttons in a table arrangement
Tell assets what to do in the Blocks Editor
When button is clicked, play the sound
Test in the Emulator
Add other buttons
Use a vertical arrangement to add a splash screen

15. Using AppInventor – DrawKitteh
Introduces use of the Canvas element to enable on-screen drawing.
See tutorial at

16. Using AppInventor - sharing
Download and publish elsewhere
Use the barcode
Download to phone
Downloading to phone needs phone to be on same Google Account

17. Some Tutorial Sources (there are others)