How to create smartphone applications Introduction to Tools

How to create smartphone applications: Introduction to Tools and Platforms Presenters Muhammad Murtaza Khan Hezam Albaqami mkhan@uj. edu. sa hezam. albaqami@gmail. com

Outline • • • Why make smartphone applications? Which apps are popular? Types of smartphone applications Application development for Android phones Web application development Conclusion

Outline • Why make smartphone applications?

Why make smartphone applications Reason 1 • It is one of the largest markets in the world ! • Can you guess the number of smartphone users in the world ? ~ 2 Billion !

Why make smartphone applications Reason 2 • It is a growing market • 200 million new smartphones added every year Reference: Statista (www. statista. com)

Why make smartphone applications • Number of apps on Google Play Store – ~ 2. 3 Million 2 Million new apps in 4 years Reference: Statista (www. statista. com)

Why make smartphone applications • Number of apps on Apple App Store – ~2 Million 1. 3 Million new apps in 4 years Reference: Statista (www. statista. com)

Why make smartphone applications • How much revenue does apple App Store generate? – US $10 Billion in 2013 compared to US $20 Billion in 2015 Reference: Statista (www. statista. com)

Why make smartphone applications • Number of smartphone users • Number of smartphone applications • Amount of smartphone applications based revenue It is a growing market

Why make smartphone applications Reason 3 • Ease of distribution – Upload it on App Store ! Reason 4 • Time to market – Develop a version with basic functionality – Keep on adding new functionality later

Why make smartphone applications Reason 5: Part of our lives • How much time spent by US smartphone owners in a month? • How many apps used by US smartphone owners in a month? Reference: How to build a billion dollar app by George Berkowski

Outline • Which app should I make?

Outline • Which app should I make? • Think of an idea • Check ideas acceptability and novelty • Apply the Toothbrush Test !

Which apps are more popular Reference: Statista (www. statista. com)

Which type of apps are more popular An average user uses mobile phone 150 times a day Reference: How to build a billion dollar app by George Berkowski

How much time is spent on apps Reference: Statista (www. statista. com)

What to consider when making an app • Humans have 67 Universals (features of culture, society, language, behavior and psyche without exception) Reference: David Brown, Professor Anthropology, UC Santa Barbara

What to consider when making an app • “It’s difficult to design a compelling app that’s simple and easy to use by a wide variety of people. ” • “Best mobile apps are intuitive, easy and compelling. ” Quotes by Bill Tanaka (Director for Weather Bug app)

What to consider when making an app • “To create your app, spend time creating workflow, then graphics, then user interface. ” • “Go through iterations to make it simpler. ” • “Even designing icons takes a lot of effort, but it’s time well spent. ” Quotes by Bill Tanaka (Director for Weather Bug app)

General Steps in building an app Great Idea Validate Idea via Customer Convert it into an App Keep Testing + Iterating Get to Product / Market Fit Acquire Users Convert to Customers invite Customers Reference: How to build a billion dollar app by George Berkowski

What to consider when making an app • Okay you have an idea of an app • Next how to start with app development • You should select a platform. • What is a mobile app development platform (MADP)? • Operating Systems (OS) for which you can make apps* – – Googles Android Apples i. OS Black. Berrys Black. Berry OS Microsofts Windows *Sometimes MADP is considered only for development environment while user environment is referred to as mobile app consumer platform (MACP)

Outline • Types of Smartphone applications

What type of mobile app are you making? • Native Apps – Written in a specific programming language for platform – Objective C or Swift for Apple devices – Java for Android devices • Web Apps – Written in web code and works on mobile phone • Hybrid Apps – It is a web app translated to native app using a wrapper – Easier to build app for different platforms quickly – Write code in web dev. Language (Html 5, CSS, Javascript) – Development tools like Phone. Gap, Rubymotion

What type of mobile app are you making? • Native Apps – Small and focused and most responsive user experience – Generally do one thing really well – Make use of native features (camera, compass, swipe, push-notifications, alerts) – Store data locally – Have to make separate versions for each platform – Cost more (25 to 50 k dollars) – Language specific (C#, Objective C or Swift, Java or Python)

What type of mobile app are you making? • Web Apps – Basically mobile optimized web site – No app installation required but behave like an app – Requires login and Stores data online – It is simple and quick and same website can be used on any platform without any change (flexibility and cost) – Developed using HTML 5, Java. Script, CSS – Restricted features

What type of mobile app are you making? • Web Apps http: //www. topdesignmag. com/30 -examples-of-mobile-optimized-websites/

What type of mobile app are you making? • Native vs Web Apps http: //sixrevisions. com/mobile/native-app-vs-mobile-web-app-comparison/

What type of mobile app are you making? • Hybrid Apps – Built using cross-compatible web technologies HTML 5, CSS and Java. Script and some native code to allow native functions – Faster to develop and less expensive – Developed by Phone. Gap, Cordova, Appceleratore, Titatnium – Built on a single base and new functionality added simultaneously to all versions

What type of mobile app are you making? • Hybrid Apps (Another View) – Apps that are native apps but have web based elements along with native functionality – Most of the apps nowadays can be placed in this category – Linked. In, Netflix, Facebook, Evernote, Greplin, Mafia. Wars

What type of mobile app are you making? Native App Hybrid App Web App Least portable Portable Most Portable Cost most i. e. separate app for each platform Medium Cost least Best Performance Medium Performance Least Performance Most Features Medium Features Least Features (camera etc) Can be distributed through app store Can’t be distributed through app store

Outline Application development for Android phones

How to develop Android Mobile App? • Mobile Native Apps – Step 1: Download Android Studio – Step 2: Set Up Android Studio – Step 3: Start a New Project – Step 4: Make an App – Step 5: Test it using Simulation http: //www. androidauthority. com/android-app-development-complete-beginners-658469/

Example : First Audio. Image. App in Android Marty Stepp , http: //web. stanford. edu/class/cs 193 a/videos. shtml

Example : First Audio. Image. App in Android Marty Stepp , http: //web. stanford. edu/class/cs 193 a/videos. shtml

Example : First Audio. Image. App in Android Marty Stepp , http: //web. stanford. edu/class/cs 193 a/videos. shtml

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android

Example : First Audio. Image. App in Android int counter=0; public void presto_chango(View view) { Image. View img = (Image. View) find. View. By. Id(R. id. image. View); if(counter==0){ img. set. Image. Resource(R. drawable. logo_en); counter=1; } else{ img. set. Image. Resource(R. drawable. e_icon); counter=0; } Media. Player mp = Media. Player. create(this, R. raw. applause 2); mp. start(); }