Things to download: This PowerPoint techandbehavior.com/flashcard/FlashcardWorkshop.pptx The app source code techandbehavior.com/flashcard/App.zip The app (optional) For iOS For Android: As a webpage: techandbehavior.com/flashcard/

Agenda Why? Tools of the Trade Example App Flashcard App Hosting/App Stores

A very important question: Why?

Good Reasons: Interactivity Reminders Proximity Navigation of Information Communication

Bad Reasons: To replace us To duplicate other materials

Tools of the Trade

Smartphone Market Share

The Mathew Effect in Market Share Android and iOS Dominate Less incentive for developers to make apps for other markets Fewer Apps in other markets Less reason to buy other phones Android and iOS Dominate

Operating Systems are like Languages IOSAndroid

IOS Objective C (Free) X-Code (Free) *need a mac with OS 10 or higher iOS Developer Program ($99/Year) Must use Developer Certificate in Testing Submission to App Store Apple gets a cut of all sales and subscriptions

Android Java (Free) Eclipse (Free) Can test apps without account Submit to Google Play (One time $25 fee, instantaneous publishing) Google Play gets a cut of all sales and subscriptions

Websites are Like Interpreters

HTML5 Free (but requires hosting) No software needed, but it helps Able to update within seconds No curated market (both good and bad) Able to work offline (if bookmarked) No fees attached Able to access many features on newer devices Sandboxed No Fees attached Public doesn’t understand it

How to learn Wonderful (and free) tutorials Lynda University Subscription W3schools.com Brief but good tutorials (also free) Playing around!

jQuery Mobile jQuery A (free) javascript library that makes things easier jQuery Mobile A (free) jquery library that makes pretty mobile webpages with very little effort

Native Wrappers Phonegap Titanium appMobi Create native apps using HTML5 Provide API’s (Hooks to get out of the sandbox) Work across platforms (mostly) Can be submitted to app stores

Limitations of Native Wrappers Integration with SDK’s (like Google Analytics) Efficiency Memory Leaks/Garbage Collection Problems Difficult to orchestrate large projects Poor Documentation

Example App

Kitten Therapy

Get jQuery Mobile Go to Download.zip of Latest Version

Get jQuery Mobile

Customize Code

Flashcard App Go to Open Index.html with a html editor or text program (not Word)

Clear out the vocab Find var wordbank = new Array (""); ----keep it Delete everything that starts with wordbank[X] = new Array()

Make your own vocabulary Open wordbank.xlsx Locate the Wordbank Tab Replace the Vocabulary Section is the group of cards (for the menu) Word Response Page

Create the Code Remember what row you stopped on Navigate to the Interum tab Copy last existing cell if your word list is longer Delete extra cells if it is shorter Navigate to Code Tab Copy last existing cell if your word list is longer Delete extra cells if it is shorter

Insert the code Copy the code from the code tab of the excel spread-sheet Paste it after var wordbank = new Array ("");

Customize the App Custom Themes (free) Find and replace text Create new pages or features

Hosting/App Store

Phonegap Build Go to build.phonegap.com Login or register Zip your folder Upload it to their site Customize the app: Edit the config.xml file Replace the Images Sizes

App store submission Get the certificates Android iOS Submit to the stores Android play.google.com/apps/publish/ iOS

Carmen Zip folder In Carmen, click content  manage files  Upload zipped file Unzip the file On a page in content, click “insert quicklink”  Select “course file” Navigate to index.html Select “whole window”

Contact Ryan Hansen