course tech 2013, abigail bornstein,using adroid app inventor to introduce app development concepts
DESCRIPTION
Android App Inventor uses a WYSIWYG interface to enable userswith no programming knowledge to create applications using drag-and-drop blocks. These blocks specify the behavior of the application. You can add Android App Inventor as one lecture topic to an existing course or create an entirely newcoursewith anAndroid app development focus.TRANSCRIPT
Using Android App Inventor to Introduce App Development Concepts
Presented by Abigail BornsteinProfessor, Computer Networking & Information Technology
City College of San Francisco
Background – New Course, Sp’10
• “Technology of Smartphones & Mobile Devices”– Hardware, software, cellular networks, support
Operating Systems
BrowsersApplications
(development)
Objective
• Learn how to build a basic application using MIT App Inventor
• Provide MIT App Inventor resources that are freely available to educators
• Consider ways that MIT App Inventor can be added into your school’s curriculum
What is App Inventor?
• A drag and drop programming tool that enables you to create applications for Android devices– No programming knowledge necessary– Teaches programming concepts, if that is your
objective
3 Distinct Tools Used in App Inventor
Image from: http://appinventor.mit.edu/explore/content/what-app-inventor.html
System Requirements
• Computer and operating system– Macintosh (with Intel processor): Mac OS X 10.5 or higher– Windows: Windows XP, Windows Vista, Windows 7– GNU/Linux: Ubuntu 8 or higher, Debian 5 or higher
• Browser– Mozilla Firefox 3.6 or higher
• Note: If you are using Firefox with the NoScript extension, you'll need to turn the extension off.
– Apple Safari 5.0 or higher– Google Chrome 4.0 or higher– Microsoft Internet Explorer 7 or higher
Setup
• Go to: appinventor.mit.edu– Click Explorer (Information & Tutorials) button– Click Learn tab, Setup link or just Setup tab
Java check and/or installation
Installation by operating system
Invent: Gmail or Google account login
Project 1: Hello Purr
• Click Learn tab, Tutorials link– Hello Purr
• Follow emulator instructions OR phone instructions
– Download kitty image & meow sound file • Right click – Save Picture As or Save link to…
– Go to http://appinventor.mit.edu and login
New Project Name: HelloPurr
Select Components to Design Your App
Drag component from Palette
to Viewer Screen1
Adjust component appearance
through Properties
Project 1: Hello Purr, Design Complete
(Basic)
(Media)
Button1
Label1
Sound1
Project 1: Hello Purr, Blocks Editor
• From Designer, click Open the Blocks Editor button in the upper right corner– Lower left corner: warning about file type danger– When Blocks Editor open, will see a cup of Java
icon on your taskbar
Project 1: Hello Purr, Blocks Complete
Green block = event handler
Purple block = command block& snaps into the
event handler
Project 1: Hello Purr, Emulator
• Click New Emulator button in upper right side of Blocks Editor– May take 2 – 3 minutes or more to load
• Once loaded, go back to Blocks Editor– Click on Connect to Device…
Project 1: Emulator Results
Project 1: Hello Purr, Android Device
• Download MIT AICompanion from Play store– https://
play.google.com/store/apps/details?id=edu.mit.appinventor.aicompanion2
• Go back to Blocks Editor– Click on Connect to Device…Choose WiFi
Project 1: Phone Results
Temporarily on phone – gone
once you close App Inventor
Project 1: Package for Phone
• Go to Designer - upper right corner
• Show Barcode– Need QR reader, free app in Play store– Only works on the owner’s phone– May have to change Security setting on phone
• Allow installation of apps from sources other than the Play Store
• To share with others– Download to this Computer, use 3rd party software to
convert file into a bar code
Project 2: Magic 8-ball
• Go to: appinventor.mit.edu– Click Explorer (Information & Tutorials) button– Click on Learn tab, Tutorials, Magic 8 Ball
• Download image and sound files needed• Click Invent – login
New Project Name: Magic8Ball
Project 2: Magic8Ball Designer
Button1
Label1 & Label2
Sound1
Project 2: Magic8Ball Blocks Editor
Project 2: Magic8Ball
Emulator Phone
“Gently shake” Can use
accelerometer on actual device
Other Projects
• Basic Projects– PaintPot, MoleMash, Pong, PicCall
• Advanced Projects– Mini Golf, Pizza Party, Quiz Me, Map Tour
• Additional Projects– SMS, GPS, Video
Lots to learn…from beginner to advanced
Resources
• http://appinventor.mit.edu/teach/– Sample curriculum
• Course-in-a-Box (Professor David Wolber, USF)• Junior high, high school, college
– Complete .pdf textbook• “App Inventor: Create Your Own Android Apps”
– Forum devoted to educators– Videos
School Curriculum Options
• Multiple age groups and levels– Junior high, high school, college
• Full course devoted to App Inventor– Introductory CS course for non-CS majors– CS101 for CS majors
• 1 – 4 lectures/labs devoted to App Inventor– Add chapter on app development to an existing course– “Technology of Smartphones & Mobile Devices” course
My Contact Information
Abigail Bornstein Professor, Computer Networking & Information Technology
City College of San Francisco
E-mail: [email protected]
Website: http://fog.ccsf.edu/~abornste
THANK YOU!!!