IS2023

MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 1)
Course Introduction &
Understanding an App’s Architecture

1
Agenda
• Course Introduction
• What is and Why learn mobile app?
• Mobile app development platforms
• Ai2: Understanding an App’s Architecture
• Tutorial 1

2
 PART I
Course Introduction

3
Instructors and Session
• Class Schedule:
• S02 Wednesday 15:00-17:50
• S01 Thursday 09:00 – 11:50
▪ Instructor
▪ Mr. Albert Chung
▪ Office: LAU-5-236
▪ E-mail: ykchung@cityu.edu.hk
▪ WhatsApp: 34428523
▪ Office Hour: by appointment

4
Notes
• Equivalent Courses: CB2023 Mobile Applications for Business
• Exclusive Courses: GE2257 Mobile Applications for Business
• IS2023 is now a college elective for non-2021 cohort students

5
IS2023: Mobile Applications for Business
Course Aims
This course aims to:
• provide students with a good understanding of the mobile
business eco-systems and mobile platforms for business
solutions;
• equipstudents with knowledge and skills to design business
models for mobile applications in various business sectors like
finance, accounting, business management, and services;
• enablestudents to develop skills in mobile applications for
business innovations with features like location-based services
and profile-based recommendation services.
6
Course Intended Learning Outcomes (CILOs)
• Upon successful completion of this course, students should be able
to:
• Explain the mobile business eco-systems and mobile platforms
for business improvements and solutions
• Design business models and strategies for mobile applications in
various business sectors like finance, accounting, business
management, and services.
• Develop mobile applications for business innovations with
features like location-based services, and profile-based
recommendation services.

7
Teaching and Learning Activities (TLAs)
Seminar (with a mixed mode of lecture and computer lab/tutorial)
• Lecture (~1Hour): The lectures explain the concepts, knowledge, and skills
of mobile applications for business innovations.
• Computer Lab Tutorial (~1.5Hour): Hands-on activities to design, prototype,
and evaluate mobile applications for business innovations.
• Case Studies: Discussion of various concepts learned in lectures and
exemplified with exercises to demonstrate the applicability of various
principles, methods, and techniques in a mobile environment for business
innovations.
• Individual Presentations: Each student will present a part during the group
project's final presentation. Classmates will provide comments and
suggestions for improvement. 8
Assessment Tasks/Activities:
Tutorials and Lecture Participation 10%
• Tutorial submissions (GP Q&A) 10%
• Due 1 week after class

Group Project 50%

• Project Proposal 10%
• Mobile App Porotype 20%
• User Guide 10%
• Presentation, Q&A 10%

Examination 40%

9
Group Project
• Students need to complete a group project to design and develop a mobile app that
aims to propose a business innovation for solving a business problem.
• The grading of the project will be based on academic quality, measurable usage
data, and peer ranking in the class.
• The topic of the project should be related to mobile apps for business innovations.
• Students are expected to use discovery-driven strategies and user-centered design
principles to design and develop a new mobile app on the mobile platform using the
cloud-based coding tool such as MIT App Inventor 2, or Kodular.
• An Android mobile device is required for your testing.
• See the uploaded group project instruction for details

10
Free rider issue
• A "free rider" in a group project is someone who does not contribute their fair
share of work, but still benefits from the efforts of the rest of the group. This can
be a major issue in group projects, as it can lead to resentment and frustration
among group members and can ultimately hurt the quality of the project.

11
Address the issue of free riders in a group
project
• Some suggestions:
• Clearly define roles and responsibilities: At the beginning of the project, make sure that each
group member understands what is expected of them and what tasks they are responsible
for.
• Set clear deadlines: Establish deadlines for each task and make sure that group members
understand the importance of meeting them.
• Monitor progress: Regularly check in with group members to see how they are progressing
on their tasks. This can help you identify any potential issues early on.
• Communicate with group members: If you notice that someone is not pulling their weight,
don't be afraid to speak up. Talk to them privately and see if there is any way you can help
them or if there are any issues that need to be addressed.
• Consider revising roles: If someone is consistently not contributing, you may need to consider
revising their role in the project or reassigning their tasks to someone else.
• By taking these steps, you can help ensure that all group members are contributing their
fair share and that the project is completed successfully.

12
Course Schedule and Important Dates
• See the uploaded course schedule for details
• Important Dates

• Group Project Proposal Submission

• Proposal: Sunday of Week 6
• Mobile Apps and Presentation file: Sunday of Week 11
• Refer to Canvas submission links for the exact dates

13
Major Textbooks and References
• http://www.appinventor.org/book2
• [Md Mdhbubur Rahman]: Mobile App Marketing Intelligence: Intelligent Mobile App
Marketing Strategies to Get Millions of Downloads, NEW YORK PUBLISHING
• Other references in the lecture slides
• Some options for finding resources on Kodular:
• Check the Kodular website (https://www.kodular.io/). These sites may have
documentation, tutorials, and other resources available.
• Search online for Kodular tutorial videos or blog posts. There are many websites and
YouTube channels that provide tutorials and other information on Kodular.
• Consider joining online communities or forums related to Kodular. There are likely to be
other users who can provide guidance and support, and there may be resources shared
within these communities.

14
Course Website
• https://canvas.cityu.edu.hk/login
• Logon ID: your EID
• Password: your password
• Sharing course materials
• Downloading and reading lecture notes and tutorial materials
before attending classes
• Submissions

15
Code of Conduct
• Respect the rights and opinions of others.
• Be punctual and prepared for class.
• Use appropriate language and behavior at all times.
• Treat all course materials and equipment with care.
• Do not engage in any form of plagiarism or academic dishonesty.
• Violations of this code of conduct may result in disciplinary action, up
to and including dismissal from the course.
• Remember that the goal of this course is to create a positive and
respectful learning environment for all students. By following this
code of conduct, you can help us achieve that goal.
https://www.cityu.edu.hk/vpsa/cscdp/ 16
To avoid plagiarism
• Plagiarism is a serious issue that can have serious consequences for
students, including failing grades and academic dishonesty charges.
• To avoid plagiarism in this course, it's important to do the following:
• Understand what is considered plagiarism and avoid it.
• Properly cite any sources that you use in your assignments, including code or ideas from
online sources.
• Do your own work. Do not copy code or ideas from others or hire someone else to
complete your assignments for you.
• If you're not sure whether something is considered plagiarism, ask your instructor for
clarification.

17
 PART II
Why learn mobile app development?

18
 What is an app? .apk file

• An app, generally referred to as a mobile app, is a computer program designed to

run on a mobile device such as a smartphone or tablet computer
• Native app
• Target for a particular mobile platform on a mobile device (phone, tablet, etc.)

• Web app
• Internet-enabled app with specific functionality for mobile device
• No need to be downloaded and installed

• Hybrid app
• Combination of native and web apps

https://www.webfx.com/blog/web-design/native-app-vs-mobile-web-app-comparison/ 19
App OS and App stores
• OS: Android, iOS, …
• App stores:
• Google Play (Android)
• Apple App Store (iOS)
• Others:
• Amazon Appstore
• Samsung Apps etc.
• Windows Store
• Nokia
• Third-party App stores

20
https://gs.statcounter.com/os-market-share/mobile/worldwide
Web traffic:
Mobile vs Desktop PC vs Tablet

Source: https://wearesocial.com/blog/2020/01/digital-2020-3-8-billion-people-use-social-media 21
Mobile Time (App vs Browser)

22
Mobile App Minutes:

23
What digital marketing see:
• Digital marketing is vital for business and brand awareness
• Digital marketing never stop even under COVID-19

• Digital marketing needs:

• A effective and direct Marketing Channel
• To Improve Customer Engagement
• To Build Brand Awareness and Recognition

• Mobile apps to maximize business growth

https://www.youtube.com/embed/TSORcOnOoBM

Chart Source: https://wearesocial.com/blog/2020/01/digital-2020-3-8-billion-

people-use-social-media 24
With mobile apps, business may:
• Provide more values to your customers
• Increase revenue
• Increase customer engagement
• Direct and personalized channel to reach customers
• Build brand awareness
• Improve brand loyalty
• Better customer service and support
• Capture consumer trend

25
Business Mobile Applications
• Businessfirms start to realize the importance of mobile
business applications and to invest heavily into developing
mobile applications for their business improvements and
innovations.
• Year 2016: 37% digital traffic from mobile, 28% revenues from
mobile, however, only 25% of brands having or working on a
mobile strategy.
• Year 2018: many brands have their apps, however, many apps
were deleted after one time use.

26
Popular Mobile App Development Tools
• Android Studio
• Apps for Android (Google Play Store)
• Editor for chosen language like Java, Kotlin. to create APK file

• Xcode
• For Mac and iOS apps
• Editor for chosen language like Swift, Objective-C

• Flutter, React Native, Xamarin

• Cross-platform frameworks

27
Development Tools for the goal of
Manager can code (block-based)
• MIT App Inventor 2 https://appinventor.mit.edu/ By Google Lab
• Logic of Simple Programming
• Event-driven
• iOS Compatibility

• Thunkable X https://x.thunkable.com/
• Cross Platform
• Less components

• Kodular https://www.kodular.io/
• Better UI MIT App Inventor like but more
advanced components
• (better with Firefox)

28
 PART III: AI2
Understanding an App’s Architecture
Reference: Chap 14 [Wolber]

29
Understanding an App’s Architecture
Intended Learning Outcomes:
Upon successful completion of this chapter, students should be
able to:
• Examine the structure of an app from a programmer’s
perspective (different from a user’s perspective)
• Examine an app is like a recipe with a set of components that
respond to events
• Examine how apps can ask questions, repeat, remember, and
talk to the Web
30
Typical Programming Curriculum
• Basic statement syntax
• Variables
• Math operators, assignment operators
• Strings
• Logic and conditionals
• Loops
• Arrays
• Functions
• Objects
• Object-oriented

31
An overview of the app architecture

Component Block Editor

Designer

32
An app’s internals
• Has its components and its behaviors
• App Inventor 2 uses
• the Component Designer to specify the objects
(components) of the app,
• the Blocks Editor to program how the app responds to
user and external events (the app’s behavior)

33
Components
• Two main types of components in an app: visible and non-visible.
• The app’s visible components like buttons, text boxes, and labels. These are often
referred to as the app’s user interface.
• Non-visible components are those you can’t see (not part of the user interface). Instead,
they provide access to the built-in functionality of the device. For example:
• Texting component sends and processes SMS texts,
• LocationSensor component determines the device’s location, and
• TextToSpeech component talks.

• Components re defined by a set of properties, which are memory slots for storing
information about the component. For example:
• Buttons and labels have properties such as Width, Height, and Alignment, which
together
• Define how the component looks and
• Define the initial appearance of a component etc.
34
Behavior
• The behavior defines how the app should respond to events, both:
• user initiated (e.g., a button click) and
• external (e.g., an SMS text arriving to the phone).

• App Inventor 2 provides a high-level “blocks” language for specifying

behaviors.
• The blocks make programming behaviors more like plugging puzzle pieces
together, as opposed to remembering and typing code as with traditional
languages.
• App Inventor is designed to make specifying event-response behaviors
especially easy.

35
An App As a Recipe (traditional view)
• Like a recipe, a traditional app follows a linear sequence of instructions that
the Smartphone should perform.
• For example: A typical app might perform:

(A) start a bank transaction

(B) perform some computations and modify a

customer’s account , and then

(C) print out the new balance on the screen .

36
An App As a Set of Event Handlers
(modern view)
• Most modern software doesn’t perform a bunch of instructions in a
predetermined order; instead, it reacts to events--most commonly, events
initiated by the app’s end user.
• For example, if the user clicks a button, the app responds by performing some
operations (functions, like sending a text message and generating a confirmation
sound…).
• Modern apps are better conceptualized as
event-response machines. The apps do
include “recipes”--sequences of
instructions--but each recipe is only
performed in response to some events.

37
Function
• As events occur, the app reacts by calling a sequence of functions (e.g. like
sending a text message and generating a confirmation sound…).
• To call a function means to invoke it, to make it happen. We call an event
and the set of functions performed in response to it an event handler.

• Many events are initiated by the end user,

but some are not. An app can react to
events that happen within the phone, such
as changes to its orientation sensor and
the clock (i.e., the passing of time), and
events created by things outside the
phone, such as a text or call from another
phone, or data arriving from the Web
38
Event Types
• The events that can trigger activity fall into the categories listed below

Event type Example

User-initiated event When the user clicks button1,do...
Initialization event When the app launches, do...
Timer event When 20 milliseconds passes,do...
Animation event When two objects collide, do...
External event When the phone receives a text,do...

39
Summary
• Examine the structure of an app from a programmer’s
perspective (different from a user’s perspective)
• Examine an app is like a recipe with a set of components that
respond to events
• Examine how apps can ask questions, repeat, remember, and
talk to the Web

40
 PART IV
Exercise: HelloPurr
Reference: Chap 1 [Wolber]

An Android mobile device will make app testing a lot easier.

Or you may try to install Bluestack on your computer to do testing
You may contact Albert to borrow an Android device.
We have limited numbers of devices, and it will be based on a first-come, first-served.

41
 Download Tutorial 1 HelloPurr.pdf from Canvas

Exercise: HelloPurr
Intended Learning Outcomes :
Upon successful completion of this exercise, students should be able to:
• Build apps by selecting components and then telling them what to do and when to
do it.
• Use the Component Designer to select components. Some components are visible
on the device’s screen and some aren’t.
• Add media (sounds and images) to apps by uploading them from your computer.
• Use the Blocks Editor to assemble blocks that define the components’ behavior.
• Test apps with App Inventor’s live testing. This lets you see how apps will look and
behave on the device step by step, even as you’re building them.
• Package the apps you build and downloading them to a device.

42
 Overall Summary
• Course Introduction
• Understanding an App’s Architecture
• Tutorial Exercise

Reference:
• [Wolber]: David Wolber, Hal Abelson, Ellen Spertus, and Liz Looney, 2014, App Inventor 2: Create your own Android Apps, O'Reilly Media, 332 Pages,
ISBN-13: 978-1491906842. http://www.appinventor.org/book2
• https://datareportal.com/reports/digital-2019-global-digital-overview 43