TCS3254

PROGRAMMING FOR
MOBILE DEVICES
MOBILE TECHNOLOGY AND DEVELOPMENT PROCESS

1
LEARNING OUTCOMES

After completing this lesson, students will be able to:

 Describe the different type of mobile application

 List the variety of programming languages for mobile

application development

 Explain the activities involved in mobile application

development process.

2
INTRODUCTION

• Mobile development technology refers to the

various tools, frameworks, components, libraries,
and other technologies used to create mobile apps.

3
INTRODUCTION

• When developing applications for mobile devices,

consideration must be made to the limitations of
each device.

• These limitations range from how a user interacts

with the device, its computing power, the screen size,
the unique features and capabilities of a specific
device, and the platform.
4
DIFFERENT TYPES OF MOBILE
APPLICATION

 Native mobile apps

 Cross-platform apps
 Hybrid apps
 Web apps

5
NATIVE MOBILE APPS

• Native mobile apps are written in a language that’s

natively supported by the device OS vendor
– iOS / Android

• They use the development tools and

language that the respective platform
supports (Android – Java/Kotlin,
iOS – Swift/Objective-C). 6
NATIVE MOBILE APPS

• Native apps acquire all possible advantages of the

device and the operating system’s features.

• The apps leverage direct access to the hardware of

the devices such as GPS, camera, microphone,
contacts, offline access, sensors, and many more.

• Native apps boast of fast performance and a high

degree of reliability for great user experience.
7
NATIVE MOBILE APPS

• However, native apps are expensive to develop as

they are designed for only one type of OS.

• To run the app on multiple platforms, it requires

developing and maintain an app for each platform
separately.

• But native apps are a future-proof investment. They

are secured, user-friendly, and faster than other
8

apps.
NATIVE MOBILE APPS

• Advantages:
• Natives are very fast.
• Easily distributed in Google and Apple app stores.
• More interactive and intuitive.
• Easily interact with any feature of the phone.
• Lesser compatibility issues and faster to
configure.
9
NATIVE MOBILE APPS

• Disadvantages:
• Built for a single platform – time consuming
• Hard to learn the language to build the apps –
Swift or Java
• Requires separate codebase to add new features.
• Expensive to develop and hard to maintain.

10
NATIVE MOBILE APPS

• Example of apps:
• GPS, Pinterest, WhatsApp, Facebook, Gmail,
Twitter, almost all games, and any pre-set apps

11
NATIVE MOBILE APPS

• Tools to develop:
• iOS – XCode, App Code, Atom
• Android - Android Studio, Android IDE, IntelliJ
IDEA

12
NATIVE MOBILE APPS
Programming languages for Android native apps:
Java
• One of the most popular and preferred
languages among Android app developers.

Kotlin
• Kotlin is a new object-oriented first-class
programming language like Java.
• It is comparatively clean and has multiple
advanced features - supports almost all the 13

IDEs including Android Studio and SDK toolkit.

NATIVE MOBILE APPS

Programming languages for iOS native apps:

Swift
• Swift is the latest and primary language used in the
development of iOS and OS X, thus
replacing Objective-C to an extent.

Objective-C
• A derivative of the programming language C
• It is the core programming language to
develop iOS and OS X before Swift, but 14

has still maintained its popularity among developers.

CROSS-PLATFORM APPS
DEVELOPMENT
• Cross-platform mobile application development is the
process of developing an application with a single
code base to run on multiple mobile platforms.

• Like native apps, they live in an application store and

can take advantage of many device features.

15
CROSS-PLATFORM APPS
DEVELOPMENT
• It is the best approach for low-cost custom apps with
secure, stable, and easy to maintain and iterate
features.

• Many cross-platform app development frameworks

help to achieve the native app-like feel and user
experience.

• If the company has a limited budget, but it requires a

satisfactory app performance, so cross-platform is an
16

ideal approach.
CROSS-PLATFORM APPS
DEVELOPMENT
• There is a wide range of cross-platform mobile app
development technologies available that makes it easy
for developers to conceptualize, develop, and launch a
beautiful and functional application on multiple
platforms simultaneously.

• Some of the most popular cross-platform mobile

technologies include Flutter, React Native,
and Xamarin, Ionic. 17
CROSS-PLATFORM APPS
DEVELOPMENT

• Advantages:
• Easy to build
• Much cheaper than a native app
• Single app for all platforms
• Able to access device features/utilities via API
• Faster to develop than native apps – quicker
development time
18
19
CROSS-PLATFORM APPS
DEVELOPMENT

• Disadvantages:
• Poor performance - slower than native apps
• Limited access to features
• Issue in frequent updates
• Less interactive than native apps
• Rendering time takes longer

20
CROSS-PLATFORM APPS
DEVELOPMENT
• Example of apps:
• Firefox, Chrome, OpenOffice, Adobe Reader, etc.

21
CROSS-PLATFORM APPS
DEVELOPMENT
React Native
• React Native is an open-source mobile app
development platform created by Facebook.
• The process of layout creation works the same way
for mobile screens and web page layout.
• Interaction of components with each other is flexible
and easy.

22
CROSS-PLATFORM APPS
DEVELOPMENT
Xamarin
• Xamarin is Microsoft's mobile app development
platform to create Windows, iOS, and Android apps
using a single .NET code.
• Xamarin uses a single language, C#, which enables
developers to give their apps a native look and feel.
• Almost all elements of this simple tool are 100%
compatible with any platform.
23
CROSS-PLATFORM APPS
DEVELOPMENT
Flutter
• This open-source framework was created by Google.
• Flutter capable to deliver high performance across
iOS, Android, Windows, macOS, and the Web using a
single codebase.
• It has a Hot Reloading feature and a large set of
ready-made widgets.
• Compatible with different IDE’s including Android
Studio (IntelliJ) and VS Code
24
FLUTTER VS REACT NATIVE VS IONIC

25
HYBRID APPS DEVELOPMENT

• Hybrid apps development is a blend solution that

consists of both native and web solutions.

• Developers embed the code written with web

development languages (HTML, CSS, and JavaScript)
into a native app using plugins like Apache Cordova or
Ionic’s Capacitor.

• The plugin system allows developers to access the 26

native features of platforms.

HYBRID APPS DEVELOPMENT

• Hybrid app development is quite a time savior and

cost-effective than native apps.

• The code is written once and use it for multiple

platforms.

• Adopting a hybrid app development approach can be

a pilot solution for emerging startup businesses. If UX
and performance is not a priority for the app, it 27

would be the best solution than a native application.

HYBRID APPS DEVELOPMENT

Advantages of hybrid apps:

• Easy to build, update, test, and tune up
• Low cost for development and maintenance
• Shareable code makes it cheaper than a native app
• Easy to push new features since it uses a single code
base.
• Can work offline.
• Shorter time to market, as the app can be deployed
for multiple OSs.
28
HYBRID APPS DEVELOPMENT

Disadvantages of Hybrid apps:

• Complex apps with many functions will slow down
the app.
• More expensive than web apps
• Less interactive than native apps
• Lack in performance, speed and overall optimization
• Apps cannot perform OS specific tasks
• Design issue due to app inability to look similar on
multi- platform
29
HYBRID APPS DEVELOPMENT

• Example of apps:

30
WEB APPS DEVELOPMENT
• Web apps are a lightweight paradigm where you open
a URL in your device’s browser, but they look and feel
like a regular mobile app. These apps do not require to
install on mobile devices and were run on web-hosted
servers.

• Mobile web apps typically use HTML, CSS, Javascript,

JQuery web technologies.

• They cannot access all features of native device 31

functionality (camera, calendar, geolocation, etc.).

WEB APPS DEVELOPMENT

• Adaptive web apps scale to fit the different screen

sizes of mobile devices.

• Web apps are built using the most popular

programming languages, but they can’t use
hardware on mobile devices or be sold in any app
stores.

32
WEB APPS DEVELOPMENT

• Developers can use two website programming

paradigms to create mobile web apps:

• Responsive web programming is a style of web site

programming where the web site layout organizes
itself to suit the device’s form factor.
• Instead of having to browse horizontally, the
content snaps in place to fit the width of the
device. These web sites can also be used from a
desktop
33
WEB APPS DEVELOPMENT

• Progressive web programming (PWA) are normal

websites that appear like a traditional mobile app
when navigated to from a browser on a mobile
device.

• They deliver an almost app-like experience. It has

an ability to add a link to the Home screen (so that
you get an app icon), and they are also able to run
offline when not connected to the internet by
caching the content locally on the device. 34
WEB APPS DEVELOPMENT

• Advantages:
• Reduced business cost.
• No installation needed.
• Better reach as it can be accessed from anywhere.
• Always up-to-date.

35
WEB APPS DEVELOPMENT

• Disadvantages:
• Dependent on internet speed.
• Interface not that sophisticated.
• Complex features can’t be used
• Take a longer time to develop.
• Security risk.

36
WEB APPS DEVELOPMENT

• Example of apps:

37
CHOOSING THE BEST PROGRAMMING
LANGUAGE FOR MOBILE APP
DEVELOPMENT

• When considering the programming languages,

frameworks, and SDKs for mobile apps, need to
consider the frontend (UI) development
environment but also be aware of the backend
(server-side) development environment.

38
CONSIDERATIONS WHEN DEVELOPING
AN APPS
• When it comes to developing mobile applications,
we must consider the unique features and
capabilities of the platform.

• Also, developer must cater to the different technical

specifications of the devices e.g., different screen
sizes, different touch-screen gestures, varying levels
of performance power, and different requirements
that apply to the Google Play and iOS App Store. 39
MOBILE APPLICATION DEVELOPMENT
PROCESS

An effective app development process flow spans over

the following common phases:
1) Strategy
2) Analysis and Planning
3) UI / UX Design
4) App Development
5) Testing
6) Deployment & Support 40
MOBILE APPLICATION DEVELOPMENT PROCESS

41
1. STRATEGY
• The first phase of the mobile app development
process is defining the strategy for evolving idea into
a successful app.

• In this phase, you will:

• Identify the app users
• Research the competition
• Establish the app’s goals and objectives
• Select a mobile platform for your app 42
2. ANALYSIS AND PLANNING

• Analysis and planning begin with defining use cases

and capturing detailed functional requirements.

• This includes prioritizing the mobile app requirements

and grouping them into delivery milestones. Also
includes:
• identifying the skills needed for the development
• identifying the name of the app - names are like
domain names and must be unique.
43
3. UI / UX DESIGN

• The purpose of an app’s design is to deliver seamless and

effortless user experiences with a polished look.

• The success of a mobile app is determined based on how

well users are adopting and benefiting from all its
features.

• The goal for mobile app is creating excellent user

experiences (e.g., interactive, user-friendly, and intuitive
user experiences to keep the user's engagement). 44
3. UI / UX DESIGN

• To design a mobile or web application is not purely a

technical work, it requires lot of imagination,
conceptualization, and creativity to put together with
technology.

• There are lots of iteration processes required to make

an application functionally accurate and visually
appealing.
45
3. UI / UX DESIGN

The methods and deliverables are:

 Information Architecture & Workflows
• The first step of the app design process is to determine
the workflows – (how) data will display to the users,
the data it will collect, user interactions with the
finished product, and the user journeys within the app.

• Workflow diagrams – help identify every possible

interaction a user has with the app and the app’s 46

navigation structure.
3. UI / UX DESIGN

Wireframes

• Mobile app designers often start app design with

sketches on paper. Wireframes are the digital form of
sketches.

• Wireframes are conceptual layouts, also referred to as

low-fidelity mockups to give visual structure of the
app’s functional requirements. 47
3. UI / UX DESIGN

48
3. UI / UX DESIGN

49
3. UI / UX DESIGN

• Creating wireframes is a quick and cost-effective approach

for designing app layouts and iterating through them in the
design review process.

50
3. UI / UX DESIGN

Style Guide - living documents where an app’s design

standards from the company’s branding rules down to
the navigation icons that contribute to an app’s design
strategy.

• Style guides include:

• What font family will the app’s text use?
• What will the color scheme be?
• How will the company brand be reflected in the51

app design?
3. UI / UX DESIGN

• Establishing a style guide early on as part of the

mobile app development process expand the
productivity of the mobile apps.

• By following a style guide will help keep the app’s

look and feel consistent.

• Also need to consider app design guidelines from

Apple or Google for Android/iOS apps. 52
3. UI / UX DESIGN
Mockups

• Mockups, or high-fidelity designs, are the final renderings of

your app’s visual design.

• Mockups are produced by applying the style guide to the app

wireframes.

• As the app’s design begins to finalize, expect further

modifications to its information architecture, workflow, and
53

aesthetics.
3. UI / UX DESIGN

54
3. UI / UX DESIGN

Prototype

• Prototypes are highly useful for simulating the user

experience and the app’s workflows expected from the
completed product.

• The prototypes help identify modifications to the app’s

proposed functionality. Some companies prefer even doing
prototypes at a wire-framing stage, particularly when an
app’s functional requirements are not well thought out.
55
3. UI / UX DESIGN

56
4. APP DEVELOPMENT

• Planning remains an integral part of this phase.

• A typical mobile app project is made up of three integral

parts:
• back-end/server technology - technology stack that is
best suited for the apps (i.e. database and server-side
objects, programming languages, & framework)
• API(s) - method of communication between the app
and a back-end server/database
• front-end - the native mobile app an end-user will use
57
5. TESTING

• Performing quality assurance (QA) testing during the

mobile app development process makes applications
stable, usable, and secure.

• To ensure comprehensive QA testing of the app, first

need to prepare test cases that address all aspects of
app testing.

• Similar on how use cases drive the process of mobile

58

app development, test cases drive mobile app testing.

5. TESTING

• The app should undergo the following testing

methods:
• User experience testing
• Functional testing
• Performance testing
• Security testing
• Device & Platform testing
59
5. TESTING

User Experience Testing

• Objective: to ensure that the final implementation

matches the user experience created by the app
design team.

• It is important the app employs consistent fonts, style

treatments, color scheme, padding between data,
icon design, and navigation, and matches the original
60

design guidelines!
5. TESTING

Functional Testing

• The functionality of the app should be tested by as many

users to cover as many potential testing conditions.

• Objective: to ensure that users can use the app’s

features and functionality without any issues.

• The testing is further into system testing (as a whole),

and unit testing (individual functions).
61
5. TESTING

Performance Testing

• Quantitative criteria to use for measuring the performance

such as:
• How well the app responding to the user requests?
• How fast are the app’s screens loading?
• Is the app draining the phone battery or causing memory
leaks?
• Does the app leverage network bandwidth efficiently?
• Is the size of the app bigger than what it should be? 62

• How the app handle the when usage spikes.

5. TESTING

Security Testing

• Security is of utmost concern for enterprise mobile

apps. Any potential vulnerability can lead to a hack.
• Many companies hire outside agencies to perform
thorough security testing on their app.
• QA & development teams can take a few simple
measures to make the app secured e.g., data entry
forms should be tested to ensure there is no data 63

leakage.
5. TESTING

Device and Platform Testing

• Mobile operating systems are updated every few

months. Also, the devices come in different sizes and
shapes.

• Thus, the app must be tested on multiple mobile devices

or device simulators to ensure smooth working of the
app for all users.
64
5. TESTING

• The complexity of mobile app testing on all mobile

devices, ongoing support costs, and headaches of
mobile device management are primary reasons why
companies tend to build their enterprise mobile apps
for a single mobile platform.

• Testing is imperative to an app’s future success.

• Having a comprehensive mobile testing strategy is a

must for delivering a quality mobile app.
65
6. DEPLOYMENT & SUPPORT

• Releasing a native mobile app requires submitting

the app to Apple App Store and Google Play Store.

• For that, a developer account with Apple App

Store and Google Play Store is required.

• The iOS apps need to go through a review process

which may take from a few days to several weeks
depending on the quality of the app & guidelines.
66
6. DEPLOYMENT & SUPPORT

• For Android apps, there isn’t any review process - the app
will become available within a few hours of submission.

• After the app is become available, monitor its usage through

mobile analytics platforms and track Key Performance
Indicators (KPIs) for measuring the app’s success.

• Also need to frequently check for crash reports, or other

user reported issues.
67
6. DEPLOYMENT & SUPPORT

• For support, let users to provide feedback and suggestions on

app to keeping users engaged.

• Unlike web apps where patch releases can be available to app

users instantly, mobile app updates will have to go through
the same submission and review process as the initial
submission.

• The native mobile apps must continually stay on top of

technology advancements and routinely update the app for
68
new mobile devices and OS platforms.