This document provides an overview of the toolset that will be used for the Apps for Good program in the 2012/13 academic year. It summarizes App Inventor, a visual programming tool for building Android apps, Balsamiq Mockups for prototyping apps, and the alternative of PhoneGap. It explains why App Inventor and Balsamiq will be used, how to install them, and get involved in their online communities. Educators are assigned the task of completing an App Inventor tutorial by May 31st to prepare for upcoming training sessions on using these tools.

1. Contents
Scope .......................................................................................................................................... 1
What is App Inventor? .................................................................................................................. 2
Why we use it ........................................................................................................................... 2
How to get App Inventor set up .................................................................................................. 2
How to get involved with the AI community................................................................................. 3
Balsamiq Mockups........................................................................................................................ 3
What is Balsamiq Mockups? ....................................................................................................... 3
Why we like it ........................................................................................................................... 3
How to get set up ..................................................................................................................... 3
Alternatives--PhoneGap (not currently supported) ........................................................................... 4
What is PhoneGap? ................................................................................................................... 4
Why we say it’s not for most in the AfG community, ..................................................................... 4
How it could be used in the context of Apps for Good ................................................................... 4
Educator Task - to be completed by 31/05/12 ............................................................................ 4
Scope
Notes from the ‘AfG Educator Pre-training 2012/13 Briefing1’
This is an introduction to what the Apps for Good toolset looks like for the next academic year and our
rationale for using them. How we use the tools will be the subject of a live training session.
To get the most out of the live training sessions in a few weeks, it’s important that you become familiar
with these tools and complete the necessary installations before May 31st . If you show up at the
training without doing them, you may find it challenging to keep up.
App Inventor Book
App Inventor: Create your own Android Apps, Wolber Abelson, Hard copy from Amazon
http://www.amazon.com/App-Inventor-Create-Your-Android/dp/1449397484
Ebook format:
http://shop.oreilly.com/product/0636920016632.do
1 Educator Briefing - AFG Toolset Summary ‘12/13

2. What is App Inventor?
“App Inventor is a visual, drag-and-drop tool for building mobile apps on the Android platform.
You design the user interface (the visual appearance) of an app using a web-based graphical
user interface (GUI) builder, then you specify the app’s behavior by
piecing together “blocks” as if you were working on a puzzle” - Wolber & Abelson
Why we use it
● First thing to say is that AFG is not primarily an app implementation course, but rather is more
about problem-solving and developing entrepreneurial skills. That said, envisioning a tech
product is the goal for a vast majority of students, and App Inventor can complement the
pursuit of that goal.
○ Play - App Inventor promotes exploration and discovery; helps young people explore
the functions of a smartphone kinaesthetically (Internal Sensors, touchscreen etc);
allows students to get immediate feedback as they work.
○ Prototyping - easier than line coding to get some aspect of an idea functioning OR fully
complete ideas working.
○ Personalisation and customisation - allows students to personalise interaction and take
great ownership.
○ Great teaching and learning tool:
■ Stimuli for ideas and problems students care about.
■ Introduction to basic app mechanics - event handling.
■ Additionally it’s a great way of learning programming constructs.
How to get App Inventor set up
○ To setup you need
■ A web browser (we strongly recommend Chrome; don’t use IE).
■ Java on your machine.
■ Downloaded installer file for app inventor.
○ For full details of installation go to
http://beta.appinventor.mit.edu/learn/setup/index.html
2 Educator Briefing - AFG Toolset Summary ‘12/13

3. How to get involved with the AI community
○ We recommend you use a secondary email address (not your main one) and/or set up
filters for emails from the community so your inbox isn’t flooded
○ 5 Forum boards on there, we recommend you sign-up for:
■ App Inventor Announcements - stay tuned to service announcements.
■ Getting Setup and Connecting your phone to App Inventor - for troubleshooting
common issues.
■ Programming with App Inventor.
If you need troubleshooting advice: http://www.tair.info/faqs-and-how-tos/troubleshooting/
Balsamiq Mockups
What is Balsamiq Mockups?
“A rapid prototyping online tool that reproduces the experience of sketching; improves focus,
communication and speed between stakeholders” - Balsamiq website
Why we like it
○ Students find it very intuitive, lots of ready-made widgets.
○ Balsamiq have kindly given CDI Europe free access for partners.
○ To get students and their stakeholders to think about how the solution will be navigated
and experienced by the user
How to get set up
○ Request access and receive an invitation
○ https://appsforgood.onconfluence.com/display/redesign/Balsamiq
3 Educator Briefing - AFG Toolset Summary ‘12/13

4. Alternatives--PhoneGap (not currently supported)
What is PhoneGap?
“PhoneGap is an HTML5 app platform that allows you to author native applications with web
technologies and get access to APIs and app stores. PhoneGap leverages web technologies developers
already know best... HTML and JavaScript. Write once deploy to many platforms “ - PhoneGap website
Not currently supported by AfG--meaning we won’t provide training and learning support for this
platform; but if you AND your students have experience with web technology and you want a more
advanced/challenging tool, you are welcome to try PhoneGap.
Why we say it’s not for most in the AfG community,
○ Many barriers for those new to HTML, JavaScript and CSS
○ HTML + CSS + JS required to create codebase
○ Eclispe IDE and managing Android SDK required
○ Lots of moving parts here, probably not a good fit for most
○ Can be useful powerful for v.gifted/v.advanced students who are already familiar with
HTML, JavaScript and CSS
○ Very slow emulator
How it could be used in the context of Apps for Good
○ An app inventor substitute
■ Has the advantage of leveraging HTML, CSS and JS knowledge
■ Access to powerful APIs.
■ Ability to port to various platforms (Android, iOS, Blackberry etc.).
Educator Task - to be completed by 31/05/12
Complete installation of App Inventor and the tutorial below by 31st May 2012
Your First App Video tutorial
http://youtu.be/bsuJFPYXBO8
Assets for tutorial
https://appsforgood.onconfluence.com/pages/viewpageattachments.action?pageId=852258&metadata
Link=true
4 Educator Briefing - AFG Toolset Summary ‘12/13