AR NATIONAL FLAGS USING AUGMENTED REALITY MUHAMMAD FARIS BIN SHAFEE BACHELOR OF INFORMATION TECHNOLOGY (INFORMATICS MEDIA) WITH HONOURS UNIVERSITI SULTAN ZAINAL ABIDIN, TERENGGANU, MALAYSIA JANUARY 2020
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
AR NATIONAL FLAGS
USING AUGMENTED REALITY
MUHAMMAD FARIS BIN SHAFEE
BACHELOR OF INFORMATION TECHNOLOGY (INFORMATICS MEDIA) WITH
HONOURS
UNIVERSITI SULTAN ZAINAL ABIDIN, TERENGGANU, MALAYSIA
JANUARY 2020
i
DECLARATION
I hereby declare that this report is based on my original work except for quotation and citations,
which have been duly acknowledged. I also declare that it has not been previously or
concurrently submitted for any other degree at University Sultan Zainal Abidin or other
institution.
NAME: MUHAMMAD FARIS BIN SHAFEE
DATE: 02 JANUARY 2020
ii
CONFIRMATION
This is to confirm that:
The research conducted and the writing of this report was under my supervision.
_______________________________________
NAME: DATIN DR. AZIM ZALIHA BINTI
ABD AZIZ
DATE: 02 JANUARY 2020
iii
DEDICATION
I would like to dedicate my project to my beloved mother and father, who have taught
me to be patient and never give up in everything that we did and always told me to be a
hardworking person in every task we did. I would also like to dedicate this to my friends who
have inspired me and give me opinion and motivation to finish this project. Not forget to my
supervisor, Datin Dr. Azim Zaliha Binti Abd Aziz and my fellow friends from Bachelor of
Information Technology (Informatic Media) who have help me through a lot in my journey to
finish this project.
iv
ABSTRACT
Nowadays, the use of technology is increasing and expanding in human life. It has
expanded into many fields including educational, doctoral and others. The technology used in
education especially in early education for children is to add more knowledge and help
educators to teach more effectively. However, many of school still lacks of the learning aid
tool that help student in their studies. Thus, learning become boring and difficult. Furthermore,
there are still children who abuse the existing technology and cause their time wasted at home
with unfortunate benefits. Therefore, with the appearance of AR National Flags Using
Augmented Reality, these children can use technology properly. Additionally, this interactive
flashcard also provides an opportunity for these children to interact with technology in
exploring about the national flags around the world. The objective of this project was to provide
an effective learning aid tool for student besides providing opportunities for these children to
study and use AR (Augmented Reality) technology in their early age. In addition, this project
can also benefit parents and teachers in teaching children more effectively. A variety of
multimedia elements are provided in this AR Application with the aim of attracting children to
learning and explore. In conclusion, this project can help children gain the knowledge about
national flags around the world.
v
ABSTRAK
Pada masa kini, penggunaan teknologi semakin meningkat dan berkembang dalam
kehidupan manusia. Penggunaan teknologi telah berkembang menjadi banyak bidang
termasuk pendidikan, doktoral dan lain-lain. Teknologi yang digunakan dalam pendidikan
terutamanya dalam pendidikan awal untuk kanak-kanak adalah menambah pengetahuan dan
membantu pendidik mengajar dengan lebih berkesan. Walau bagaimanapun, banyak sekolah
masih kurang alat bantuan pembelajaran yang membantu pelajar dalam pengajian mereka.
Oleh itu, pembelajaran menjadi membosankan dan sukar. Oleh itu, dengan kemunculan AR
Bendera Kebangsaan (National Flags) Menggunakan Realiti Terimbuh, kanak-kanak ini boleh
menggunakan teknologi dengan betul. Di samping itu, flashcard interaktif ini juga memberi
peluang kepada kanak-kanak ini untuk berinteraksi dengan teknologi dalam meneroka
bendara kebangsaan diseluruh dunia. Objektif projek ini adalah untuk menyediakan alat
bantuan pembelajaran yang berkesan untuk pelajar selain menyediakan peluang untuk kanak-
kanak ini mempelajari dan menggunakan teknologi AR (Augmented Reality) pada usia muda
mereka. Di samping itu, projek ini juga dapat memberi manfaat kepada ibu bapa dan guru
dalam mengajar kanak-kanak dengan lebih berkesan. Pelbagai unsur multimedia disediakan
dalam Aplikasi AR ini dengan tujuan menarik kanak-kanak untuk belajar. Kesimpulannya,
vi
projek ini dapat membantu kanak-kanak belajar dengan lebih berkesan dalam menerokai dan
mengetahui bendera kebangsaan diseluruh dunia.
vii
CONTENTS
DECLARATION i
CONFIRMATION ii
DEDICATION iii
ABSTRACT iv
ABSTRAK v-vi
CONTENTS vii-xi
LIST OF TABLES xi
LIST OF FIGURES xii
LIST OF ABBREVIATION xiii
LIST OF APPENDICES xiv
Pages
viii
CHAPTER I INTRODUCTION
1.0 Introduction 1-2
1.1 Background 2
1.2 Problement Statement 3
1.3 Objectives 3
1.4 Scopes 4
1.5 Limitation of work 5
1.6 Expected Result 6
1.7 Activities, Milestones (Gantt Chart) 7
ix
CHAPTER II LITERATURE REVIEW
2.0 Introduction 8
2.1 Explanation Technology Timeline / Research 9-13
2.2 Related Techniques 14
2.2.1 Marker-based 14-15
2.2.2 Markerless 15-16
2.3 Related Product 17
2.3.1 AR Flag 17
2.3.2 Flag of India AR 18
2.3.3 Flag of The Worlds 19
2.3.4 AR Flashcards Animal Alphabet 20
2.4 Comparison table of the existing products with 5 elements of
multimedia
21
2.5 Summary 22
CHAPTER III METHODOLOGY
3.0 Introduction 23
3.1 Methodology Model 24
3.1.1 Analysis 25
3.1.2 Design 25
3.1.3 Development 26
3.1.4 Implementation 26
3.1.5 Evaluation 26
3.2 Hardware and Software Requirements 27
x
3.2.1 Hardware requirement 27
3.2.2 Software requirement 28
3.3 Development Methodology 29
3.3.1 Analysis Phase 29-31
3.3.2 Design Phase 32
3.3.2.1 Conceptual Model 33
3.3.2.2 Flowchart 34
3.3.2.3 Storyboard 36
3.3.2.3.1 Home page 36
3.3.2.3.2 Select Continent Page 37
3.3.2.3.3 Credit page 37
3.3.3 Development Phase 38
i. Create Marker 39
ii. Modelling 3D 40
iii. Texturing 3D 41
iv. Randering 42
v. Create Marker Using Vuforia 43
vi. Building environment AR Using 3D Unity 44
3.3.4 Implement Phase 44
3.3.4.1 Test Run Project 45
3.3.4.2 User Test Run 45
3.3.5 Evaluation Phase 45
3.3.5.1 Debug 45
3.3.5.2 Final Product 46
3.4 Framework Design 46
xi
3.5 Summary 47
LIST OF TABLES
TABLE TITTLE
PAGE
1.1 Gantt Chart 7
2.1 Comparison table of the existing products with 5 elements
of multimedia
21
xii
LIST OF FIGURES
FIGURE TITLE PAGE
2.1 Marker-based 14
2.2 Markerless 15
2.3 AR Flags 17
2.4 Flag of India AR 18
2.5 Flag of The Worlds 19
2.6 AR Flashcards Animal Alphabet 20
3.1 ADDIE Model 24
3.2 Content of Flashcards Pictures AR 30
3.3
3.4
3.5
Analysis Phases
Conceptual Model of The Application AR
Flowchart of Flashcards Pictures AR
31
33
35
3.6
3.7
3.8
Home page
Select Continent Page
Credit
36
36
37
3.9 Create Marker 39
3.10 Modelling 3D 40
3.11 Texturing 3D 41
3.12 Rendering 42
3.13 Create marker using Vuforia 43
3.14 Unity 3D Software 44
3.15 Framework Design 46
xiii
LIST OF ABBREVIATIONS/TERMS/SYMBOLS
AR Argumented Reality
3D Three dimensional
FYP Final year project
xiv
LIST OF APPENDICES
APPENDIX TITTLE
PAGE
A Appendix -
B Appendix -
C Appendix -
D Appendix -
1
CHAPTER I
INTRODUCTION
1.0 Introduction
Children nowadays are not expose to the knowledge about national flag around
the world. Most of them did not have any interest to learn more about national
flags as there are no interesting factors. Another factor is the teachers are still
comfortable using traditional methods of teaching learning in the classroom.
Therefore, augmented reality (AR) is one of the supporting system methods that
could help to enhance the children’s interest in learning particularly about
national flags around the world.Augmented Reality (AR) is a type of interactive,
reality-based display environment that takes the capabilities of computer-
generated display, sound, text and effects to enhance the user’s real-world
experience. Augmented reality combines real and computer-based scenes and
images to deliver a unified but enhanced view of the world. Augmented reality
has many different implementation models and applications, but its primary
2
objective is to provide a rich audiovisual experience. AR works by employing
computerized simulation and techniques such as image and speech recognition,
animation, head-mounted and hand-held devices and powered display
environments to add a virtual display on top of real images and surroundings.
1.1 Project Background
Flashcard is a card that have words, numbers or pictures and these are used to
help children in learning about the subject. Augment reality (AR) flashcards are
a new way to interact with children’s and preschoolers in exciting environment.
When a mobile device is pointed at the printed flashcard, a beautifully rendered
3D flags will pop up on the screen. Since traditional learning method is found
to be less interactive, additional tools should be included in order to increase
children’s attention.
The flash card contains illustrative objects with words which could help the
mind’s developinent of the children in recognizing AR National Flags
appropriately. This flash card is believed to be suitable for kindergarten and
primary school level. This augmented reality application only focus on the
knowledge about national flags including their national anthem.
In this project, the application is developed using the AR technology in the flash
card. The flash cards contain image of several national flags of countries that
have been randomly chosen. To the best knowledge of the author, there are no
augment reality (AR) learning about national flags available in the world. In this
proposed project, augment reality (AR) is used to achieve this goal.
3
1.2 Problem Statement
Currently, children have less interest to learn and explore the national flags
around the world. This happens when teaching and learning method during
kindergarten and primary school is limited and traditionally delivered to the
children. Despite traditionally classroom, massive development of technology
has driven those children towards screen-based learning method. Therefore,
augmented reality (AR) is seen as one of the tools that could help to enhance the
children’s interest.
1.3 Objective
The objective of AR National Flags are:
i. To design AR National Flags and makes learning materials more fun by
using Augmented Reality (AR).
ii. To develop flash card and mobile application that enable users to learn
with augmented reality technology and also 3D model.
iii. To evaluate the functionalities of augmented reality of National Flags.
4
1.4 Scopes
The scope is divided into two, which are target user and system application. For
the target user, everyone who is interested in AR can used it but more focus to
kindergarten and primary school especially to the kids between 3-10 years old.
Reason to set the age range until 10 years old is because the content develop in
this project are simple, there could have higher level of content for children
above the age range.
As in system application, only five nation of each five continent is randomly
chosen. This application only focuses on mobile device. The chosen flag is
shown in 3D virtual graphical image. National anthem is included as the
background of music while user is displayed with the flag’s detail. For instance,
meaning of each colors and symbols in each flag will be explained as general
knowledge to the children.
5
1.5 Limitation of work
There are several limitations and constraint that occurred throughout the
development of this flash card picture. These problems and limitations in
conducting this study are:
i. Platform using android only (Android Oreo 8 Above).
ii. Marker based technique using augmented reality (AR).
iii. The users need a smartphone to start playing the augmented reality.
6
1.6 Expected Result
The expected result following the development of the proposed project are
follows:
i. By using the Application, This AR National Flags apps can be used at
any angle.
ii. This AR National Flags Also have National Anthem
iii. This AR National Flags will cover five continent and the five countries
of each continent.
iv. This AR National Flags also will help children to gain knowledge about
the flags.
v. The application is expected to be implemented in mobile based
environment where user is able to explore this application using
technique marker of augment reality (AR).
vi. This application can give new experience to the children in exploring
flag’s around the world by using augmented reality (AR) technique.
7
1.7 Gantt Chart
Table 1.1 Show Gantt Chart
Week
Activity
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
Topic discussion and
determination
Project Title proposal
Proposal writing Introduction
Proposal writing Literature
Review
Proposal progress
presentation & evaluation
Discussion correction proposal
& proposed solution
methodology
Proposal solution
Methodology
Proposal solution &
methodology (continue)
Proof of concept
Drafting report of the
proposal
Submit draft of report to
supervisor
Seminar presentation (final)
Correction report
Final report submission
8
CHAPTER 2
LITERATURE REVIEW
2.0 Introduction
In the literature review, the future of the AR National Flags application will be
discussed, which includes the description and previous research of the application issue
contrasting the current applications and the solution method used by applications.
9
2.1 Explanation Technology Timeline / Research
2.1.1 The Current Trends of Augmented Reality in Early Childhood Education.
Augmented reality is a variation of virtual environments or virtual reality as it
is more commonly called. It can be defined as a system that allows real and
virtual objects to coexist in the same space and be interact in real time. This
technology has been widely used especially in medical, training, military,
advertising, and entertainment. In these recent few years, augmented reality
gains a lot of attention among researchers in educational field due to its great
features and advantages in enhancing teaching and learning. The features of the
technology which according to Wu et al, 2012, enables students to learn content
in 3D perspectives, ubiquitous, collaborative and situated learning, learners’
senses of presence, immediacy and immersion, visualizing the invisible and
bridging formal and informal learning. By having these features, augmented
reality has created a new way of learning, and making learning experience
become more fun and engaging.
10
2.1.2 Mobile Augmented Reality
Augmented reality (AR) as an emerging technology in the mobile computing
domain is becoming mature enough to engender publicly available applications
for end users. Various commercial applications have recently been emerging in
the mobile consumer domain at an increasing pace. According to the Tobias H.
Höllerer Steven K. Feiner ,2004, The technique used is the Mobile AR
application. The advantages are augmented reality (AR) and wearable
computing are rapidly growing fields, as exemplified by the soaring number of
research contributions and commercial developments since the mid-1990s and
the disadvantages is it will take more time for mobile augmented reality (AR)
to reach the computing mainstream.
11
2.1.3 Marker Based Augmented Reality
A marker is a piece of paper with black and white markings. This is used to
display the augmented object on your mobile phone’s screen. Marker-based
augmented reality uses a camera and a visual marker which determines the
centre and range of its spherical coordinate system. Once the marker is present
one can view augmented objects. The author Anuroop Katiyar, Karan Kalra
and Chetan Garg, 2015, says, the technique used is augmented reality and
mobile augmented reality. The advantages of Marker Based Augmented Reality
is the result is that an image can be viewed, even live, on a screen and digital
assets are placed into the scene at the location of the markers and for the
disadvantages is limitations on the types of augmented reality markers that can
be used are based on the software that recognizes them.
12
2.1.4 Marker Based Augmented Reality Using Android
Augmented Reality or AR is an emerging technology in which one’s perception
of the Realtime environment is enhanced by superimposing computer-generated
information such as graphical, textual, or audio content, as well as objects onto
a display screen. The proposed application is an android mobile based
application which will be compatible with all the existing and upcoming
versions of the operating system. The idea is to allow the user to view the virtual
object in the real world using a marker-based Augmented reality system. Based
on article Mr. Raviraj S. Patkar, Mr. S. Pratap Singh and Ms. Swati V. Birje,
2013. The author also refers to the technique used such as augmented reality,
Android, marker, and operating system. For the advantages of marker based
augmented reality using Android are low cost devices as compared to the costly
head mounted display devices and user don’t need not buy product and then see
how it will suit with environment. For the disadvantages is marker based
augmented reality using Android usually have low screen dimensions and
resolution.
13
2.1.5 Scaffolding A Conceptual Support for Personalized Arabic Vocabulary
Learning Using Augmented Reality (AR) Enhanced Flashcards.
According to Zainuddin, N., Sahrir, M. S., Idrus, R. M., and Jaafar, M. N, 2016,
Technology Enhanced Learning (TEL) research has increasingly focused on
emergent technologies such as Augmented Reality (AR), game and mobile to
improve self-motivation and self-engagement of the learners in an appealing
hybrid learning environment. This paper describes the development process of
an augmented reality (AR) enhanced flashcards for non-native students of
University Sains Islam Malaysia (USIM) in scaffolding the memorization and
retention of basic Arabic vocabulary through the inclusion of personalized
learning using an application known as Aurasma. The study involved 24
elementary-level students in USIM and data collection was conducted by
observing the students’ response and understanding in using the AR enhanced
flashcards for personalized Arabic vocabulary learning. Findings indicated that
the AR enhanced flashcards help in scaffolding the knowledge regarding the
Arabic vocabulary learning. Furthermore, the findings showed that the AR
enhanced flashcards facilitate the process of Arabic vocabulary personalized
learning. The study showed that the augmented reality could be considered as
one of the personalized learning platforms that can be used to help students in
memorizing certain information and maintained their knowledge of Arabic
vocabulary, and creating novel sentences by using the target vocabularies more
than half of the time.
14
2.2 Related Techniques
Related techniques refer techniques of Augmented Reality already existing and used
until now. This is example of techniques:
2.2.1 Marker-based
Based on the figure 2.1 below, image recognition is an imperative component of
augmented reality systems. By use of identifying visual markers already embedded
within the system, physical world objects are detected for superimposition of virtual
elements.
Figure 2.1 Marker-based
The marker tracking allows the use of a digital image to identify optical squares or
markers and gauge their relative orientation to the camera itself. The optical square
marker usually consists of a black square within a white box of a predefined size. It is
the black square which is encoded with the ID of the marker. A variety of techniques is
used which decode the marker by cross-matching with it.
15
Once you begin using the marker-based augmented reality system with a digital device,
the image of the physical world captured by your camera is converted into a grayscale
image to expedite the image processing algorithm. The algorithm then uses the image
of the camera as well as the decoded marker ID to augment the virtual object onto the
physical world model. By focusing the camera of whichever digital device, you are
using to deploy the augmented reality app on the specified markers, the app is able to
retrieve the information stored to display the three-dimensional virtual object
accurately.
2.2.2 Markerless
Based on figure 2.2 below, The advances in the mobile hardware and software technologies
led to the recent introduction of markerless augmented reality.
Figure 2.2 Markerless
This approach eliminated the need for 3D object tracking systems, overcoming the
interactivity limitations marker-based augmented reality placed on the range of images
encapsulated within the markers. Markerless augmented reality technique allows the use of
any and all parts of the physical environment as the target or base for the placement of
16
superimposed virtual objects. Markerless AR depends on the natural features of a surrounding
rather than the fiducial identifying markers.
What’s more, some markerless systems have the ability to extract and store information and
characteristics about the environments they are used on for later usage. When used in
smartphones and other digital devices, the markerless AR system typically makes use of the
GPS feature in-built in the device in order to locate and interact with the available augmented
reality resources.
17
2.3 Related Product
2.3.1 AR Flag (in Android Play Store)
The AR Flag was developed by Munfarid. AR Flag is augmented reality (AR) allowing
the user to place a virtual flag anywhere. This AR flag only focus on two national flag
such as UAE And Bahrain and it also have multimedia element such as animation in
this application. The platform used is marker less and android devices. For the
disadvantages, this AR Flags complicated to use because user need to look up phone
on top to display this AR and there is no sound.
Figure 2.3 AR Flag
18
2.3.2 Flag of India AR (in Android Play store)
The Flag of India AR was developed by VisionAugma Pvt Ltd. This augmented reality
flag only have one national country that is India. To use this augmented reality
application, just open the application and focus on paper or image of the flag. After
that, the flag flying on top of the print with a video of the India’s first republic day
celebration will be pop up. Second function is when the user focuses the camera on
paper printout, animated flag will appear when focused on the paper printout and video
will play on printout. The platform used is Marker based and for and Android devices.
Figure 2.4 Flag of India AR
19
2.3.3 Flag of The Worlds (in Android Play store).
The Flag of the worlds was developed by Funanduseful.com. This application is not an
augmented reality application but more to education quiz of children learning on
memorizing about flags. This application has 195 capital of country flags. This
application also makes children to learn about world geography from world map and
flags. The platform used is mobile device and problem that found is this application
doesn’t have augmented at all.
Figure 2.5 Flag of the worlds
20
2.3.4 AR Flashcards Animal Alphabet
AR Flashcards Animal Alphabet developed by Peak Reality, LLC. AR Flashcards are
a new way to interact and make Flashcards more entertaining for children and
preschoolers. With AR Flashcards, learning the Alphabet will be fun. When you point
your device at the printed flashcard a beautifully rendered 3D animal will pop up on
the screen. Tap the animal to hear the letter and animal name. The platform used is
Marker based and for IOS and Android devices.
Figure 2.6 AR Flashcards Animal Alphabet
21
2.4 Comparison table of the existing products with 5 elements of multimedia
The Table 2.2 below describes about comparison of the existing product with 5 element
of multimedia such as Text, Image, Video, Audio and Animation. This table we will
know comparison each of product.
Product Text Image Video Audio Animation
AR Flags
✓ ✓
Flag of
India AR
✓ ✓
Flag of The
Worlds
✓ ✓ ✓
AR
Flashcards
Animal
Alphabet
✓ ✓ ✓ ✓
Table 2.1 Comparison table of the existing products with 5 elements of multimedia
22
2.5 Summary
In this whole chapter, this chapter discusses a product for flags learning to develop an
augmented reality. This chapter also discussed the technique used in the new system
and the technique used in the previous research articles and journal. The comparison
with the previous research is done so that the right choice will be selected.
23
CHAPTER 3
METHODOLOGY
3.0 Introduction
This chapter will describe the methodology concept in application development. It will
explain step by step on developing the application and how to develop it. For the AR
National Flags, it will be following by step that has been designed from start until finish
and we using ADDIE method.
ADDIE is an acronym for the five stages of a development process that stand from
Analysis, Design, Development, Implementation, and Evaluation. The ADDIE model
relies on each stage being done in the given order but with a focus on reflection and
iteration. The model gives streamlined, focused approach that provides feedback for
continuous improvement.
24
3.1 Methodology Model
The model that will be used in this system is ADDIE model. The ADDIE model is
important to understand if a developer want to develop a successful project. The
ADDIE model has five phase which is to Analysis, Design, Development,
Implementation, and Evaluation. ADDIE is an extremely effective tool in training
development that addresses instruction. Most employees have a significant amount of
information to learn in order to become more proficient at their jobs. Therefore, the
ADDIE model should might be helpful for many in planning a course of action that
would lead to the successful implementation of a project. When dealing with projects
that involve instruction or steps, the approach fits nicely. In order to ensure effective
learning outcomes from augmented reality (AR) education development, careful
planning is required before the development process begins. ADDIE Instructional
Design Model is used in this mobile augmented reality (AR) application development
methodology. The ADDIE model for instructional system design (ISD) is a basic model
that can be applied to any kind of learning solution. The ADDIE model has five steps
processes which is analysis, design, development, implementation, and evaluation.
Figure 3.1 ADDIE Model
25
3.1.1 Analysis
Analysis is a detailed examination of anything complex in order to understand its nature
or to determine its essential features from a thorough study. Before start developing any
content or training strategies, developer must analyse the current situation in terms of
training, knowledge gaps and etc. First, start with questions to understand the current
situation and to also understand what is the goal. One very common question is: What
is problem statement? find problem that they have and face. Then develop the apps to
solve problems and adds the advantages of the function to be better and more attractive.
Then find Software and hardware requirement used to develop the applications.
3.1.2 Design Phases
The Design phase involves using the outputs from the Analyse phase to plan a strategy
for developing the instruction. During this phase, designer must outline how to reach
the instructional goals determined during the Analyse phase and expand the
instructional foundation. Some of the elements of the design phase may include writing
a target population description, conducting learning analysis, writing objectives and test
items, selecting a delivery system, and sequencing the instruction. The outputs of the
Design phase will be the inputs for the develop phase.
26
3.1.3 Development
Development is the act, process, or result of developing after designing the prototype.
Each element of the course should be developed to match the design phase. To develop
the AR National Flags application, developer must know how to use Autodesk Maya,
Unity and other software that used. Then it must have the element of multimedia like
animation and multimedia component like audio, 3D Animation, and etc.
3.1.4 Implementation
Implementation is an act or instance of implementing something like the process of
making something active or effective. Once you have completed and you are satisfied
that are fully tested, it’s time to deploy prototype of AR National Flags application to
the general public that this AR National Flags application exists. The decisions made
in the design phase will influence how this is actually carried out.
3.1.5 Evaluation
Evaluation is the act or result of evaluating. Getting feedback on every aspect like test
functionalities of developing prototype on AR National Flags application is really
important so that can improve and revise the content. A great way to get feedback is to
ask someone to complete surveys at the end of their course. Create questions specific
to the points above but, also encourage people to give feedback in a free text box so
that you are aware of any gaps you may not have thought of.
27
3.2 Hardware and Software Requirements
This section will show the hardware and software that involve in the development
process. All of these elements are important in the process of development of the
system. List of hardware and software are shown as below:
3.2.1 Hardware requirement
(a) The first hardware is laptop, laptop is the important hardware used to create
the sketches for the characters, background and also used to modelling AR
National Flags. The laptop specification needed as below:
- Processor: Intel Core i5-2450M CPU @ 2.50GHz
- Operating System: Windows 10 Pro – 64 bits
- Memory: 4GB RAM
(b) The second hardware is external hard disk, external hard disk is needed to
store backup file if the laptop broken or missing. Storage needed at least
500GB.
(c) The third hardware is printer, printer is needed to print out the
documentation and to print flashcards pictures.
(d) The last hardware is Android Mobile Phone, android mobile phone used to
run and testing the AR National Flags application.
28
3.2.2 Software requirement
(a) The first software is Unity3D, Unity3D used to create the Virtual Reality
application also overall project and animate 3D characters.
(b) The Second software is Autodesk Maya. Autodesk Maya used to create 3D
character models.
(c) The third software is Vuforia, Vuforia used to create augmented reality.
(d) The last software is Adobe Photoshop, Adobe Photoshop used to create
sketches of background, characters and poster.
29
3.3 Development Methodology
3.3.1 Analysis Phase
In this phase, analysis phase needs to develop the mobile augmented reality (AR)
application. The analysis phase involves are requirement analysis, task analysis and
instructional analysis. Then, the activities involve are identifying the problem
statement, the goals and objectives of the mobile augmented reality (AR) application.
This is very important because to developed the users need, existing knowledge and
any other relevant characteristics and also the content of mobile augmented reality (AR)
application. The mobile augmented reality (AR) application is developed learning flags
of national countries which the content specifically for children age between 3 to 10
years old. The analysis is also carried out by doing comparison between existing
products that implanted augmented reality (AR) technology in their products especially
in learning object names.
30
The analysis is also carried out by doing comparison between existing products that
implanted Augmented technology (AR) in their products especially in learning object
names. Through the analysis, the weaknesses of the existing augmented reality system
can be identified. All information gathered was used to develop goals and objective of
developing mobile augmented reality application. The software and hardware
requirement are also determined in this phase. The flow of analysis phase is shown in
Figure 3.2 and Figure 3.3.
Figure 3.2: Content of Flashcards Pictures AR
National Flags
using AR
technology
Flashcards Picture
using AR
Images and Sound
Mobile AR
Application:
“National Flags
learning using AR
technology”
Scan Flashcards
Digital Picture
and Sound
31
Figure 3.3: Analysis Phases
Analysis Problem
Statement
1. Less Interest
2. Massive development of technology has
driven those children towards screen-
based learning method
Objectives
1. To design AR National Flags and
makes learning materials more fun.
2. To develop flash card and mobile
application that enable users to learn
with augmented reality technology.
3. To evaluate the functionalities of
augmented reality of National Flags.
Target
Audience 1. Admin
2. Children
Content
This project included:
1. Flashcards picture
-Contain images picture of flags.
2. Flashcards picture using AR technology
-A mobile apps contain 3D model
-Physical button
-Sound effect of national anthem
Strategy
Requirement
1. Use 3D model
2. Augmented reality
technology
1. Hardware
-Laptop
-Mobile phone (Android)
2. Software
-Unity3D
-Vuforia
-Maya3D
32
3.3.2 Design Phase
In design phase, conceptual model, flowchart and storyboard were developed. The
design phase involves the development of the conceptual model for the mobile
Augmented reality application which involves the learning theory, the medium and
Augmented reality technology to be used in the application, the teaching and learning
approach to be implemented and the components involve in this mobile Augmented
reality application.
33
3.3.2.1 Conceptual Model
The conceptual model is shown in Figure 3.7. The framework lists the following
components as the important components to be included in the development of
mobile Augmented reality application. They are:
i. Teaching and learning approach
ii. Learning theory
iii. Prototype development
Figure 3.4 Conceptual Model of The Application AR
Physical area
Interface
Physical and digital area
Learning
Theory Cognitivism Constructivism
Teaching and
Learning
Approach
Interactivity in
real time
Intuitive: Hold,
zoom in, zoom out, rotate
Visual
literacy
Prototype SCAN
Digital area
Text, audio, animation,
2D graphic, 3D object
AR multi dimension
environment Multimedia-
Fusion
Graphical
Interface TAR Interface
34
3.3.2.2 Flowchart
Flowchart is a diagram that shows the progress flow of system. The application
starts by providing users to click Select Continent button from homepage. Next,
on the main page the users providing to choose Asia button, Europe button,
Africa button South America Button, Oceania button and if want to return to
previous page can click on button Back. The Select Continent button is the most
important button for this application. This button will automatically turn on the
camera on user’s mobile phone. The Select Continent button will give the
opportunities to the users to choose any continent to scan. The user needs to
scan an image that created on the page using the mobile phone camera. In a few
second, a 3D model will pop out automatically on the mobile phone screen and
song of national anthem will be played alongside with the animation of AR
Flags. User can click continent button to choose the continent to see AR Flags.
After that, the 3D image of the flags and sound music of national anthem from
narrative speaker will appear on the application. Then, back button will bring
users directly to the previous page which is making the optional to the users
either to click scan or back button. The technology used is augmented reality
that combined the reality and virtual environment together to make a learning
process become more interesting. The flowchart is shown in Figure 3.8.
35
Figure 3.5 Flowchart of Flashcards Pictures AR
Quit
No
Yes
Start
Homepage
Select
Continent
Scan
Flashcard
3D model of national flags and National Anthem
Yes Yes
No
36
3.3.2.3 Storyboard
Storyboarding is also a part of multimedia design process. The storyboard
shows the look and feel of the application that will be developed. Some of the
storyboard can be seen in picture below
3.3.2.3.1 Home page
Figure 3.6 the home page is the main page of this application there is 3 buttons
on this page which is Select Continent button, Credit button and Exit button,
user can navigate all of the button assign on this page.
Figure 3.6 Home page
37
3.3.2.3.2 Select Continent Page
Figure 3.7 show the Select Continent page, this page show about each flag
arrange based on continental in the world and this page is main activity of this
application where’s most of the engagement happen between user and the AR
function.
Figure 3.7 Select Continent Page
3.3.2.3.3 Credit page
Figure 3.8 show credit page, this page has a brief about of the developer of this
project and the supervisor of this project development.
Figure 3.8 Credit Pag
38
3.3.3 Development Phase
The Development phase builds on both the Analysis and Design phase. The purpose of
this phase is to generate the lesson plans and lesson materials. This phase will develop
the instruction, all media that will be used in the instruction, and any supporting
documentation. This may include hardware and software. During the development
phase, the actual course materials are created. A successful development phase uses the
information collected in the analysis phase and the decisions made in the design phase.
The Development phase is the actual production and assembly of the materials that were
developed in the design phase. At this point it is important to include whoever is
responsible for which elements, time schedules, and deadlines. In this phase, all steps
in development of the project are collected, prepared, created and ready to be tested. In
the development phase, instructional designers and developers create and assemble
content assets blueprinted in the design phase. In this phase, the designers create
storyboards and graphics. The project is reviewed and revised according to feedback.
39
i. Create Marker
Figure 3.9 Create Marker
This is the first step before start build 3d animation models. Created markers
using Adobe Photoshop CS6. On the picture there are pictures of object. So, the
users are willing to scan images or markers on the picture and the 3D animation
models automatically pop out on the phone screen.
40
ii. Modelling 3D
Figure 3.10 Modelling 3D
Figure 3.10 show the developer making the process of modelling 3D animation
models using Autodesk Maya software. The image of the table shows as
reference to create 3D animation.
41
iii. Texturing 3D
Figure 3.11 Texturing 3D
Figure 3.11 shows the next process in animating 3d characters which is
texturing. Texturing is the next phase involved while creating 3d animation. It
includes creating a texture from the base, editing an existing texture for reuse.
Shading intensity is to be decided during the texturing phase and textures are
developed like maps and then assigned to a particular scene or model. After
finish modelling the models, the developer needs to find the right texture to
wrap the models.
42
iv. Rendering
Figure 3.12 Rendering
Figure 3.12 shows the next process in animating 3d characters which is
rendering. Rendering is the final step in the animating 3d character process.
Rendering is the process of creating an image or sequence of images from a
scene. During rendering, Maya generates a two-dimensional image, or series of
images, from a specific view of a three-dimensional scene, and saves it as an
image file.
43
v. Create Marker Using Vuforia
Figure 3.13 Create marker using Vuforia
Figure 3.13 show that Vuforia is able to recognize and track targets by analysing
the contrast-based features of the target that are visible to camera. The developer
can improve the performance of a target by improving the visibility of these
features through adjustments to the target's design, its rendering and scale, and
how it's printed. The star rating of a target ranges between 1 and 5 stars;
although targets with low rating (1 or 2 stars) can usually detect and track well.
For best results, the developer should aim for targets with 4 or 5 stars.
44
vi. Building environment AR using 3D Unity
Figure 3.14 Unity 3D Software
Figure 3.14 shows the unity 3D software. The developer needs to setup the
Unity 3D before start using it. This is the platform where to begin build AR
experiences. Next, developer need to create project and create the scenes which
is Navigation, Camera & Light, 3D Object, Physics, Material and Scripts.
3.3.4 Implementation Phases
The Implementation phase refers to the actual delivery of the instruction,
whether it's classroom-based, lab-based, or computer-based. The purpose of this
phase is the effective and efficient delivery of instruction. This phase must
promote the students 'understanding of material, support the students' mastery
of objectives, and ensure the students' transfer of knowledge from the
instructional setting to the job.
45
3.3.4.1 Test Run Project
The developer test runs the project herself. This is to ensure that the
project can be used and is running accordingly
3.3.4.2 User Test Run
Developer give to the user to test the project and give the feedback
before the presenting the final product. Criticisms and constructive
feedback are taken to be implemented later on.
3.3.5 Evaluation Phase
This phase measures the effectiveness and efficiency of the instruction. Evaluation
should actually occur throughout the entire instructional design process- within phases,
between phases, and after implementation. Evaluation phases may be formative or
summative.
3.3.5.1 Debug
i. Identify Errors
After done test run, errors that were found by the users should be
identified. Example, glitches and mistakes should be brought to
light for developer to improve the project while also
implementing the feedback by the alpha and beta testers.
ii. Find solutions
46
If once errors have been identified, solutions the error must be
done to solve.
3.3.5.2 Final Product
i. Presentation
The system is ready to be presented and launched for a large
audience to use
3.4 Framework Design
Figure 3.15 Framework Design
Figure 3.15 above shows the framework design of Picture Dictionary Inside
House.User able to choose any button in this application.The users need scan
any image object for display 3D object and also press button for display
sound.For Admin, Admin able to update the application for make new
design.Admin also able view the response feedback. The Unity 3D used to
create the Virtual Reality application and overall project and modelling 3D
47
objects.The Vuforia use to create augmented reality. The Vuforia detects and
tracks the features that are naturally found in the image itself by comparing these
natural features against a known target resource database. Once the Image
Target is detected, Vuforia Engine will track the image as long as it is at least
partially in the camera’s field of view.For the best results,you should aim for
targets with 4 or 5 stars.
3.5 Summary
Methodology is very important in a system development. It helps to make sure the
system application develops correctly from phases to phases. In this system, Iterative
and Incremental Model had been chosen as a guide to build system. It also helps to
ensure all the objectives can be achieved. Besides, this chapter also explains the
hardware and software requirements for this system.
48
References
• Katiyar, A., Kalra, K., & Garg, C. (2015). Marker based augmented reality. Advances
in Computer Science and Information Technology (ACSIT), 2(5), 441-445.
• Patkar, R. S., Singh, S. P., & Birje, S. V. (2013). Marker based augmented reality using
Android os. International Journal of Advanced Research in Computer Science and
Software Engineering (IJARCSSE), 3(5).
• Zainuddin, N., Sahrir, M. S., Idrus, R. M., & Jaffar, M. N. (2018). Scaffolding a
Conceptual Support for Personalized Arabic Vocabulary Learning Using Augmented
Reality (AR) Enhanced Flashcards. Journal of Personalized Learning, 2(1), 95-103.
Related Documents
