Mobile Geo-Based Bulletin Messaging Systemeprints.utar.edu.my/3044/1/fyp_CS_2018_LBJW_-_1504431.pdf · BCS (HONS) COMPUTER SCIENCE Faculty of Information and Communication Technology

i

Mobile Geo-Based Bulletin Messaging System

BY

BERNARD LEE JIAN WEN

A PROPOSAL

SUBMITTED TO

Universiti Tunku Abdul Rahman

in partial fulfillment of the requirements

for the degree of

BACHELOR OF COMPUTER SCIENCE (HONS)

Faculty of Information and Communication Technology

(Perak Campus)

MAY 2018

BCS (HONS) COMPUTER SCIENCE Faculty of Information and Communication Technology (Perak Campus), UTAR

ii

UNIVERSITI TUNKU ABDUL RAHMAN

REPORT STATUS DECLARATION FORM

Title: __________________________________________________________

__________________________________________________________

__________________________________________________________

Academic Session: _____________

I __________________________________________________________

(CAPITAL LETTER)

declare that I allow this Final Year Project Report to be kept in

Universiti Tunku Abdul Rahman Library subject to the regulations as follows:

1. The dissertation is a property of the Library.

2. The Library is allowed to make copies of this dissertation for academic purposes.

Verified by,

_________________________ _________________________

(Author’s signature) (Supervi-

sor’s signature)

Address:

__________________________

__________________________ _________________________

__________________________ Super-

visor’s name

Date: _____________________ Date: ____________________

i

Mobile Geo-Based Bulletin Messaging System

BY


A PROPOSAL

SUBMITTED TO

Universiti Tunku Abdul Rahman

in partial fulfillment of the requirements

for the degree of

BACHELOR OF COMPUTER SCIENCE (HONS)

Faculty of Information and Communication Technology

(Perak Campus)

MAY 2018


ii

DECLARATION OF ORIGINALITY

I declare that this report entitled “METHODOLOGY, CONCEPT AND DESIGN OF A 2-MICRON

CMOS DIGITAL BASED TEACHING CHIP USING FULL-CUSTOM DESIGN STYLE” is my own work

except as cited in the references. The report has not been accepted for any degree and is not

being submitted concurrently in candidature for any degree or other award.

Signature : _________________________

Name : _________________________

Date : _________________________


26th NOVEMBER 2017


iii

ABSTRACT

This project is an geo-location based augmented reality mobile application development

for helping users to create advertisement and notices which allows other user to see in

an interesting ways based on user's geographical location. This project is motivated by

difficulty of physically changing the content of advertisement and notice which is time

consuming and also enhance the existing augmented reality in more intriguing and in-

tractable. The objective of this project is the allow user create advertisement and notice

on the augmented reality bulletin board and display it to other users. Besides that, this

project is also aim to capture user indoor location so that users are able to see adver-

tisements and notices available in a faculty block to prevent users miss out any future

and current activity held in the faculty or block. The existing similar augmented reality

application reviewed are Wallame, Augment and Layar. The existing systems were re-

viewed by listing the respective strengths and weaknesses, suggesting ways the existing

systems can be improved and comparing the features of the existing system. The meth-

odology used to carry out the study is phased development of the Phased Development-

based Methodology. The output at the end of the project is an augmented reality mo-

bile application system that is capable of creating advertisements and notices at a spe-

cific faculty or blocks, and also capable of detecting user indoor location and display ad-

vertisements and notices available in the faculty block.


iv

TABLE OF CONTENTS

TITLE i

DECLARATION OF ORIGINALITY ii

ABSTRACT iii

TABLE OF CONTENTS iv

LIST OF TABLES vi

LIST OF FIGURES vii

LIST OF ABBREVIATION ix

CHAPTER 1 : INTRODUCTION 1

1-1 : Motivation and Problem Statement 1

1-2 : Background and Motivation 2

1-3 : Project Objective 3

1-4 : Proposed Approach 3

1-5 : Project Highlight 4

CHAPTER 2: LITERATURE REVIEW 6

2-1 : Wallame 6

2-2 : Augment 8

2-3 : Layar 10

2-4 : Comparison between Wallame, Augment and Layar 12

2-5 : Vuforia 14

2-6 : Augment 15

CHAPTER 3: SYSTEM DESIGN 16

3-1 : System Design 16

3-1-1: Use-Case Diagram 16

3-1-2: System Flow Diagram 17


v

3-1-3: Entity Relational Diagram 19

3-2 Determine Location Using geo-location 20

3-3 Determine Direction using 2 locations 22

3-4 Markerless Augmented Reality Board Translation 23

CHAPTER 4: METHODOLOGY AND TOOLS 25

4-1 Phased Development Methodology 25

4-1-1 General Work Procedure 26

4-2 Tools to Use 28

4-3 Requirement 29

4-3-1 Functional Requirement 29

4-3-2 Non-Functional Requirement 30

CHAPTER 5: DEVELOPMENT DESCRIPTION 31

5-1 Implementation and Testing 31

CHAPRER 6: CONCLUSION 53

REFERENCES 56

APPENDIX A Poster of Mobile Geo-Based Bulletin Messaging

System

A

APPENDIX B Screenshot of UI Design B

APPENDIX C Turnitin Plagiarism Check Summary and Result G

APPENDIX D CHECKLIST FOR FYP THESIS SUBMISSION I


vi

LIST OF TABLES

Table Number Title Page

Table 2-1 Comparison of features between Wallame, Aug-

ment and Layar

12

Table 2-2 Explanation of features compared in Table 2.1 13

Table 5-1-1 Use Case Description for Register function 31

Table 5-1-2 Use Case Description for Login function 33

Table 5-1-3 Use Case Description for Create Event function 35

Table 5-1-4 Use Case Description for View Event advertise-

ment List function

37

Table 5-1-5 Use Case Description for View Event details func-

tion

39

Table 5-1-6 Use Case Description for View Markerless Aug-

mented Reality Event advertisement function

41

Table 5-1-7 Use Case Description for See further details func-

tion

43

Table 5-1-8 Use Case Description for Register Event function 45

Table 5-1-9 Use Case Description for View Marker Based

Augmented Reality Notice Board function

47

Table 5-1-10 Use Case Description for Update Notice Board

function

49

Table 5-1-11 Use Case Description for Log Out function 51


vii

LIST OF FIGURES

Figure Number Title Page

Figure 2-1-1 Wallame poster 6

Figure 2-2-1 Augment poster 8

Figure 2-2-2 Augment 3D object design 8

Figure 2-3-1 Layar poster 10

Figure 2-5-1 Tracker-Learning Detection Algorithm 14

Figure 3-1-1 Use Case Diagram 16

Figure 3-1-2 System Flow Diagram (Part 1) 17

Figure 3-1-3 System Flow Diagram (Part 2) 18

Figure 3-1-4 Entity Relational Diagram 19

Figure 3-2-1 Location Determination Diagram (Case 1) 20

Figure 3-2-2 Location Determination Diagram (Case 2) 21

Figure 3-3-1 Determine Direction Diagram 22

Figure 3-4–1 Markerless Augmented Reality Board Translation 23

Figure 3-4-2 Markerless Augmented Reality Board Transla-

tion(Original Postion)

24


tion(Original Postition)

24



24

Figure 4-1-1 Phased Development-based Methodology 25

Figure 4-1-2 General Work Procedure 26

Figure 5-1-1 Use Case testing for Register function invalid ID 32

Figure 5-1-2 Use Case testing for Login function invalid ID and

Password

34


viii

Figure 5-1-3 Use Case testing for Create Event function Empty

Picture

36

Figure 5-1-4 Use Case testing for View event advertisement list

function empty list

38

Figure 5-1-5 Use Case testing for View event Detail function 40

Figure 5-1-6 Use Case testing for View Markerless Augmented

Reality Event advertisement function empty list

42

Figure 5-1-7 Use Case testing for See further details function 44

Figure 5-1-8 Use Case testing Register Event function 46

Figure 5-1-9 Use Case testing for View Marker Based Augmented

Reality Notice Board

48

Figure 5-1-10 Use Case testing for Update Notice Board 50

Figure 5-1-11 Use Case testing for Log Out 52


ix

LIST OF ABBREVIATIONS

AR Augmented Reality

VR Virtual Reality

GPS Global Positioning System

2D Two-dimensional

3D Three-dimensional

SDLC System Development Life Cycle

C# C Sharp

ECMA European Computer Manufacturers Association

SQL standardized query language

RDBMS Relational database management system

Chapter 1: Introduction


1

CHAPTER 1: Introduction

1.1 Problem Statement

Bulletin board requires student and lecturer to physically change the content of

the notice and advertisement. It is inconvenience every time the content of notice or

advertisement change such as event advertisement is expire and it needs to be removed

from bulletin board.

Physical notices and advertisement on bulletin board does not contain any in-

teractivity. Student or lecturer are not able to register any event through the physical

notices or advertisement. Physical notices or advertisement are not able to play video

on a piece of paper.

Bulletin board used a lot of paper for advertisement and notice. It is very costly

for printing advertisement and notice especially in color. Some advertisement and no-

tices require larger paper to fit the content perfectly which will ends up occupy large

space of bulletin board.



2

1.2 Background and Motivation

Bulletin board nowadays has been widely used especially in school and work

place. It serves multiple purposes such as information from meeting announcements ,

displays of student work and displays advertisement. It is undeniable that bulletin board

will create such impact to a student because bulletin board will display best student

works which encourage student to perform well so that their work can be displayed on

bulletin board someday. Besides that, it does not only affect school but also applies in

work place. For example, the best worker of the month will be display in Mc Donald res-

taurant on a bulletin board which encourage their work to perform well during work

which leads to good service and leave good impression for the customers.

The design of bulletin board is important as it attract people to check out the

bulletin board. However, it requires people in charge to physically update the board to

make sure the bulletin board is not messy. Besides that, the content of the information

such as advertisement should be remove once the event date has passed. Frequently

updating bulletin board is a must so that the content in the notice board is up to date.

Therefore, having a system that can update the content in real time allows the bulletin

board looks convincing and content in the bulletin board is up to date which the bulletin

board is based on location.

The Mobile Geo-Based Bulletin Messaging system is a mobile application that

allows user such as students and lecturer ,to upload message which include notice, ad-

vertisement and simple text message to the augmented reality bulletin board based on

geographical location and images. The system will let the user register an account and

set up necessary profile details. Moreover, users are able to scan at an object (walls, im-

age code and etc) if the content in the camera matched image from database, then it

will display the content of bulletin board in the screen. In order to reduce the unneces-

sary scan, the application will show the surrounding image of object that has content.



3

1.3 Project Objectives

The main objective of this project is to allow student and lecturer to be able to

upload notice and advertisement in augmented reality view on a augmented reality bul-

letin board. This project is to aim that to be able to display content such as notices in

augmented reality forms which users is able to interact with the augmented reality dis-

play.

Furthermore, one of the objective of this project is to develop a system which

able to locate user geographical location in UTAR campus. This project aim to reduce

user effort of searching nearby event but instead the system will display nearby event

based on user location.

Lastly, this project also aim to develop a system that allows user to change the

content of the notice or advertisement from time to time after they have uploaded the

notice and advertisement. This project also aim to reduce user effort of physically up-

date notice and advertisement that they have already created.

1.4 Proposed Approach / Study

The propose approach is to solve the problems stated in problem statement which is to

build an AR mobile application using location service. The AR mobile application allow

user to create, view and register event in AR view. Events and notice will be display

based on user current location for markerless AR. For marker based AR, events and bul-

letin board will be display according to the registered marker.



4

1.5 Achievement Highlight

The system is now able to replace the work of a bulletin board. With geo-

location augmented reality bulletin messaging system, user now able to create multiple

of event and advertise their event through the system. Users need to fill up the event

details, upload images and then simply click create button so that every details will be

saved in database. This allows student or staff to reduce the cost and the effort of print-

ing multiple poster and place it in every bulletin board just to advertise their event. Be-

sides that, the system will now able to collect the data of users such as views for the ad-

vertisement, number of different gender, and participants who joined the event and

display in through the mobile application. Furthermore, the data collected will be dis-

played using graph.

Instead of displaying the event or notice in a image form, the system made it

much more interesting and interactive which it displays in augmented reality form. Be-

fore introduce the new feature, this system contain 2 types of augmented reality which

are marker based augmented reality and location based augmented reality. Basically

this system has one feature which is augmented reality camera and the function is to

display AR view and user is allow to switch AR mode (marker based AR and location

based AR). Location based augmented reality is to display the events based on the user

current location. Furthermore, the events within the distance set by user will be display

in augmented reality form. Besides that, the system made it more interactive such as

the events display are able to touch in order to display further description and register

the event as a participant. Once the user has registered, the data will be save in data-

base which is to owner of the event to see the number of participant purpose.



5

Furthermore, the marker based AR mainly is to display augmented reality using

marker such as event poster and room number. For event poster, user able to upload

event videos and slideshow. With the video or slideshow uploaded, user now able to

view the video as long as they uses the augmented reality camera to scan the poster.

The videos or slideshow will overlay on top of the poster to made it more interesting.

Besides that, user able to scan office number in order to show the details of staff such as

availability of the staff, notices left by staff and many more. All of the details is updated

by UTAR staff which all the datas are save in database in realtime.

Chapter 2: Literature Review


6

CHAPTER 2: LITERATURE REVIEW

2.1 Wallame

Figure 2.1.1 Wallame poster

Wallame is a augmented reality mobile application that leave an hidden aug-

mented reality message on the wall, or somewhere in a real place. This application

works in a way that user must take a picture of a wall or anything then is able to draw

freehand or add image on the wall. After that, users are able to share to public or the

their friends only. Since this application works based on location, users must turn on

their GPS in order to run this application.

Furthermore, if user receive an message from their friend, the users are able to

see their hidden augmented reality message once they have arrive the location where

their friend send them. Wallame application in released on 15th of August 2015 and it is

available on Android, and IOS platform.

Pro:

Provided drawing and painting tools

Shows public hidden message nearby

Able to share message to friend only and to public

Allow user to add image and stickers

Login option via Facebook , Google or email



7

Cons:

Does not allow to change the content of the message once upload

Does not have interactivity such as image cannot be clicked.

Show only one message at once at a same place with many messages

Suggested ways to improve:

Make the hidden message more interact able

Allow user to show all hidden message at once at a same place



8

2.2 Augment

Figure 2.2.1 Augment poster

Augment is an augmented reality mobile application that show a 3D object on a

view which mainly target housing hardware. This user allows user to interact with the

3D object that is display in augmented reality view and allow user to move, zoom in, ro-

tate and place the object at any view that user desire. Besides that, this application al-

low user to check or buy the object in reality such as a refrigerator in real life by just

clicking the real product link once user like the design of the object.

-

Figure 2.2.2 Augment 3D object design



9

Moreover, Augment application allows user to design their own 3D object in the

computer. Once the design is completed, user allow to upload the 3D object design

through browser with their account. After the 3D object is uploaded, then the users able

to load their 3D object in augmented reality view in their mobile and view it in anyway.

Pro:

Allow users to interact with the 3D object such as move, zoom, rotate and click event.

Allow users to design their own 3D object

Allow users to design the click event of the 3D object

Fast and user friendly

Able to scan other people 3D object

Allow user to navigate to the real product page and purchase

Able to print background as image code

Cons:

Login with Augment account only

Must pay before use the application

Upload 3D object only through computer

Have to download their software to design 3D object with click event

Only 3D animation or object can be uploaded

Suggested way to improve:

Make this application able to upload image and text as well

Provide a service to help users to design the 3D object

Provide a free account with lesser features for users



10

2.3 Layar

Figure 2.3.1 Layar Poster

Layar is an augmented reality and interactive mobile application that advertise

product by showing product information such as slide show, text, image, audio, and vid-

eo. This application is based on location where only information of the products that is

in user's country will be display in augmented reality form. In other words, image code

that is out of user's country won't be display. The augmented reality display can be in

interact such as image with url link, video with play pause button and slide show text

can be copy and paste.

Furthermore, Layar encourage interaction with links to share, follow and like the

content on various social media networks such as clicking augmented reality image. In

other hand, this application allows users to advertise their product more efficiently and

much more convenient. Layar application founded in the summer of year 2009.



11

Pro:

User friendly interface

Support image, video, slide show and audio

Allow user to interact with Augmented reality content

Login via Facebook or Layar account

Good performance

Free account

Cons:

Only product that is in the user's country will be displayed

does not support 3D object

User unable to upload their own product

Suggested way to improve:

Consider allowing user to upload their own product

Making every products displayable no matter user at which location



12

2.4 Comparison between existing systems

Table 2.1 – Comparison of features between Wallame, Augment and Layar

System

Function

Wallame Augment Layar

Use Current Location

AR Interactive

User friendly

Share AR view with friends

In-app purchase

View 3D object

Register account

Design model



13

Explanation of features

Table 2.2 – Explanation of features compared in Table 2.1

System

Function

Description

Use Current Location Uses GPS to determine user's location

AR Interactive User able to touch the content in the AR view

User friendly Interface design easy to use

Share AR view with

friends

Other users able to see current user's AR view content

In-app purchase Offer premium feature for a price

View 3D object Able to view 3D object which exclude 2D image

Register account Require to register in order to user the application

Design model Allow user to design their own AR content view



14

2.5 Vuforia

This augmented reality mobile application requires to track object in order to

display the augmented reality bulletin board. Vuforia will be used to implement in this

project as it provides a object tracking features such as real world object like a bulletin

board, chair, image and many others object. Moreover, Vuforia uses an algorithm to

track the object called Tracker Learning Detection Algorithm. By implementing Vuforia,

bulletin board image code can be track and display a registered augmented reality bulle-

tin board.

Figure 2.5.1 Tracker-Learning Detection Algorithm

In order to track the object as a marker, Vuforia uses Tracker Learning Detection

Algorithm in order to track physical world. It works in way that it detect the register

marker object in the camera view. Once it detect there is a register marker object in the

camera view, it will then track the object and display the augmented reality model on

the object.



15

2.6 Augmented Reality

Augmented Reality is a real scene viewed by user using camera with a virtual

scene created or design by computer that overlay the scene to the screen. Augmented

reality works in a way that it requires to design the virtual scene which can be 2D or 3D

and register it an object as targeted object so that when user scan the object it will dis-

play the virtual scene. In other words, augmented reality uses virtual scene to provide

information and able to let user a better understanding and interact with physical

world.

There are 2 types of augmented reality system which is Marker Based System

and Markerless System. Marker Based System uses real world object as a target for

computer in order to overlay the virtual scene on it. For example, the marker will be

printed on a piece of paper to let the computer interprets as symbols to overlay the vir-

tual scene on the screen. For Markerless System, it requires mobile device's compass to

determine the direction, location data to determine user geographical location, and ac-

celerometer. In other word, Markerless System will display the virtual scene on the

screen whenever user at a certain register place by comparing user's location data with

the database.

Chapter 3: System Design


16

Chapter 3 System Design

3.1.1 Use-Case Diagram

Figure 3.1.1 Use Case Diagram



17

3.1.2 System Flow Diagram

Figure 3.1.2 System Flow Diagram (Part 1)



18

Figure 3.1.3 System Flow Diagram (Part 2)



19

3.1.3 Entity Relationship Diagram

Figure 3.1.4 Entity Relational Diagram



20

3.2 Determine location using geo-location

Haversine formula:

a = sin²(Δφ/2) + cos φ1 ⋅ cos φ2 ⋅ sin²(Δλ/2)

c = 2 ⋅ atan2( √a, √(1−a) )

distance = earthRadius ⋅ c

This project uses Haversine formula to calculate distance between user current

location and location that is set in database in order to determine user location. Basical-

ly admin need to set location of faculty or blocks in UTAR as center point and maximum

distance to be set as radius. This way system is able to tell whether user has enter the

location.

Figure 3.2.1 Location Determination Diagram (Case 1)

Based on the figure above, it shows how system is able to determine user loca-

tion by using distance. First of all, admin to set geo location and maximum distance to

make sure the distance is able to cover the faculty or blocks. Once the geo location and

maximum distance is set, system will calculate distance between the location set by

admin and user current location. If the distance is shorter than maximum distance then

the user is within the area. For example, distance between point A to center point (loca-

tion set by admin) is shorter than maximum distance which means point A is in the area.



21

Conversely, distance value between point B and center point is bigger than maximum

distance value which means point B is out of the area.

Figure 3.2.2 Location Determination Diagram (Case 2)

Furthermore, there is one special case where there are user is within 2 loca-

tions. In this case, system will calculate distance between location of user (point x) and

location A and location B. Once distance is calculated, system will determine user loca-

tion by taking the shortest distance value. In this figure above, we can see that distance

A is bigger than distance B where user (point x) is within 2 locations. Therefore, system

will mark location B as user current location since distance B is the shortest.



22

3.3 Determine Direction using 2 locations

Formula to find Bearing

θ = atan2( sin Δλ ⋅ cos φ2 , cos φ1 ⋅ sin φ2 − sin φ1 ⋅ cos φ2 ⋅ cos Δλ )

This project also uses Bearing formula to determine the direction of nearby events

which is to calculate the angle between event and user location (convert into degree an-

gle,°). Basically this project shows nearby event which are within 5km from user loca-

tion. Using Haversine formula which stated in 3.2.4, the system are able to determine the

distance of user and events. Any event that is within 5km away from user will appear on

screen in Augmented Reality form. Then using the Bearing formula, the event poi will

then places in respective direction.

Figure 3.3.1 Determine Direction Diagram

Assuming camera icon represent user current location, the radius of the circle is

5km, and the green section is the view of the user. Based on the figure above, we can see

that there are 2 locations which are nearby to user which are location A and location B.

Using the bearing formula, system are able to determine that location A is actually 90° to

current location. Therefore, events at location A will be rotate 90° and place it in front of

camera shown in the figure. Besides that, we can see that location B is actually 285° to

user location. Therefore, the AR marker(events) will be place it 285° to user current loca-

tion which result user needs hold the camera device to physically turn 285° in order to

see the AR content.



23

Furthermore, we can see that location C is approximately 195° to current location

but because it is not within 5km, therefore the events at location C will not be displayed

on the camera view.

3.4 Markerless Augmented Reality Board Translation

Figure 3.4.1 Markerless Augmented Reality Board Translation

This mobile application supported both marker and markerless augmented reali-

ty. Markerless augmented reality in created by also using distance between 2 locations

which are original position (location when application first start) and current position

(when user moves). Besides that, this function is also require Gyroscope to make the AR

board static at one position. In order to make AR board get nearer or further to user as

the user walks towards the AR board, distance is needed to achieve that. By doing so,

system will get geo location of user when the Camera first started. Next is system will

constantly update user current location as users moves. Then system will calculate the

distance between original location and current location. Once the distance is calculated,

then system will translate the AR board nearer or further to user based on the distance.

By using figure above, first it capture original position of users. When users

moves, system will get current location and calculate the distance in which case we call

it distance A in the figure. After that, system will translate value of distance A of the AR

board nearer to user if the user walks towards to the board and further if user walk

away from the board.



24

Figure 3.4.2 Markerless Aug-

mented Reality Board Transla-



mented Reality Board Trans-

lation(Slightly Foward)


mented Reality Board Transla-

tion(Over Foward)

Based the screenshot above, we can see the figure shows that original position

of user and the AR board display in front of the user. As the user walk towards to the

board around 0.05 meter, the board will translate towards to the camera which is

shown in figure. In other words, the AR board will become bigger. Last figure shows the

user walk towards AR board around 1.3 meters which is walked too far and ended up

user is able to see back of the AR board when user turns the camera as this application

make use the Gyroscope in order to make the AR board static.

Chapter 4: Methodology and Tools


25


4.1 Phased Development Methodology

The methodologies that will be implemented for this project is Phased Develop-

ment. Phased Development approach is one of the System Development Life Cy-

cle(SDLC) approach. In other words, Phased Development gather to find user require-

ment in planning phased. It will then break system into a sets of version and every ver-

sion are built in logically and sequentially. In phased development, the most fundamen-

tal function will be built in the first version before proceeding the next version. Finally,

all the version developed will be tailored into one final version before presenting the

system.

Figure 4.1.1 Phased Development-based Methodology



26

4.1.1 General Work Procedure

Figure 4.1.2 General Work Procedure



27

Phased Development methodology consist of 5 phases. First phase is planning

phase where developer gather all the user requirement from user. Next will be analysis

phase which involve in identification and solution analysis. In other words, the develop-

er must then analyze the possible problem might face during development. Design

phase will involve in system design based on user requirement. Last will be implementa-

tion phase, when the actual development happens. In Phased Development, analysis ,

design, and implementation will be go repeatedly until the final version is complete.

The first analysis phase for the first version in this project will be gather all the

basic information about Firebase This application uses Unity to develop and it requires

some configuration to integrate Firebase with Unity. Next will be design phase for the

first version where it will determine the test data type for this augmented reality bulle-

tin messaging application. After that, developer will start coding for this application to

make sure application is able to add, update, delete data. Once the implementation is

completed, developer will proceed to next version.

Moreover, the second analysis phase for the second version in this project will

be gather other feature of the application. For example, this application not only display

and augmented reality bulletin board on the application but also user able to interact

with the augmented reality bulletin board so that user able to upload their notice and

advertisement on the augmented reality bulletin board. Design phase for the second

version is to ensure that system flow won't affect the next version and the quality of the

system flow. After that, implementation phase involve in adding new function for the

new features and reedit the previous version code if necessary. Finally, the next version

will be proceeded once the second version is complete.



28

For the third version of the analysis phase will be the application is able to de-

termine user location. In other words, system will display rooms in the specific faculty or

block based on user location. Design phase will be determine the data type and the sys-

tem flows. Implementation phase will be start program the new function and test the

whole system whether is meets the user needs. After third version is completed, the

system will be reviewed.

4.2 Tools to Use

Unity

A development software to design Augmented Reality object and debug the mobile ap-

plication

Vuforia

A framework to detect image target and display Augmented Reality object

MonoDevelop

An IDE to create and edit scripts using C#

Firebase

A non-SQL method use to add, update, remove and retrieve data from the hosted server

which is provided by Firebase

Visual Paradigm

Program used to document and organise ideas, processes, and system in diagram.

Visual Studio

An IDE to develop mobile application for this project using C#

Xamarin.Forms

A Microsoft framework to develop cross platform mobile application using C#

Phone To Use:

Model : Iphone 6

OS : IOS 11.4



29

Computer To Use:

Model: MacBook Pro 2016

OS: Mac OS High Sierra

Ram: 8GB

Graphic: Intel Iris Plus Graphic 640 1536MB

4.3 Requirement

4.3.1 Functional Requirement

Functionality:

1. View Markerless Augmented Reality Module

System shall be able to display events based on user location

2. View Marker Augmented Reality Module

System shall be able to display event promotional video on the poster marker

System shall be able to display notice board on the room number marker

3. Change AR mode module

User shall be able to switch AR mode to marker or markerless mode.

4. Register Event Module

User shall be able to register event as participant through the augmented reality

event poster.

5. Raycasting Module

System shall allow user to interact with the augmented reality 3D content.

6. Create Event module

User shall be able to create event and upload their poster.



30

4.3.2 Non-Functional Requirement

1. Operational Requirement

The system shall work perfectly on all IOS devices and Android devices

2. Usability

System shall provide a user friendly interface

3. Maintainability

The system shall be to made new changes without any problem

References


31

CHAPTER 5 Development Description

5.1 Implementation and Testing

Table 5.1.1 – Use Case Description for Register function

Use Case ID UC001

Feature F001 Register

Purpose To allow user to register an account

Actor Utar staff, student

Trigger User click “Register Now” button

Precondition System is connected to the internet

Scenario

name

Step Action

Main flow 1 User inserts valid student ID or staff ID.

2 User inserts new password.

3 User presses Register button.

4 System verifies the student ID or Staff ID.

5 Account is created and user is redirected to main menu.

Alternate

Flow(Invalid

ID)

1.1 User inserts valid student ID or staff ID.

1.2 Prompt error message “Please enter valid ID”

1.3 Goes back to step 1

References


32

Figure 5.1.1 Use Case testing for Register function invalid ID

References


33

Table 5.1.2 – Use Case Description for Login function

Use Case ID UC002

Feature F002 Login

Purpose To allow user to Login


Trigger User click “Login” button


Scenario name Step Action


2 User inserts password.

3 User presses Login button.

4 System verifies the student ID or Staff ID.

5 Account is authenticated and user is redirected to main menu.

Alternate Flow(Invalid ID)

1.1 User inserts valid student ID or staff ID.

1.2 Prompt error message “invalid ID or account is not exist”


Alternate Flow(Invalid password)

2.1 User inserts valid password

2.2 Prompt error message “Invalid password!”


References


34

Figure 5.1.2 Use Case testing for Login function invalid ID and Password

References


35

Table 5.1.3 – Use Case Description for Create Event function

Use Case ID UC003

Feature F003 Create Event

Purpose To allow user to advertise their event


Trigger User click “Create Event” on master detail panel




2 User click create event button

3 User Choose event picture as poster

4 User Fill in the details of the event.

5 User require to choose the location of the event

6 User click “Create Event” button

7 System will save the event poster to Cloud storage

8 System will save the details in Cloud database

Alternate Flow(Empty Picture)

3.1 User skip choosing event picture.

3.2 Prompt error message “Please insert a valid poster”


References


36

Figure 5.1.3 Use Case testing for Create Event function Empty Picture

References


37

Table 5.1.4 – Use Case Description for View Event advertisement List function

Use Case ID UC004

Feature F004 View event advertisement list

Purpose To allow user to view the list of event they have created


Trigger User choose “Home” option

Precondition • System is connected to the internet

• User creates event

Scenario name

Step Action

Main flow 1 User login with valid account

2 System verify user details

3 System retrieve user event history from Cloud database

4 System display the events in a list view

Alternate Flow(Empty List)

1.1 User does not have any event history

1.2 System display a label “Create event to view event details”

References


38

Figure 5.1.4 Use Case testing for View event advertisement list function empty list

References


39

Table 5.1.5 – Use Case Description for View Event details function

Use Case ID UC005

Feature F005 View Event details

Purpose To allow user to view the event details


Trigger User click on any event from the event list


User must have event history

Scenario name

Step Action

Main flow 1 User click on any event from event list

2 System retrieve the data from Cloud database

3 System navigate user to event details page

4 System display the event details

5 System compute the data and display the data using graph

Alternate Flow(Empty List)

1.1 User does not have any event

1.2 System display a label “Create event to view event details”

References


40

Figure 5.1.5 Use Case testing for View event Detail function

References


41

Table 5.1.6 – Use Case Description for View Markerless Augmented Reality Event adver-

tisement function

Use Case ID UC006

Feature F006 View Markerless Augmented Reality Event advertisement

Purpose To allow user to view nearest event using location based Augmented reality


Trigger User launch AR Camera


User enable location service

Scenario name

Step Action

Main flow 1 User click AR Camera option

2 System launch the AR camera application

3 System retrieve events based on user location from cloud database

4 System display the event

Alternate Flow(No AR Camera)

1.1 User does not have AR camera application

1.2 System display stay on same page

References


42

Figure 5.1.6 Use Case testing for View Markerless Augmented Reality Event adver-tisement function empty list

References


43

Table 5.1.7 – Use Case Description for See further details function

Use Case ID UC007

Feature F007 See further details

Purpose To allow user to view further description on the Augmented Reality Event


Trigger User click on any Augmented Reality event


User must enable location service

Scenario name

Step Action

Main flow

1 User click on any event from event list

2 System launch AR camera application

3 Systrem retrieve data from Cloud database

4 System display the Augmented Reality event

5 User click on any Augmented Reality event

6 System display event description in a panel below

Alternate Flow(No AR camera)



References


44

Figure 5.1.7 Use Case testing for See further details function

References


45

Table 5.1.8 – Use Case Description for Register Event function

Use Case ID UC008

Feature F008 Register Event

Purpose To allow user to register the event


Trigger User click on any event from the event and cluck register button

Precondition System is connected to the internet User must enable location service

Scenario name

Step Action





5 User click on any Augmented Reality event

6 System display event description in a panel below

7 User click on register button

8 System display register form

9 User fill in the form

10 User click submit button

11 System save the details into Cloud database




References


46

Figure 5.1.8 Use Case testing Register Event function

References


47

Table 5.1.9 – Use Case Description for View Marker Based Augmented Reality Notice Board

function

Use Case ID UC009

Feature F009 View Marker Based Augmented Reality Notice Board

Purpose To allow user to view event or notice board using registered marker


Trigger User click on any event from the event list







5 User click change AR mode button

6 User point camera to a registered marker

7 System overlay augmented reality content on top of the

marker




References


48

Figure 5.1.9 Use Case testing for View Marker Based Augmented Reality Notice Board

References


49

Table 5.1.10 – Use Case Description for Update Notice Board function

Use Case ID UC010

Feature F010 Update Notice Board

Purpose To allow Utar staff to view the event details

Actor Utar staff

Trigger User click on Notice Board option



Main flow 1 User click on Notice Board option

2 System retrieve Notice Board data from Cloud Database

3 System navigate user to Notice Board page

4 System display the Notice Board details

5 User edit Notice board details

6 User click Update button

5 System save details into Cloud Database

References


50

Figure 5.1.10 Use Case testing for Update Notice Board

References


51

Table 5.1.11 – Use Case Description for Log Out function

Use Case ID UC011

Feature F011 Log Out

Purpose To allow user to log out


Trigger User click on log out option


Scenario name

Step Action

Main flow 1 User click on log out option

2 System log out from current user account

3 System navigate back to login page

References


52

Figure 5.1.11 Use Case testing for Log Out

References


53

Chapter 6 Conclusion

This project aim to provide an interesting way of displaying notice and adver-

tisement in augmented reality form to student and UTAR staff. With the geographical

location feature, users are able to create any event and advertise it through the system.

Besides that, the system aim to create an augmented reality that allows user to interact

with it as not in a simple click and navigate to other page but click the augmented reality

object and change the content of the object which able to intrigue more users. There-

fore, the advertisement is not a typical image form of advertisement but rather a much

more interesting and interactive augmented reality 3D model. With this feature, it has

achieved the objective of this project which is provide an augmented reality platform for

user to create event advertisement.

With the geographical-location algorithm using Haversine formula, this applica-

tion is able to capture user indoor location. In other words, the system is able to tell

which faculty or block is the user at. With this feature, this application can notify or dis-

play any rooms or content related to the faculty or block based on user location. More-

over, this feature uses the distance between block geographical location and user cur-

rent geographical location and act as radius of the area. In which case, whenever the

distance is shorter calculated is shorter than the maximum distance then the system will

mark the user is within the area.

Using the same formula, this application is now supported both marker and

markerless augmented reality. This application make use of user geographical location

and gyroscope and make the augmented reality board static at one place and move the

board nearer or further to user as the user walks. It uses the distance calculated by Hav-

ersine formula based on user original position which is when user first initiate the cam-

era and user current position which is whenever users walks. Once distance is calculated

then the augmented reality board will move according to the distance calculated.

Furthermore, in order to show nearby events based on user current location,

Haversine formula is not enough to achieve the objective of this project which is the

show nearby event. One of the reason is because Haversine formula is to calculate the

distance between 2 locations where user can be at somewhere nearby multiple differ-

ent locations which has different event. Luckily, this project uses a formula to calculate

the Bearing of the 2 locations in order to determine the direction of multiple events.

With this function, user now able to turn their camera device and see which events is at

References


54

which direction. Of course, the nearby event must set a maximum distance which is set

by user in order to who events within the distance.

One of the feature cover in this project is that user not only able to touch on the

event augmented reality model, but users are also able to register the event through

the augmented reality view. All user have to is to touch on the augmented reality adver-

tisement model which it will shows the description of the event with a register button in

it. Click the register button and the application with prompt out a form to fill and the

details will then save in cloud database. Besides that, there is also a marker based aug-

mented reality which mention above. The marker based augmented reality covers also

event advertisement which user need to use their camera and point directly on the

event poster which then an 3D model (videos, slideshow, image) will overlay on top of

the poster.

As mention before, user able to register the event as participant through the

augmented reality view which will then save all the details in cloud database. The pur-

pose of saving this details in cloud database is because it is to record down participant

details under related event. With this feature, person who created the event will able to

see the number of participant who join their event. Besides that, the system will com-

pute the data into a graph such as number of different genders, numbers of different

course and age which allows person who created the event to plan to improve their

event for the future. Moreover, the system will also record down the number of views

of the event advertisement to indicate that whether their poster design is interesting

enough or the description provided such as the price is attractive enough for other user.

Once again, all of this data is to enable user to enhance their event.

About the marker based augmented reality, UTAR staff such as lecturer room will

be provided a marker which is their room number. Those marker is to display an aug-

mented reality board to indicate the lecturer availability, notices left by lecturer and any

messages. In other word, all user need to do is to point their camera device at the lec-

turer room number and the augmented reality board will display on the phone. The de-

tails of the augmented reality board will be updated by lecturers themselves.

References


55

Throughout the project, the project has encounter some minor problems too.

This project has face some issues including accuracy of the GPS positioning when user is

at indoor or has many obstacle around them. The translation of the augmented reality

will translate quick far away due to the inaccuracy location detection especially when

user is in the building, the geo-location capture by GPS is not that accurate which is 5

meters different for best case scenario. On top of that, one of the problem is that this

project uses free version of Unity IDE to develop the system which means there are

some feature that are unable to achieve such as download an 3D model, upload marker.

In other words, there are a lot of space of improvement can be made in this project. In

order to allow user customise their own marker and display content such as 3D anima-

tion , then this project will have to subscribe to Unity IDE to go for premium version to

unlock some of the major features to achieve those feature.

In conclusion, Mobile Geo-Based Bulletin Messaging System is able to make

event advertisement in a more interactive and intriguing. Besides that, it allows to re-

duce the effort of printing multiple of posters and physically stick it at different bulletin

board at different places which is time consuming and costly. Instead of doing all those,

user can now use the system to create event and advertise at different location. Fur-

thermore, participant can now register themselves as participant of the event through

their mobile device which is much more convenient. Mobile Geo-Based Bulletin Messag-

ing System comes with the feature where it can compute data into graph for analysis

purpose which typical physical poster and register form unable to do it. Furthermore,

instead of sticking notice at lecturer room which makes the door look messy, this system

display it in augmented reality view which is has more interactive in it. Moreover, typi-

cal advertisement and notice uses papers and will be replace by another piece of paper

if there is an update. Therefore, this system save all the datas in cloud realtime database

which in result saves a lot of papers usage.

References


56

References

LaTerra ,W. (2012). POSITIVE CLASSROOM ENVIRONMENTS = POSITIVE ACADEMIC RE-

SULTS. [Online] Available at: http://files.eric.ed.gov/fulltext/ED536465.pdf

[Accessed 11 Aug 2017]

Elizabeth, P. (n.d). Teachers Study the Use of Bulletin Board. [Online] Available at:

http://www.ascd.org/ASCD/pdf/journals/ed_lead/el_195903_parker.pdf


Wallame (n.d). Hide message in the real world. [Online] Available at : http://walla.me/


University of EXETER. (n.d). What is Augmented Reality. [Online] Available at :

http://blogs.exeter.ac.uk/augmentedreality/files/2011/07/University-of-Exeter-What-is-

AR-Factsheet.pdf


Augment. (n.d). Bring the physical presence to online shopping. [Online] Available at:

http://www.augment.com/


Layar. (n.d). EASILY CREATE YOUR OWN INTERACTIVE AUGMENTED REALITY EXPERI-

ENCE. [Online] Available at: https://www.layar.com/

[Accessed 12Aug 2017]

Wendy E, W. (n.d). Augmented Reality: Linking real and virtual worlds A new paradigm

for interacting with computers. [Online] Available at:

https://www.lri.fr/~mackay/pdffiles/AVI98.AugmentedReality.pdf

http://files.eric.ed.gov/fulltext/ED536465.pdf

http://www.ascd.org/ASCD/pdf/journals/ed_lead/el_195903_parker.pdf

http://walla.me/

http://blogs.exeter.ac.uk/augmentedreality/files/2011/07/University-of-Exeter-What-is-AR-Factsheet.pdf

http://blogs.exeter.ac.uk/augmentedreality/files/2011/07/University-of-Exeter-What-is-AR-Factsheet.pdf

http://www.augment.com/

https://www.layar.com/

https://www.lri.fr/~mackay/pdffiles/AVI98.AugmentedReality.pdf

References


57


Roman, P (2012). Robust Object Tracking Based on Tracking-Learning-Detection.

[Online] Available at : http://www.caa.tuwien.ac.at/cvl/wp-

content/uploads/2015/12/thesis.pdf


Rupesh K, R (2013). A Survey on Object Detection and Tracking Algorithms. [Online]

Available at : http://ethesis.nitrkl.ac.in/4836/1/211CS1049.pdf


Zdenek ,K .(2010). Tracking-Learning-Detection. [Online] Available at:

http://kahlan.eps.surrey.ac.uk/featurespace/tld/Publications/2011_tpami


Tech-Faq. (n.d). SDLC Methodology. [online] Available at : http://www.tech-

faq.com/sdlc-methodology.html


Unity3D, (n.d). Company fact. [Online] Available at: https://unity3d.com/public-

relations


Stack Overflow(n.d). Is Android Studio better than Unity3d for augmented reality

apps?[Online] Available at:

https://stackoverflow.com/questions/33571663/is-android-studio-

better-than-unity3d-for-augmented-reality-apps


http://www.caa.tuwien.ac.at/cvl/wp-content/uploads/2015/12/thesis.pdf

http://www.caa.tuwien.ac.at/cvl/wp-content/uploads/2015/12/thesis.pdf

http://ethesis.nitrkl.ac.in/4836/1/211CS1049.pdf

http://kahlan.eps.surrey.ac.uk/featurespace/tld/Publications/2011_tpami

http://www.tech-faq.com/sdlc-methodology.html

http://www.tech-faq.com/sdlc-methodology.html

https://unity3d.com/public-relations

https://unity3d.com/public-relations

https://stackoverflow.com/questions/33571663/is-android-studio-better-than-unity3d-for-augmented-reality-apps




References


58

Xamarin (n.d). Microsoft and Xamarin Partner Globally to Enable Microsoft Develop-

ers to Develop Native iOS and Android Apps With C# and Visual Studio. [Online] Avail-

able at: https://www.xamarin.com/pr/microsoft-global-collaboration


TechTarget (n.d). What is Microsoft SQL server. [Online] Available at:

http://searchsqlserver.techtarget.com/definition/SQL-Server


https://www.xamarin.com/pr/microsoft-global-collaboration

http://searchsqlserver.techtarget.com/definition/SQL-Server

Appendices


A

APPENDIX A: Poster of Mobile Geo-Based Bulletin Messaging System

Appendices


B

APPENDIX B: SCREENSHOT OF UI DESIGN

Appendices


C

Appendices


D

Appendices


E

Appendices


F

Appendices


G

APPENDIX C: Turnitin Plagiarism Check Summary and Result

Appendices


H

Appendices


I

UNIVERSITI TUNKU ABDUL RAHMAN

FACULTY OF INFORMATION & COMMUNICATION TECH-

NOLOGY (KAMPAR CAMPUS)

CHECKLIST FOR FYP2 THESIS SUBMISSION

Student Id

Student Name

Supervisor Name

TICK

(√)

DOCUMENT ITEMS Your report must include all the items below. Put a tick on the left column after you have checked

your report with respect to the corresponding item.

Front Cover

Signed Report Status Declaration Form

Title Page

Signed form of the Declaration of Originality

Acknowledgement

Abstract

Table of Contents

List of Figures (if applicable)

List of Tables (if applicable)

List of Symbols (if applicable)

List of Abbreviations (if applicable)

Chapters / Content

Bibliography (or References)

All references in bibliography are cited in the thesis, especially in the chapter of

literature review

Appendices (if applicable)

Poster

Signed Turnitin Report (Plagiarism Check Result - Form Number: FM-IAD-005)

I, the author, have checked and confirmed

all the items listed in the table are included

in my report.

______________________

(Signature of Student)

Date:

Supervisor verification. Report with incor-

rect format can get 5 mark (1 grade) reduc-

tion.

______________________

(Signature of Supervisor)

Date:

Appendices


J

Documents

Mobile Geo-Based Bulletin Messaging Systemeprints.utar.edu.my/3044/1/fyp_CS_2018_LBJW_-_1504431.pdf · BCS (HONS) COMPUTER SCIENCE Faculty of Information and Communication Technology