Download as pdf or txt
Download as pdf or txt
You are on page 1of 97

IS2023

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

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

4
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
5
Typical Programming Curriculum
• Basic statement syntax
• Variables
• Math operators, assignment operators
• Strings
• Logic and conditionals
• Loops
• Arrays
• Functions
• Objects
• Object-oriented

6
An overview of the app architecture

Component Block Editor


Designer

7
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)

8
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.
9
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.

10
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 .

11
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.

12
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
13
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...

14
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

15
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 2)
Mobile Commerce
Plan Your Business: Business Model Canvas
App Development Process
Apps Exercise: PaintPot
16
How mCommerce is shaping the online
commerce in Asia
• mCommerce takes over eCommerce in Asia
• The importance of design in mCommerce

1. Design simplicity
2. Micro-interactions
3. Social selling an option in Asia
4. Leverage the popularity of digital wallets
5. Consider an embedded payment strategy

https://scandasia.com/how-mcommerce-is-shaping-the-online-commerce-in-asia/ 17
PART II
Manage Your Business: Business Model Canvas

18
Business Model Canvas
• A tool to create and analyze business models
• 9 segments
• Customer
• Value Proposition
• The way it solves problems or satisfies a need
• What makes the customer choose you
• Channels
• The way you deliver value proposition to your customers
• App store/company website/social media website?
• Customer Relationships
• How you interact with your customers
19
Business Model Canvas Continued
• 9 segments:
• Revenue Streams
• Key Resources
• The critical means necessary to develop value to customers
• Key Activities
• Key Partners
• People/Companies that provide activities or supplies to you
• Cost Structure
• Technical development/maintenance
• Cloud service: internet and database

20
PART III
App Development Process
Getting Started: Manage Your Business
Reference: How to Make an App Business [Steven Hojlund]

21
Discover: Identify the Problem
• Solving a real problem is what makes for an amazing app and a successful
project.
• Identify the problem
• Validate the need with deep market research
• Has the problem been correctly identified? How big is the problem perceived to
be by those who experience it?
• How many people are experiencing the problem?
• What is the quality of the problem?

22
Define: Mobile App Goals and Objectives
• What problems or pain points will your app solve for your target customers?
• Define the target audience
• What features will it include?
• What is your app’s core appeal?
• How does this app connect with the current business?
• Will the app content and features of your app differ from your website if
there’s one?

User Interface, app navigation and quality contents


23
Case Example: Lakeside Fitness
• Small business running full-service health club
• Personal Training
• Group Exercise class
• Juice bar, pro shop
• Sauna

• Pain Point:
• Located in New Jersey, USA
• People in winter are less reluctant to come out to gym

• Solution:
• Loyalty Cards
• Push Notifications
• News about new classes and schedules

• Results:
• 70% in gym membership
• 30% in smoothie sales
https://www.swiftic.com/case-studies/lakeside-fitness-center/
Tutorial 2: PaintPot
• What we want to achieve in this app is:

• Make colorful and different size dots


• On wherever we touch the canvas

• Draw lines
• When we drag along the canvas

• Wipe or reset the canvas to original

25
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 3)
Programming Your App’s Memory
Programming Lists of Data (Chap 19)
Programming Your App to Make Decisions: Conditional Blocks (Chap 18)
Tutorial Exercise: Multi-screens and Navigation System

26
Setting and Getting a Variable
• When you define a variable, App Inventor creates two
blocks for it, a set and a get. You can access these blocks by
hovering over the variable name in the initialization block.
• The set global to block lets you modify the value stored in
the variable that can be used in all of the program’s event
handlers and procedures. The App Inventor allows you to
also define variables that are “local” to a particular
procedure or event handler.
• The block labeled get global score helps you retrieve the
value of a variable. For instance, if you wanted to check if
the value inside the memory slot was greater
than 100, you’d plug the get global score block into
an if test.
27
Building Complex Expressions
• In the Math drawer, App Inventor provides a wide range of
mathematical functions, for you to build a complex expression.
• Take one example in the following expression:
• Supposing the Canvas has a Width of 300 and the ImageSprite has a Width of 50,
the app would perform the following steps:
• Retrieve the 300 and the 50 from the memory slots for Canvas1.Width and
ImageSprite.Width, respectively.
• Subtract: 300 – 50 = 250.
• Call the random fraction function to get a number between 0 and 1 (say, .5).
• Multiply: 250 * .5 = 125.
• Place the 125 into the memory slot for the ImageSprite1.X property.

28
PART II
Programming Lists of Data
Reference: Chap 19 [Wolber]
http://www.appinventor.org/bookChapters/chapter19.pdf

29
Selecting an Item in a List
• As your app runs, you’ll need to select
items from the list
• You access items within a list by using an
index; that is, by specifying a position in
the list.
• For example, if a list has three items, you
can access the items by using indices 1, 2,
and 3.
• If you plug in the index “2”, the result of
selecting the second item is “333–4444.”

30
PART III
Programming Your App to Make Decisions: Conditional Blocks
Reference: Chap 18 [Wolber]
http://www.appinventor.org/bookChapters/chapter18.pdf

31
Testing Conditions with if and else if Blocks
• To allow conditional branching, App Inventor provides an
if-then conditional block in the Control drawer. You can
extend the block with as many else and else if branches
as you’d like by clicking the blue icon.
• You can plug any Boolean expression into the test sockets
of the if and else if blocks. A Boolean expression is a
mathematical equation that returns a result of either true
or false.
• The blocks you put within the “then” socket of an if block
will only be executed if the test is true.
• For Example:

32
Tutorial 3: Multi-Screens and Navigation
Menu

33
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 4)
App Development: Repeating Blocks (Chap 20)
App Development: Defining Procedures and Reusing Blocks (Chap 21)
App Development & Exercise: Login System

34
Repeating Blocks
Intended Learning Outcomes:
Upon successful completion of this chapter, students should be able to:
• program repetition with two special repeat blocks (i.e., for each
block and while-do block) instead of copying and pasting the same
blocks over and over
• send an SMS text to every phone number in a list
• add up a list of numbers
• use repeat blocks to simplify an app

35
Using for each to Display a List
• 1st Way: When you plug a list directly into a Text
property of a Label, the list items are displayed in
the label as a single row of text, separated by 1st Way:
spaces and contained in parentheses: →
• 2nd Way: When \n appears in a text block, it means
“go to the next line before you display the next
2nd Way:
item.” Thus, the text object “111–1111\n222–
2222\n333–3333” would appear as: →
• Which way is better?
• Other ways: A tab, for instance, is denoted by \t.
• To learn more about control characters, check out the
Unicode standard for text representation at
• http://www.unicode.org/standard/standard.html 36
𝑵

෍ 𝒏𝒖𝒎𝒃𝒆𝒓 = 𝟏 + 𝟐 + ⋯ + 𝑵
𝒏=𝟏
Using while-do to Compute a Formula
• The advantage of the while-do block lies in its
generality: for each repeat over a list, but while can If NTextBox.Text = 3
repeat so long as any arbitrary condition is true
• For example:
• Suppose that the user types a 3 in the text box (NTextBox)
• The variables of the app would look like 1st Reached Values
when the while-do block is first reached (before looping)
• After the 1st iteration (loop) of the blocks within the while-
do, the variable values are as listed in 1st Iteration Values
• After the 2nd iteration (loop) of the blocks within the while- 1st Reached Values 2nd Iteration Values
do, the variable values are as listed in 2nd Iteration Values (Before Looping)

• After the 3rd iteration (loop) of the blocks within the while-
do, the variable values are as listed in 3rd Iteration Values
• Then the while-do block ends, and the ResultLabel.Text = 6 1st Iteration Values 3rd Iteration Values
37
Defining Procedures and Reusing Blocks
Intended Learning Outcomes:
Upon successful completion of this chapter, students should be able to:
• Define procedures, named sequences of blocks, that your app can
call with the following issues
• Types of procedure: to do procedure, to result procedure
• Defining a Procedure
• Eliminating Redundancy
• Calling a Procedure (Performing with program counter)
• Adding Parameters to Your Procedure
• Returning Values from a Procedure
• Reusing Procedures/Blocks Among Apps

38
Hospital application using distanceBetweenPoints
Procedure
• Consider an app to determine the closest local hospital to the user’s current
location :

39
Simple Log-in Page:
• When the app is started, it requires user to log in to go to
the quiz page
• Username and password need to be verified with the
stored values
Tutorial 4: Google Firebase
Authentication

41
Google Firebase Authentication

42
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 5)
Working with Databases (Chap 22)
Firebase DB, CloudinaryDB, Dictionary,
ListView, ChatView
Apps Development Exercise: Simple Chat App

43
Working with Databases
Intended Learning Outcomes:
Upon successful completion of this chapter, students should be
able to:
• Create apps that store data directly on the Android device.
• Create apps that share data with other devices and people by
storing it in a centralized database on the Web.

44
Storing Data by Using CloudDB
• The CloudDB.StoreValue block
works in the same manner as
TinyDB.StoreValue, except that the
data is stored on the Web.
• For our voting sample, assume that
the user can enter a vote in a text
box named VoteTextBox and tap a
button named Vote Button to
submit the vote.
• To store the vote to the web
database so that others can see it,
we’ll code the VoteButton.Click
event handler like this example.
45
Firebase .Append Value Error
• These blocks means that
When the Screen starts the firebase
gets the value of a specific tag .
After the Firebase gets the value it
checks the tag, if its the correct tag
then it will check its value and if the
value is empty it stores an empty list.
Now when button is clicked it will
append the value as already the value
has been stored thus previous value
empty error will not appear.
• You are done, now you can append
the value without any errors

46
Kodular: Cloudinary DataBase
• A non-visible component that allows for uploading of images, videos, audios and
many other file types to Cloudinary.
• Set up a free Cloudinary account:
• https://cloudinary.com/

https://docs.kodular.io/components/storage/cloudinary/ 47
Built-in Block: Dictionary
• Dictionaries, called in other languages terms such as maps, associative arrays or
lists, are data structures that associate one value, often called the key, with
another value.
• A common way of displaying dictionaries is using the JavaScript Object Notation
(JSON), for example:

http://ai2.appinventor.mit.edu/reference/blocks/dictionaries.html#create-empty-dictionary
48
ListView Component
• AI2: User Interface> ListView now support mainText, detailText and
imageName

• Kodular: Layout>Lists>List View Image and Text

http://ai2.appinventor.mit.edu/reference/components/userinterface.html#ListView https://docs.kodular.io/components/layout/lists/list-view-image-and-text/ 49
Tutorial 6: Kodular: Simple Chat
• Kodular: Layout>Views>Chat View
• A visible component that displays a scrollable chat.
• A chat consists of messages sent by two or more than two
users where each message can be either simple text or have
rich formatting.

https://docs.kodular.io/components/layout/views/chat-view/ https://community.kodular.io/t/chatview-component-how-to-use-guide/12922 50
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 6)
Cost of App Store Listing
Monetizing Apps (Chap 15 [Iversen])
In-App Billing/Purchase
Google AdMob
App Development DEMO: [Kodular] Pollfish & AdMob
Tutorial Exercise 6: VRFR & Wireframe 51
App Monetization Strategies

• Making money from apps is possible but difficult


• There are hundreds of thousands of apps available
• The revenue generated from an individual app is typically very small
• The app stores take a 15-30% cut of all the revenue that your app generates
• More importantly, how can you get a lot of people to pay you to use the app
so that the revenue generated is enough to fund further development or
expansion?

52
App Monetization Strategies:
Free Apps (In-App Advertising)
• Banners: This type of ad can be placed at the bottom or top of your app’s layout and remains on-screen
while the app is being used. Although they don’t generate enormous amounts of money, banners are a
nice way of helping you yield some revenue in the beginning.
• Video ads: Whether they are interstitials (popping up at certain transition points) or rewarded ads
(offering rewards for watching a video), the popularity of video ads will continue to grow.
• Playable ads: Another increasingly popular in-app ad format with high conversion rates, playable ads
let the user instantly play a part of the game advertised, so they could experience first-hand how the
app works and decide if they like it before buying or downloading.
• Offer walls: An oldie but goodie, offer walls are pages where a user can purchase virtual content or
additional in-game features in exchange for completing an action and/or paying real (or digital, if
you’re really looking to get in with the trends) currency. With a great eCPM (effective cost per mille)
potential, offer walls are an effective way of generating ad revenues without negatively affecting user
experience (UX).
• Notification ads: These ads show up in the device’s status bar, increasing the user’s awareness of the
ad’s presence. Be careful not to overuse them, as there is a fine line between annoying and useful with
these.

https://www.forbes.com/sites/steveolenski/2015/11/12/6-types-of-native-advertising-and-how-each-can-benefit-
53

your-business/#422568ab4455
App Monetization Strategies:
In-App Purchases/ In-App Billing
• Making enough money from ad-supported apps to support a business is difficult
• You need a very popular app to generate a significant amount of money

• Another popular approach is to release a free app that is supported by in-app


purchases (i.e., freemium business model)
• You generate downloads with the free app,
• Get the users hooked,
• Allow them to add features by advertising the feature in the app
• The sale is made during use of the app

• It opens up the possibility of a regular revenue stream from the same user, instead of
relying on a single purchase up front
• For example, a game with a number of free lives. If users want to continue playing after used
up free lives, they have to buy more for more lives

54
App Monetization Strategies: Freemium

• In the freemium business model, users pay nothing to download your app and are
offered optional in-app purchases for premium features, additional content, or
digital goods.
• Engaging both paying and non-paying users
• Providing value for different types of paying users

55
App Monetization Strategies:
Subscriptions

Advantages Disadvantages
• Regular engagement • Customer may be paying for too
much
• Easier for consumers to budget
• Easy to cancel
• Easier for businesses to be
forward-looking • Consistently providing new value
to the customer

56
Match App with Pricing Model

http://www.xconomy.com/san-Francisco/2011/04/15/choosing-the-right-business-model-for-your-app/ 57
Revenue Models based on Revenue Source

On average, developers use just under two revenue models concurrently.


58
Tutorial 6 Demo: Advertising (Kodular)

• Support a wide range of Ads


providers.
• We will take a little percentage of
your earnings if you use our ads
component (5-30%).
• You can use your own AdMob
account and AdUnitId.
• Warning: Make sure you're in test
mode during development to avoid
being disabled for clicking your own
ads.

59
Tutorial 6 Demo: Pollfish & AdMob Rewarded
Video
• You will learn how to use Pollfish surveys
in your app.
• Adding an AdMob Reward Video in your
app.
• Explore how to reward the users who
finished a survey or watched an ad video.

60
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 7)
UX: eCommerce
Product Catalog, Shopping Cart, Payment, Product Review
Dynamic Card View
Apps Development Exercise:
Simple Product Search, Simple Product Review

61
Mobile app wireframe design tools online

• Note: You can use any


Mockups/wireframe
tools of your choice.

https://moqups.com 62
Mobile eCommerce Design
Includes:
1. Create a login system (i.e., with firebase authentication)
2. Built a product database (i.e., with firebase database)
• You may want to build a web admin module

3. Show products with ListView, GridView or CardView, or DynamicCardView


4. Shopping cart checkout, may add discount and gamification factors (i.e., membership
point redeem system)
5. Make payment with any payment gateway or in-app billings
6. Product reviews or ratings
7. Customer services support (i.e., online Chat or Email)
8. Additional: you may have track shipping, refund policy, invoice, and purchase history

63
Example:
Product Catalog + Dynamic CardView

64
How To Use Dynamic CardView

• A component to create
dynamic cardviews in
Arrangements.
• Palette>Dynamic
Components>
1. Dynamic Button
2. Dynamic Card View
3. Dynamic Image
4. Dynamic Label
5. Dynamic Space
6. Dynamic Text Box

https://community.kodular.io/t/dynamic-card-view-how-to-use-it/34433 https://docs.kodular.io/components/dynamic/dynamic-card-view/ 65
Example:
Product Review

66
Tutorial 7a: Tutor Search Page

• Allow user to search by

• Price range

• Subject

• Location

67
Tutorial 7b: Review App

68
Tutorial 7c: Review & Rating App

69
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 8)
A common group project feature
Sensors (Chap 23)
Maps
Apps Exercise: AndoidWhere(Chap 7)

70
Key Features of Booking App
• User registration & profile
• Search
• Booking process & details screens
• Payment
• Review & rating
• Booking cancelation policy
• Push notifications

https://mlsdev.com/blog/how-to-make-a-booking-app 71
Kodular: (MVP) Simple Booking App

72
ScreenBookings

73
ScreenMyBookings (not done yet…)

74
Final word: Database design is crucial
• 1 available booking: booking ID, Date, Time, location, (professional name) (no. of
people) (duration), (price)
• 2 booked records: booking ID, booked by?
• 3 completed bookings:
• Tag: bookings
• Value: List of Dictionary
• bookingId=date+time+owner, Date, time, duration, venue, price,
booked/available/canceled/completed, owner, bookedBy, noOfPeople,

75
• "[{\"Address\":\"\",\"BookedBy\":\"\",\"BookingID
\":\"DateTimeAlbert\",\"Date\":\"Date\",\"Durati
on\":\"1
hour\",\"NoOfPeople\":\"\",\"OwnerID\":\"Albert
Database design is crucial \",\"Price\":\"\",\"Status\":\"Available\",\"Time\":\
"Time\"},{\"Address\":\"home\",\"BookedBy\":\"\
",\"BookingID\":\"7\\/3\\/20222:39Albert\",\"Date
\":\"7\\/3\\/2022\",\"Duration\":\"30
mins\",\"NoOfPeople\":\"\",\"OwnerID\":\"Albert
\",\"Price\":\"\",\"Status\":\"Available\",\"Time\":\
"2:39\"},{\"BookingID\":\"9\\/3\\/20222:24Albert\
",\"Date\":\"9\\/3\\/2022\",\"Time\":\"2:24\",\"Dur
ation\":\"2
hours\",\"Address\":\"home\",\"OwnerID\":\"Alb
ert\",\"Status\":\"Booked\",\"BookedBy\":\"olive
r\",\"NoOfPeople\":\"\",\"Price\":\"\"},{\"Address\
":\"\",\"BookedBy\":\"\",\"BookingID\":\"7\\/3\\/20
223:00Albert\",\"Date\":\"7\\/3\\/2022\",\"Duratio
n\":\"30
mins\",\"NoOfPeople\":\"\",\"OwnerID\":\"Albert
\",\"Price\":\"\",\"Status\":\"Available\",\"Time\":\
"3:00\"}]"

76
PART II
Sensors
Reference: Chap 23 [Wolber]
http://www.appinventor.org/bookChapters/chapter23.pdf

77
The x, y and z axes of a
Accelerometer Sensor standard smartphone

• Acceleration is the rate of change of velocity over time.


• xAccel (Positive when the device’s left side is raised, and negative
when its right side is raised)
• yAccel (Positive when the device’s bottom is raised, and negative when
its top is raised)
• zAccel (Positive when the device display is facing up, and negative
when the display is facing down)
• Responding to the Device Shaking
• E.g. Shaking event to make the kitty meow when the
phone was shaken

• Detecting Free Fall


• If all the acceleration readings are near 0 (abs value
is less than 1), the device is free-falling to the ground
• E.g. AccelerometerSensor.AccelerationChanged
event to detect when an elderly person has fallen and
automatically send an SMS message out in response 78
Orientation Sensor
• You can use the OrientationSensor for game-like apps in
which the user controls the action by tilting the device.
• It can also be used as a compass to find out which direction
(north/south, east/west) the phone is pointing.
• The OrientationSensor has five properties:
• Roll (Left–Right) -90 to 90
• Pitch (Up–Back) -180 to 180
• Azimuth (Compass) 0 to 360
• Magnitude (how much the device is tilted) 0 to 1
• Angle (this sensor is reliable only when the roll angle is 0)

• Note that these angles work off of a different coordinate


system than the one used in aviation (for yaw, pitch, and roll)
79
• These measurements assume that the device itself is not moving.
Pedometer
• This component keeps count of steps using the accelerometer.
• A Component that acts like a Pedometer.
• It senses motion via the Accelerometer and attempts to
determine if a step has been taken.
• Using a configurable stride length, it can estimate the distance
travelled as well.

80
Location Sensor
• Non-visible component providing location information,
including Latitude, Longitude, Altitude (if supported by the device),
speed (if supported by the device), and address.
• This can also perform “geocoding”, converting a given address (not
necessarily the current one) to a latitude (with
the LatitudeFromAddress method) and a longitude (with
the LongitudeFromAddress method).
• In order to function, the component must have its Enabled property
set to true, and the device must have location sensing enabled
through wireless networks or GPS satellites (if outdoors).
• Location information might not be immediately available when an app
starts. You’ll have to wait a short time for a location provider to be
found and used, or wait for the LocationChanged event.
• The emulator does not emulate sensors on all devices. Code should be
tested on a physical device.

81
Creating Location-Aware AR Apps
For Augmented-Reality:
• These apps use your location and the phone’s
orientation to provide overlay information that
augments the natural setting.
• e.g. Point a phone at a building and see its price
on the real-estate market
• Walk near an exotic plant in a botanical garden
and an app can tell you its species

https://ar.appinventor.mit.edu/

82
Option 1:
Kodular Maps Component
• A two-dimensional container that renders map tiles in the background
and allows for multiple Marker elements to identify points on the map.
• Map tiles are supplied by OpenStreetMap contributors and the the
United States Geological Survey.
• The Map component provides three utilities for manipulating its
boundaries with App Inventor.
• First, a locking mechanism is provided to allow the map to be moved
relative to other components on the Screen.
• Second, when unlocked, the user can pan the Map to any location. At
this new location, the "Set Initial Boundary" button can be pressed to
save the current Map coordinates to its properties.
• Lastly, if the Map is moved to a different location, for example to
add Markers off-screen, then the "Reset Map to Initial Bounds" button
can be used to re-center the Map at the starting location.

83
Tutorial 8: Android, Where’s My Car?
For Private Use:
• e.g., The Android, Where’s My Car? app (Chapter 7)
• Let you remember a previous location so that you can get back to it at a later
time.
• Your location information is stored only in your device’s database.

For Group Use:


• e.g., a group of hikers might want to keep track of one another’s whereabouts in
the wilderness, stored the location information in a Clould database.
• A group of business associates might want to find one another at a large
conference (or a bar).
• Some people use such “check-in” apps everyday.

84
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 9)
Publishing Apps (Chap 16 [Iversen])
App Store Optimization (ASO)
Exercise: Prepare your Play store listing elements

85
Developer Program Policies
• Restricted Content
• People from all over the world use Google Play to
access apps and games every day. Before submitting
an app, ask yourself if your app is appropriate for
Google Play and compliant with local laws.
• Child Endangerment
• Inappropriate Content
• Financial Services
• Gambling
• Illegal Activities
• User Generated Content
• Unapproved Substances

86
https://play.google.com/about/restricted-content/child-endangerment/
PART II
App Store Optimization (ASO)

87
How is App Store Optimization done?
1. First things first: Establish a Clear ASO strategy
2. Pick the Right Name for your App
3. Know how to do Keyword Research for your Mobile App (AI can help with
Keyword Research)
4. Write your App Description
5. Get the right App Icon by A/B testing
6. Prepare App Screenshots & Videos
7. App Listing and Localization
8. App Ratings and Reviews

https://appradar.com/academy/what-is-app-store-optimization/ 88
Tutorial 9: Prepare Store listing
elements
• Keyword research
• Category
• Title
• Short description
• Description
• Icon design
• Screenshots
• Video

89
IS2023
MOBILE APPLICATIONS
FOR BUSINESS
(WEEK 10)
Group Project Skill: Forum
App Design: Push Notification vs SMS vs Email
Apps Demo Exercise: Push Notification

90
PART I
Group Project Skill:
Forum

91
MVP – a 1 screen Forum app
(Option 1)

Topics: t1,
t2, t3

Comments:
for t1, c1,
c2, c3

92
Kodular Dynamic Components
(Option 2)

All items are aligned in a vertical manner! 93


WebViewer + web forum
(Option 3)

https://www.wix.com/app-market/wix-forum 94
Extension: DynamicComponent
(Option 4) Let’s check out our samples
demo_forum5.aia

95
https://community.kodular.io/t/5-different-listviews-using-dynamic-component-extension-guide/71891
PART II
Apps Design for Business
Reach Your Customers Effectively:
Push Notification

Reference: Rahman, Md Mahbubur. Mobile App Marketing Intelligence: Intelligent Mobile App
96
Marketing Strategies to Get Millions of Downloads! (p. 20). NEW YORK PUBLISHING. Kindle Edition.
Push Notification
• A push notification is a message that pops up on a mobile device. App
publishers can send them at any time; users don't have to be in the app or
using their devices to receive them.
• Push notifications look like SMS text messages and mobile alerts, but they
only reach users who have installed your app.
• Push notification can do a lot of things. For example,
• They can show the latest sports scores.
• They can drive a user to take action, for example, download an app through a
coupon.
• They can inform a user about an event, for example, a company giving a
huge/flash sale.
• They can send data to your app.
97
PART III
App Exercise: Push Notifications
Reference: https://docs.kodular.io/components/user-
interface/notifier/

98
Push Notification by One Signal
(Kodular)
• NOT Notifier! • Push notifications are one of the biggest
• Push Notifications by One Signal advantages that mobile apps have over
mobile websites, since they can send
• PLEASE NOTE: messages to users without the app being
• Push Notifications can only be tested on open
Android Devices (install the apk)
• Social> Push Notifications (Powered by • However, annoying notifications---those that
OneSignal) are irrelevant and too frequent---can be
dismissed or blocked easily
• Experimental> Notification
• Extensions> OneSignalSend • We highly recommend sending notifications
only when the content is relevant to the user
• Extension> OneSignalFix
99

You might also like