using augmented reality (ar-bbs) · oleh itu, dengan adanya ‘belajar bacaan solat using ar...
TRANSCRIPT
‘BELAJAR BACAAN SOLAT’
USING AUGMENTED REALITY
(AR-BBS)
RAFHANAH BINTI RAMLAN
BACHELOR OF INFORMATION TECHNOLOGY
(INFORMATICS MEDIA) WITH HONOURS
UNIVERSITI SULTAN ZAINAL ABIDIN
2020
‘BELAJAR BACAAN SOLAT’
USING AUGMENTED REALITY
(AR-BBS)
RAFHANAH BINTI RAMLAN
BACHELOR OF INFORMATION TECHNOLOGY
(INFORMATICS MEDIA) WITH HONOURS
FACULTY OF INFORMATICS AND COMPUTING
UNIVERSITI SULTAN ZAINAL ABIDIN
2020
i
DECLARATION
I hereby declare that this report is based on my original work except for quotations 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 institutions.
__________________________________
Name: RAFHANAH BINTI RAMLAN
Date:
ii
CONFIRMATION
This is to confirm that:
The research conducted and the writing of this report was under my supervision.
________________________________
Name: PN.NORMALA BINTI RAHIM
Date:
iii
DEDICATION
First of all, I would like to give big thanks to my supervisor, Pn.Normala binti Rahim
for giving me a lot of advice and guidance along the development of research. His
invaluable help of constructive comments and suggestions throughout this project have
contributed to the success of this research. Lastly, my deepest gratitude goes to my
beloved family for their support and motivation throughout the process of this research.
Also, thank you for those who directly or indirectly involved in helping me finish this
project.
iv
ABSTRACT
Nowadays, the use of technology is increasing and expanding in human life. The use of
technology has expanded into many fields including research, doctoral, educational, and
many more. The technology used in education especially in early education for student
in primary school is to add more knowledge and help educators to teach more
effectively. Unfortunately, there are still children who abuse the existing technology
and cause their time wasted with unfortunate benefits. Therefore, with the advent of
‘Belajar Bacaan Solat’ using Augmented Reality Technology these student can use
technology properly. The objective of this project was to provide opportunities for these
children to study and use AR (Augmented Reality) technology more profoundly. In
addition, this project can also benefit to student of Islamic class in primary school
(KAFA) and KAFA teachers in teaching student more effectively. A variety of
multimedia elements are provided in the ‘Belajar Bacaan Solat’ using AR Technology
app with the aim of attracting student to learning. In conclusion, this project can help
student learn more effectively and become part of an IT-savvy child.
v
ABSTRAK
Dewasa ini, penggunaan teknologi semakin meningkat dan meluas dalam kehidupan
manusia. Penggunaan teknologi telah meluas ke dalam banyak bidang antaranya
bidang penyelidikan, kedoktoran, pendidikan dan banyak lagi. Teknologi yang
digunakan dalam pendidikan terutamanya untuk pelajar KAFA sekolah rendah adalah
untuk menambahkan lagi ilmu pengetahuan dan membantu para pendidik mengajar
dengan lebih efektif. Malangnya, masih terdapat lagi pelajar yang menyalahgunakan
kemudahan teknologi yang sedia ada dan menyebabkan masa mereka terbuang dengan
akitivti yang tidak berfaedah. Oleh itu, dengan adanya ‘Belajar Bacaan Solat using AR
Technology’ pelajar-pelajar ini dapat menggunakan teknologi dengan sebaiknya..
Objektif projek ini dibangunkan adalah untuk memberi peluang kepada pelajar-pelajar
ini untuk mengkaji dan menggunakan teknologi AR(Augmented Reality) dengan lebih
mendalam. Di samping itu, projek ini juga dapat memberi faedah kepada pelajar-
pelajar tahun 4 kelas KAFA dan guru-guru untuk pembelajaran yang lebih efektif.
Pelbagai elemen multimedia yang disediakan dalam aplikasi ‘Belajar Bacaan Solat
using AR Technology’ ini dengan tujuan untuk menarik minat pelajar-pelajar semasa
sesi pembelajaran. Kesimpulannya, projek ini dapat membantu pelajar belajar dengan
lebih berkesan dan menjadi sebahagian daripada pelajar-pelajar yang celik IT.
vi
TABLE OF CONTENTS
DECLARATION i
CONFIRMATION ii
DEDICATION iii
ABSTRACT iv-v
TABLE OF CONTENTS vi-ix
LIST OF TABLES x
LIST OF FIGURES xi-xiii
LIST OF ABBREVIATION/TERMS/SYMBOLS xiv
LIST OF APPENDIX xv
CHAPTER 1 INTRODUCTION
1.1 Introduction 1-2
1.2 Problems Statement 3
1.3 Objectives 4
1.4 Scopes 5
1.5 Limitation of work 6
1.6 Expected Result 6
1.7 Summary 7
vii
CHAPTER 2 LITERATURE REVIEW
2.1. Introduction 8
2.2. Augmented Reality 9-10
2.2.1. Augmented Reality Techniques 10
2.3. Previous research on the application for Prayers in
Salah
11
2.3.1 Flashcard: Bacaan Rukun Qauli Dalam Solat 11
2.3.2. Mobile Application: E-Solat. 12
2.3.3 Mobile Application: The User Guide
Muslim Pray.
12-13
2.3.4. Mobile Application: Panduan Lengkap
Solat.
14
2.3.5. Mobile Application: Panduan Solat Wanita 14-15
2.3.6. Mobile Application (AR): ‘Ajar Saya Solat’ 15-16
2.4 Comparison Existing Products 16-19
2.5 Summary 20
CHAPTER 3 METHODOLOGY
3.1 Introduction 21
3.2 Rapid Application Development (RAD)
Methodology
21-22
3.2.1 Requirements Planning Phases 23-26
3.2.2 User Design Phases 27-35
viii
3.2.3 Construction Phases 36
3.2.3.1 Development 36-38
3.2.4 Cutover Phases 39
3.2.4.1 Final Testing 39
3.3 Framework Design 40
3.4 Hardware and Software Requirement 41
3.4.1 Hardware requirement 41-42
3.4.2 Software requirement 42-43
3.5 Summary 44
CHAPTER 4 IMPLEMENTATION AND EVALUATE
4.1 Introduction 45
4.2 Implementation 45
4.2.1 Button in Application 46-48
4.2.2 Loading Page 49
4.2.3 Home Page 49
4.2.4 Info About Apps Page 50-51
4.2.5 How To Play Page 51
4.2.6 Scan Page 51-52
4.2.7 Home Page Quiz 52
4.2.8 Quiz 1 Page 53
4.2.9 Quiz 2 Page 53
4.2.10 Exit Page 54
ix
4.2.11 AR Marker 54-55
4.2.12 3D Model (12 model) 56-60
4.2.13 Unity 3D Workspace 60
4.3 Testing and Result 61
4.4 Summary 62
CHAPTER 5 CONCLUSION
5.1 Introduction 63
5.2 Project Achievement and Contribution 63
5.3 Problem and Limitation 64
5.4 Future Work 64
5.5 Summary
65
REFERENCES 66-71
x
LIST OF TABLES
2.1 Comparison table of existing product 16-18
2.2 Comparison table of the existing products with 5
element of multimedia
18-19
3.1 Existing Product 25-26
3.2 Hardware and Usage 41-42
3.3 Software and Usage 43
4.1 Button in Application 46-48
xi
LIST OF FIGURES
2.1 Marker based AR 10
2.2 Marker less AR 10
2.3 The content in Application of Panduan Lengkap
Solat
14
2.4 The content in Application of Panduan Solat
Wanita
15
2.5 The content in Application of Ajar Saya Solat 16
3.1 Rapid Application Development 22
3.2 Analysis Phases 24
3.3 Flashcard 1 27
3.4 Flashcard 2 28
3.5 Loading Page 28
3.6 Main Menu 29
3.7 How to Play 30
3.8 About 31
3.9 Scanner (Before) 31
3.10 Scanner (After) 32
3.11 Home Page Quiz 33
xii
3.12 Multiple Choice 34
3.13 True/False 34
3.14 Confirmation Exit Panel 35
3.15 Development Process 38
3.16 Framework Design 40
4.1 Loading Page 49
4.2 Home Page 49
4.3 Info Page 50
4.4 About Prayers in Salah 50
4.5 About Prayers in Salah 51
4.6 How to Play Page 51
4.7 Scan Page 52
4.8 Home Page Quiz 52
4.9 Quiz 1 Page 53
4.10 Quiz 2 Page 53
4.11 Confirmation Exit Panel 54
4.12 Example of markers 55
4.13 Example of features 55
4.14 3D Model ‘Bacaan Niat’ 56
4.15 3D Model ‘Bacaan Takbir’ 56
4.16 3D Model ‘Bacaan Al-Fatihah’ 57
4.17 3D Model ‘Bacaan Doa Iftitah’ 57
4.18 3D Model ‘Bacaan Rukuk’ 57
4.19 3D Model ‘Bacaan Iktidal’ 58
4.20 3D Model ‘Bacaan sujud’ 58
xiii
4.21 3D Model ‘Bacaan duduk antara dua sujud’ 58
4.22 3D Model ‘Bacaan Tahiyat Awal’ 59
4.23 3D Model ‘Bacaan Tahiyat Akhir’ 59
4.24 3D Model ‘Bacaan Salam’ 59
4.25 3D Model ‘Bacaan Doa Qunut’ 60
4.26 Unity 3D Workspace 60
4.27 User Testing 61
4.28 User Testing 61
xiv
LIST OF ABBREVIATIONS/TERMS/SYMBOLS
AR Augmented Reality
3D Three dimensional
FYP Final year project
KAFA Kelas Asas Fardhu Ain
xv
LIST OF APPENDICES
APPENDIX TITTLE PAGE
A Gant Chart FYP I 68
B Gant Chart FYP II 69
C Project Poster 70
D Interview Questions 71
1
CHAPTER 1
INTRODUCTION
1.1 Introduction
Augmented Reality (AR) has been an emerging technology in these recent years.
AR (Augmented Reality) defined as immersion of virtual environment to the real
environment which it enriches the vision, audition or even taste, touch and smell
(Boonbrahm et al., 2020). The significant timeline of AR technology begun from a
cinematographer, Morton Heiling which he thought cinema should enable interaction
between a human and the environment covering all the senses (Boonbrahm et al., 2020).
The first AR Head Mounted Display was developed by Sutherland (Sutherland, 1968)
while the ability to interact with virtual objects was first introduced by Myron Krueger
(Huttenlocher, 2004).
Nowadays, smartphones have the core features to develop an AR application
such as camera, touch screen, Inertia Measurement Unit (IMU), internet access and so
forth (Boonbrahm et al., 2020) The advancement of smartphone technologies which
enable real time image processing camera and powerful performance from built - in
2
Central Processing Unit (CPU) and Graphics Processing Unit (GPU) made basic AR
application development easier without external supporting device.
This new technology, called augmented reality is a combination of what's real
and what's computer-generated by enhancing what we see, hear and feel. Its combines
real and virtual images both can be seen at the same time. When compared to other
reality technologies, augmented reality lies in the middle of the mixed reality spectrum
between the real world and the virtual world. Furthermore, augmented reality is
changing the way we view the world or at least the way its users see the world.
Additionally, augmented reality adds graphics, sounds and haptic feedback to the
natural world as it exists.
‘Belajar Bacaan Solat’ flashcard using AR Technology Enhanced using AR
technology is an interactive application that uses new era technology to help people.
This ‘Belajar Bacaan Solat’ flashcard using AR Technology is specially created for
students of Islamic class in primary school (KAFA). In addition, ‘Belajar Bacaan Solat’
flashcard using AR Technology is focused on prayers in Salah to improved prayers and
learned proses with interactive. Users need to scan the flashcard of the prayer in Salah
using their mobile phones. Then, the model and the prayers in Salah will appear on the
phone automatically with sound of prayers in Salah correctly.
Overall, it can be concluded that through AR technology, it enhances students
understanding and creates a more engaging and interactive learning environment and
sees virtual objects in the real world as well as various multimedia elements such as
animation, image, audio, text and video.
3
1.2 Problem Statement
In my literature review about existing products, many mobile applications
developed is not focused on prayers in Salah. They only focus on the step in Salah.
Based on this limitation, I propose to developing applications that focus on Prayers in
Salah only. Besides, based on my interviews session that have been conducted with
Pn.Zuraidah binti Mansor, a KAFA teacher from SK Pusat Kuala Ibai, there are several
problem that have been identified. The first problem that can be stated is that KAFA
books mostly are in texts and 2D image. KAFA classes are often run in the evening so
it will cause the student to lose focus in the classroom. So, with this app, it can help
student to study with fun and more interesting because it has 3D animation elements,
sound and activities. Lastly, Studying through the book will quickly get bored and hard
to memories. Without the effective learning aid tool, the learning process become less
interesting and difficult of them to understand and memorize about prayer in Salah. As
we know an early exposure through the effective learning aid tool in studies is very
important to increase their interest in to memorize prayers in Salah. Concise
descriptions of the issues stated need to be addressed to deal with the problem.
4
1.3 Objectives
There are the following objectives of AR P for student of Islamic class in
primary school (KAFA) are:
i. To identify requirement the augmented reality technology to create ‘Belajar
Bacaan Solat’ flashcard using AR Technology with interactive ways.
ii. To design and develop mobile apps for ‘Belajar Bacaan Solat’ flashcard
using AR Technology that allow users learning with augmented reality.
iii. To test the functionality of ‘Belajar Bacaan Solat’ flashcard using AR
Technology.
5
1.4 Scope
The scope will be explained about the actor who will involve in this system and what
function involved in this system. The main scopes of the system:
I. Technology
This project applied Augmented Reality technology using flashcard.
The author develop 3D modelling of the character using Maya and unity 3D.
The illustration of the flashcard is use adobe Photoshop and adobe Illustrato r
software. For the AR features by using Vuforia Augmented Reality SDK to
detect and track the target, marker-based technique is used for this AR
application. C# language as the program language.
II. Module
The module in this application AR card include scanning image on the
flashcard, Display AR application with animations. Display 12 prayers in Salah
card, contain the prayers in Salah and contain 2 activities.
III. User
This project age scope is focused on student of Islamic class in primary
school (KAFA).
6
1.5 Limitation of Work
A limitation is any aspect that hinders a study and its findings. (Moura, 2017).
This AR Prayers in Salah for student of Islamic class in primary school (KAFA) is
limited by four aspect:
i. Only prayers in Salah is recognized.
ii. This Application is applicable only for android user which is not
supported in websites and IOS operating system
iii. This Application implement physical button only for the interaction
between user and the application.
iv. This application need special marker to make it work.
1.6 Expected Result
At the end of the project, the expected outcome of the proposed project
development is as follows:
i. The user will be able to improve and gain their knowledge about
Augmented Reality Technology
ii. ‘Belajar Bacaan Solat’ flashcard using AR Technology will completely
develop.
iii. Only android user can access this application.
7
1.7 Summary
In conclusion, this chapter discussed about the overview for the proposed project
include problem statement, objectives, scope, limitation of work and expected result.
Based on what has been described, it is necessary to improve the learning process so
that students are more active and motivate students during the learning process so as to
encourage students to more easily understand and learning the prayers in Salah through
AR technology. Hence, through a simulated, real-world AR technology simulated is
expected to produce a new approach to enhancing the quality of teaching and learnin g
activities carried out in conjunction with the integration of interactive multimed ia
elements.
8
CHAPTER 2
LITERATURE REVIEW
2.1. Introduction
This chapter discusses about previous work or related work about ‘Belajar
Bacaan Solat’ flashcard using AR Technology. The literature review involving process
of read, evaluating and analysis the available literature related to the selected area of a
project to introduce a need for a new research. In this project literature review, a
research has been made to understand and get some overview about existing project and
related technology.
2.2. Augmented Reality
Augmented reality is a view of the real, physical world in which elements are
enhanced by computer-generated input. These inputs may range from sound to video,
to graphics to GPS overlays and more. The first conception of augmented reality
occurred in a novel by Frank L Baum written in 1901 in which a set of electronic glasses
mapped data onto people; it was called a “character marker”. Today, augmented reality
is a real thing and not a science-fiction concept. The first properly functioning AR
9
system was probably the one developed at USAF Armstrong’s Research Lab by Louis
Rosenberg in 1992. This was called Virtual Fixtures and was an incredibly complex
robotic system which was designed to compensate for the lack of high-speed 3D
graphics processing power in the early 90s. It enabled the overlay of sensory
information on a workspace to improve human productivity.
2.2.1 Augmented Reality Techniques
Generally, there are two types techniques of AR applications that have
been reported in Pence (2011) study, AR based marker (marker based AR) and
AR without markerless (markerless AR). According to (Yuen et al., 2011), the
marker is an image of black and white in terms of rectangles and during the
detection process this marker will be used and the computer will detect the
position and oriented by the marker to create a virtual object in the form of an
object 3D at point (0, 0, 0) and three angles (X, Y, Z).
In addition, AR-based markers require a certain marker / label to
register a 3D virtual object position that will be displayed in a real-world
environment (Zainuddin et al., 2016). The always-used marker is a rectangular
card or paper which over the card has a certain pattern or line with different id
and code. Thus, a laptop camera or smartphone will detect the position of the
AR marker scan on the flash card and then the virtual element will be generated
by the AR software and will appear on the screen more interactive than the
scan card.
10
On the other hand, in contrast to the AR markerless method, using
location or location data generated by mobile devices, global positioning
systems or any part of the real environment to determine location and targeting,
then generating and displaying information virtually (Yuen et al., 2011).
Additionally, AR without markers also has various techniques including face
detection, 3D object detection and motion detection.
Diagram 2. 1 Marker Based AR
Diagram 2. 2 Markeless AR
11
Figure 2.1 Marker-based AR Figure 2.2 Marker less AR
2.3. Previous research on the application for Prayers in Salah:
Related products refer a system already existing and used until now. This is
example of system:
2.3.1. Flashcard: Bacaan Rukun Qauli Dalam Solat.
According to (Raziah Md Nasib, 2016). The purpose of this study was
test the effectiveness of primary student mastery level of “Rukun Qauli” during
their “solat”. The respondents selected for this particular study were ten female
students from the same primary school. This study is to identify how effective
the learning technique by using colored card in mastering the reading of “rukun
qauli” in prayers, also to identify how far the acceptance and comprehens ion
towards the reading of “rukun qauli” in prayers, furthermore the research also
aims to gauge pupils understanding of the importance “rukun qauli” during their
“solat”. Based on the findings, we can deduce that 90% of the students have
attained at least mastery level of understanding the importance of “rukun qauli”
during their prayers. The findings further attribute to the importance of
employing multiple teaching techniques to enhance the student interest in
12
learning and mastering “rukun qauli”, for example the use of colored card was
effective because it managed to attract the student attention. The study also
highlights the importance of reinforcement and remedial to ensure there is
continuity in learning.
2.3.2. Mobile Application: E-Solat.
Courseware on E-Solat is developing by Syaifudin Bin Ramzan that
can guide user especially kids around six to twelve years old on how doing
Salah. This courseware divides into two main courses which is learning Salah
and remembering short surah. Under Salah, there are five options and kids can
choose which Salah he or she wants to learn. The options are ‘Solat Subuh, Solat
Zohor, Solat Asar, Solat Magrib and Solat Isya'. The animation will teach kids
how to Salah.
2.3.3. Mobile Application: The User Guide Muslim Prayer.
According to (Abdul Manaf et al., 2015) is provided that one of the
programs available is Muslim Prayer Guide applications that can be downloaded
for free via mobile devices such as smartphones and tablets. Affective factors,
such as embarrassment towards instructors and peers can disrupt learning. One
of the technologies that have the potential to address this issue is mobile
learning. As such, we develop a mobile application in attempting to solve the
issue of learner embarrassment in learning about praying.
13
Muslim Prayer Guide application is built is intended as a guide to the
Muslim citizens of all ages to perform prayers in the prayer in Islam. The content
of this application is the rule of prayer, how to perform ablution, the things that
invalidate the prayer, the reading of the five daily prayers. This study was
conducted to identify the factors that contributed to the Android Muslim Prayer
Guide. The study was carried out quantitatively by submitting a questionna ire
to the 62 respondents who use this application.
The analysis was done by using the Rasch measurement model and to
measure the effectiveness factors of these applications. The results showed that
the use of this application Muslim prayers assist learners in terms of the level of
knowledge and methods of teaching and learning guides prayers. This
application also helps adult learners who want to learn prayers. The Muslim
Prayer Guide also assist them in prepare before meeting with a teacher to learn
the prayers and to equip themselves as a Muslim to perform the second pillar of
Islam.
14
2.3.4. Mobile Application: Panduan Lengkap Solat.
This application provides a complete guide on how to do a daily and
sunat prayer. Based on figure 2.3 below, this application let you learn prayer a
sunat and a daily prayer through interactive content. It is accessible and easy to
use. Furthermore, the screen display in HD quality that can zoom in and zoom
out without affecting the display quality (blur). This application was released on
April 2, 2018 and user can get the application on play store for free.
Figure 2.3: The content in Application of Panduan Lengkap Solat.
15
2.3.5. Mobile Application: Panduan Solat Sempurna Wanita.
A proper prayer is important to ensure that our prayers are accepted by
Allah Almighty. Therefore, this app is developed as a reference to all women in
performing prayers. This application provides proper procedure and prayers in
the correct manner. The content is detailed like book. This application was
released on October 2, 2018 and user can get on play store for free.
Figure 2.4: the content in Application of Panduan Solat Sempurna Wanita.
16
2.3.6. Mobile Application (AR): ‘Ajar Saya Solat’.
According to (Hexa Setia, 2018) is provided how to perform prayers
easily. This application is easy to be use by only pointing the camera gadget
towards the flashcards, by then a 3D animation will appear. This application
helps to memorize the recitation in prayers. This application also can forming
the children by using the gadget with beneficial content and it is interactive and
interesting for kids to use. 3D Animation will appear along with the prayer
guidance.
Figure 2.4: the content in Application of Ajar Saya Solat.
17
2.4. Comparison Existing Products
This table about comparison existing product. The comparison with year
publisher, platform, advantage, and disadvantage. So, the weakness of the existing
product can be identified went make the comparison. The comparison shown Table 2.1.
Table 2.1: Comparison table of existing product.
NO. TITLE AUTHOR
/ YEAR
TECHNIQUES ADVANTAGE DISADVANTAGE
1. Bacaan
Rukun
Qauli
Dalam
Solat
Raziah Md
Nasib,
2016
Article
(flashcard)
• Using the
interesting
coloured
card.
• Has no animation
element and only
appear in 2D
model.
2. E-Solat Syaifudin
Bin
Ramzan
(2016)
Article
(Mobile Apps)
• Provides
learning
Salah and
remembering
short surah.
• Less attractive
• Images only
appear in 2D.
• A bit complicated
for kids
3. The
User
Guide
Muslim
Prayer
Abdul
Manaf et
al., 2015
Article
(Mobile Apps)
• Provides a
complete
guide of
Salah.
• No animation
element
• Less attractive
layout.
• A bit complicated
for kids.
18
4. Pandua
n
Lengka
p Solat
Gerbang
Pustaka
ILMU
(2018)
Mobile apps
• Complete
prayer in
Salah and a
“sunat”
prayer.
• No text and only
sound of prayers
is provided.
• Less interact ive
layout.
5. Pandua
n Solat
Sempur
na
Wanita
laila
majnun
(2018)
Mobile Apps
• The content
is detailed
like book.
• Less interact ive
environment
design.
• Only for woman.
• Too much text in
one page.
6. ‘Ajar
Saya
Solat’
Hexa Setia
(2018)
Mobile Apps
(AR)
Marker based
• Provides step
in Salah.
• Interactive
and suitable
for kids.
• Only focus on
step in Salah.
• Without
recitation of
surah.
• The book is
limited to get
since it’s from
oversea.
19
Table 2.2 Comparison Table of the Existing Products with 5 Element of Multimedia.
NO. TITTLE Text Image Video Audio Animation
1. Flashcard: Bacaan Rukun
Qauli Dalam Solat
✓ ✓ - - -
2. Mobile Apps: E-Solat ✓ ✓ - - -
3. Mobile Apps: The User
Guide Muslim Prayer
✓ ✓ - - -
4. Mobile Apps: Panduan
Lengkap Solat
✓ - - ✓ -
5. Mobile Apps: Panduan
Solat Sempurna Wanita
✓ ✓ - - -
6. Mobile Apps (AR): ‘Ajar
Saya Solat’
- ✓ - ✓ ✓
Based on the table 2.2, the conclusion that can be concluded from the hand-on
product is all of it using text and image, but it is too much text in one page and less
attractive. The images only appear in 2D and no animation element. In terms of audio
usage, only one product used audio and it only focused on audio no text and image.
Lastly, the product to be built is based on AR technology that have image in 3D
animation and text with sound and have two activities for student to improve after
learning process. The learning process will be more fun and can give a new experience
to the student.
20
2.5. Summary
This chapter discuss about an overview about the concept of the system.
Literature Review is important to help the developer to know the problem from the
previous system that can be improves or as a guidance of the flow of new system. In
this chapter also is need to compare some of a similar project or application that have
develop by other. Besides, it helps the developer in understanding the system and the
chosen techniques more.
21
CHAPTER III
METHODOLOGY
3.1. Introduction
In this chapter is about process of developing project from the beginning until
the end of this project. The flow of the project will discuss briefly to give more
understanding of design and develop of this application. There are many methods that
can be used for developing this project. The methodology that can be decide in this
project is Rapid Application Development (RAD). In this methodology is based on
phases for each development process. Every phase of this methodology will be
explained.
3.2. Rapid Application Development (RAD) Methodology
In this project, I have chosen Rapid Application Development (RAD) as the
research methodology. James Martin, in his book first coining the term, wrote, “Rapid
Application Development (RAD) is a development lifecycle designed to give much
faster development and higher-quality results than those achieved with the traditiona l
lifecycle (Beynon-Davies et al., 1999). It is designed to take the maximum advantage
of powerful development software that has evolved recently”. The reason why this
22
methodology is selected is due to the rapid prototyping nature where development of
the application could be done in the early stage and user’s requirement and expectation
could be address fully at the development phase. Products development is faster and the
quality of the product is higher is the main advantage when utilize RAD concept.
The other reason why Rapid Application Development (RAD) approach. It was
decided once a lot of consideration made in terms of gathering the requirements and the
nature of application development. RAD consists of four main phases which are
Requirement Planning, User Design, Construction and Cutover as illustrated in the
Figure 3.1. Generally, RAD approaches are more emphasizing on the development
phases rather than planning tasks. It has a better quality of having users interact with
developing prototypes of project functionality. Besides that, more activities can be done
and completed on time of the expected budget. It can reduce the catastrophic failures of
focusing on the development of incremental besides more analysis can be discovered
and acted upon earlier in the process.
Figure 3.1 Rapid Application Development
(RAD)
23
3.2.1. Requirements Planning Phases
During the requirement planning phase, all the important information
and theory about Augmented Reality was gathered. The theory is containing
about the concept, hardware and software and the types of AR with the
applications that been applied in the many field areas. These parts are defined
as Chapter 2 which is Literature Review. Moreover, the problem statement of
the project, the objectives and the scope for the project also clearly stated on
Chapter 1. This is very important to ensure that the project will be achieved the
objectives as planned.
Since the project is developed and targeted for student of Islamic class
in primary school (KAFA), the planning is required to gather information on
understanding the syllabus of learning books for student’s learning process of
prayers in Salah, the current problems and the enhancement of implementing
augmented reality of prayer in Salah with mobile application. The information
was collected from the distributive interviews. It was used to get the teachers
point of view on the students learning about Prayers in Salah. Besides that, the
researches on journals, articles and other research papers also been studied to
collect the correlated information to the project development as the supportive
materials. The existing products of the market also are viewed as the reference
to start the project and the future improvement.
24
Figure 3.2 Analysis Phase.
Requirement
s
Problem
Statement
1. Learn using book is less
interactive.
2. Not have 3D animation.
Objectives
1. To identify requirement the
augmented reality technology to
create ‘Belajar Bacaan Solat’
flashcard using AR Technology.
2. To design and develop ‘Belajar
Bacaan Solat’ flashcard using
AR Technology that allow users
learning with augmented reality.
3. To test the functionality of
Prayers in Salah Flashcard using
augmented reality.
Target Audience
1. Student of Islamic class in
primary school (KAFA).
Content
This project included:
Display Augmented Reality
(AR) application with
animations.
Display 12 prayers in Salah
Flashcard.
Contain 2 Activities.
Strategy
Requirement
1. Use 3D model
2. Augmented reality technology
1. Software
-Unity3D
-Vuforia
-Maya3D
2. Hardware
-Laptop
-Mobile phone (Android)
25
Table 3.1 Existing Product.
NO. TITLE TECHNIQUES ADVANTAGE DISADVANTAGE
1. Penguasaan
Bacaan Rukun
Qauli Dalam
Solat
Article
(flashcard)
• Using the
interesting
coloured card.
• Has no animation
element and only
appear in 2D
model.
2. E-Solat in Mobile Article
(Mobile Apps)
• Provides
learning Salah
and
remembering
short surah.
• Less attractive
• Images only
appear in 2D.
• A bit complicated
for kids
3. The User Guide
Muslim Prayer
Application
Article
(Mobile Apps)
• Provides a
complete
guide of
Salah.
• No animation
element
• Less attractive
layout.
• A bit complicated
for kids.
4. Panduan Lengkap
Solat Fardhu &
Sunat
Mobile apps
• Complete
prayer in
Salah and a
“sunat”
prayer.
• No text and only
sound of prayers
is provided.
• Less interact ive
layout.
26
5. Panduan Solat
Sempurna Wanita
Mobile Apps
• The content is
detailed like
book.
• Less interact ive
environment
design.
• Only for woman.
• Too much text in
one page.
6. Ajar Saya Solat
Mobile Apps
(AR)
Marker based
• Provides step
in Salah.
• Interactive
and suitable
for kids.
• Only focus on
step in Salah.
• Without
recitation of
surah.
• The book is
limited to get
since it’s from
oversea.
27
3.2.2. User Design Phases
Designing phase is the longest period throughout the prototype
development cycle, where by the designing stages, build the design functions
and operations were described in details. It is including the designing the
storyboard, outline, diagrams and also the interfaces. Regarding the user needs,
the early design was based on the specifically designed storyboard as in figure
3.3 until figure 3.12 below.
The flashcard and the interface of application prototype were
designed by using abode Photoshop and adobe illustrator, the adobe that
provide the templates and tools to design storybooks. Therefore, the user
designs phase activity become easier and save time. A prototype is draft
representation built to test ideas for layout.
i. Storyboard Flashcard
Based on the figure 3.3 below, show the flashcard for Bacaan 1 in Prayers.
Figure 3.3 Flashcard 1
28
Based on the figure 3.4 below, show the flashcard for Bacaan 2 in Prayers.
Figure 3.4 Flashcard 2
ii. Storyboard Application
Based on the figure 3.5 below is the loading page before enter the application.
Figure 3.5 loading page
29
Based on the figure 3.6 below is the main menu for the application.
Figure 3.6 Main Menu
BUTTON FUNCTION
Hamburger Button
This is the hamburger button that have all button when
user click
Exit Button
After user click this button, user will exit from this
this application.
How to play Button
After user click this button, user will go to the page
how to play.
Info Button
After user click this button, user will go to the page
info of this application.
Button ‘KIUZ’ After click this button, user will go to the page ‘KUIZ’
that have 2 quiz to play.
Button ‘IMBAS’ After click this button, user will go to the page
‘IMBAS’, user can scan the flashcard at that page.
30
Based on the figure 3.7 How to play below show the page for How to Play. It
show the explanation how to use this application.
Figure 3.7 How to Play
BUTTON FUNCTION
Hamburger Button
This is the hamburger button that have all button when
user click
Exit Button
After user click this button, user will exit from this
this application.
Home Button
After user click this button, user will go to the page
home again.
Scan Button
After user click this button, user will go to the scan
AR page.
31
Based on figure 3.8 about, this page is about the application for student and
based on KAFA Class syllabus and 12 prayers in Salah.
Figure 3.8 About
BUTTON FUNCTION
Exit Button
After user click this button, user will exit from this
this application.
Home Button
After user click this button, user will go to the page
home again.
Previous Button
This button goes to the previous info of Prayer in
Salah.
Next Button
This button goes to the next info of Prayer in Salah.
Based on the figure 3.9 below, the user need to scan a flashcard using a camera.
Figure 3.9 Scanner (Before)
32
BUTTON FUNCTION
Home Button
After user click this button, user will go to the page
home again.
Sound Button
After user click this button, user will hear the prayer in
Salah based on flashcard that scan.
Green scroll box This green scroll box is for user to see the prayers in
Salah.
Based on the figure 3.10, the object will appear in 3D.
Figure 3.10 Scanner (After)
BUTTON FUNCTION
Home Button
After user click this button, user will go to the page
home again.
Sound Button
After user click this button, user will hear the prayer in
Salah based on flashcard that scan.
Green scroll box This green scroll box at this page is for user to see the
prayers in Salah.
33
Based on the figure 3.11 below is the main menu for the quiz.
Figure 3.11 Home Page Quiz
BUTTON FUNCTION
Hamburger Button
This is the hamburger button that have all button when
user click
Button Exit
After user click this button, user will exit from this
this application.
Home Button
After user click this button, user will go to the page
home again.
Scan Button
After user click this button, user will go to the scan
AR page.
Button ‘BETUL atau
SALAH’
After user click this button, user will go to page quiz
‘BETUL atau SALAH’, that have 6 questions.
Button ‘PILIHAN
JAWAPAN’
After user click this button, user will go to page quiz
‘PILIHAN JAWAPAN’ that have 6 questions.
34
In the figure 3.12 below, Quiz 1 in 6 question with multiple choice.
Figure 3.12 Multiple Choice
BUTTON FUNCTION
Exit Button
After user click this button, user will exit from this
this application.
Home Button
After user click this button, user will go to the page
home again.
Button ‘BETUL’ or
‘SALAH’
This button answer for true or false quiz.
In the figure 3.13 below, Quiz 2 in 6 question with true or false.
Figure 3.13 True/False
BUTTON FUNCTION
Exit Button
After user click this button, user will exit from this this
application.
35
Home Button
After user click this button, user will go to the page
home again.
Based on the figure 3.14 are specified interface for those who want to exit from
the applications. There will have yes or no button to confirm exit.
Figure 3.14: Confirmation Exit Panel
BUTTON FUNCTION
This button is cancel button. After user tap the
cancel button then the interface will back into
homepage.
This button is confirm button. User need to
tap this button if confirm to exit.
36
3.2.3. Construction Phases
During the construction phase, each prototype iteration was built, was
based on the system analysis and design set earlier. This is included the
interfaces of the mobile app, the flashcard and development of augmented
reality such as the 3D modelling part and code the programming. The
modelling part is using the Maya software and it took about three to four weeks
to finish the characters models. The creation of the characters is included of
modelling, texturing, rigging and animating the models that were very
challenging and taught activity. Then, the integration and compilation was
done by using Unity 3D which is the cross platform game engine with a built -
in integrated development environment (IDE). It is used to compile the
characters models with animation, programs and SDKs to design the
application. It is then checked to guarantee and ensure the functiona lity
developed is achieved the user requirements. Some changes and modifica t ion
are done in order to make sure the users are completely satisfied with the
product. The phase involves developing the AR application using the Vuforia
SDK and Unity 3D.
3.2.3.1. Development
a) Create Marker
Before starting develop the 3D models, the Salah flashcard must be
created earlier using Adobe Illustrator. This car book used as for
markers which is when we scan the image that created on the flashcard
its will pop out the 3D models at the mobile phone screen.
37
b) Animating 3D characters
Next process in production is animating 3D models using Autodesk
Maya. There are 5 steps that included during the process:
Modelling
In this process, the 3D models is created. Reference images are
required throughout this process.
Texturing
In this process, the 3D models is applying with color &surface
properties. The surface of model must look like it does match real-
world and concept art.
Rigging
In this process, rig the 3D models to make the movement in the
next process which is in animation process. Furthermore, joint
controller, skinning, enveloping, muscle system and floating GUI
is involved.
Animation
In this process, the 3D models movement is created. This process
was the hardest part in animating 3D models. Then, it will make
the 3D models animation more interesting and realistic.
38
Rendering
This process is the last process in animating 3D models.
Rendering is a process which is painting all component in the
production stage to make final output.
c) Building AR
In this process, the 3D models of the kid will be imported into Unity
3D software. Then, the developer can started building AR
experiences using Unity 3D and Vuforia Platform.
d) Building mobile interfaces and features
In this process, the mobile interfaces and features are created using
Photoshop and Adobe Illustrator. The objective is to make the
mobile application more attractive and users understand the
functionality.
e) Coding
During this process, the developer must implement language c# to
the desired outcome of the project based on the findings during the
research phase.
39
Diagram 3.15 Development Process.
40
3.2.4. Cutover Phases
The final phase in RAD approach is cutover phases or known as
implementation stages. This phase only can be done after the testing has been
completed therefore the software can be installed in a “live” environment and
launched. The complete integration is including the implementation of
application ‘Belajar Bacaan Solat’ flashcard using AR Technology. Other than
that, the usability tests were carried out to ensure, whether the system meets
the requirements established earlier or not. The frequent testing and iterating
of the process, until reaching a satisfactory outcome, ensured that final users
can use the product easily with no faults or errors.
3.2.4.1. Final Testing
After all of steps in construction phase are completed,
final output have been done and ready to perform.
a) Test Run Project
This is when the developer test runs the project by
herself. This is to ensure that the project can be used and
is running accordingly.
b) User Test Run
Before presenting the final product, developer give to the
user test the project and give the feedback. Criticisms
and constructive feedback is taken to be implemented
later on.
41
3.3. Framework Design
Figure 3.16 below shows the framework design of Prayer in Salah Applicat ion.
User able to choose any button in this application.
Figure 3.16: Framework Design
The users needed to used device to search the marker in flashcard, for the best results,
you should aim for targets with 4 or 5 starts. The adobe illustrator used to create
flashcard prayer in Salah and to create interface of the application ‘Belajar Bacaan
Solat’ flashcard using AR Technology. The adobe Maya used to model the character in
3D and make the 3D model movement and look realistic. The 3D Unity used to create
the Virtual Reality application and overall project and modelling 3D 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. Lastly,
after scanning the marker, 3D image will display to user. From this, the user will learn
a new experience in learning process.
42
3.4. Hardware and Software Requirement
Developers have identified the requirements needed to develop AR Prayers in
Salah. The requirements in AR development are divided into two main parts, hardware
and software requirements. Hardware and software are a key requirement in developing
a multimedia development as a control, managing, supporting computer systems and
activities. The selection of hardware and software should consider minimum or
equivalent specifications in the AR development process allowing software to function
properly to launch AR Prayers in Salah. Here is a list of required hardware and software.
3.4.1. Hardware Requirement
Hardware consists of components that can be physically controlled.
Hardware selection should be done to avoid any technical problems occurring
during the software development process. The following is a minimum hardware
specification for the hardware required by the developer to produce AR Prayers
in Salah. Based on the Table 3.1 below, describes about hardware and usage.
Table 3.1: Hardware and Usage.
NO. HARDWARE USAGE
1. Laptop DELL Inspiron 15 (3000
series)
(Operating system : Windows 10)
(Processor : Intel Core i3)
( Memory : 4GB RAM)
To create the sketches for the model,
background and create scripts or
documents related to application. Also
used for on the go coding and 3D
modelling.
43
2. Mobile Phone OPPO A7
(Android Version 8.1.0 CPH1901EX)
(64GB Memory)
Used to run and testing the application
3. External Hard Disk
To backup all project data
4. Printer
To print out the documentation.
3.4.2. Software Requirement
As a result of the analysis, it was found that the software needed to
develop AR Prayers in Salah are Autodesk Maya, Vuforia, Unity 3D, Adobe
Photoshop and Adobe Illustrator. The builder uses this software as a support
throughout the process of development of AR Prayers in Salah to produce more
44
attractive, high quality and functional software. Software suitable for software
development is very important because the software is a detailed instruction that
controls the functionality of the hardware device and every software applied has
different uses of its functionality. Based on the Table 3.2 below, describes about
software and usage.
Table 3.2: Software and Usage.
NO. SOFTWARE USAGE
1. Autodesk Maya 2018
Used to create 3D character
models.
2. Vuforia
To create Augmented Reality
3. Unity 3D
Used to create the Virtual Reality
app and
Overall project and animate 3D
characters.
4. Adobe Photoshop
Used to create sketches of
background, characters and
posters.
5. Adobe Illustrator
To design interface, posters and
logo application.
45
3.5. Summary
This chapter discussed the methodology used is to complete this project. The
Rapid Application Development (RAD) methodology is used because every phase
during the application development follows the project methodology that is mentioned
in this chapter. The hardware and software requirement also had been discussed.
46
CHAPTER 4
IMPLEMENTATION AND TESTING
4.1 Introduction
This chapter will be discussing the implementation of the methodology that have
been discussed in the previous chapter and testing to obtain the result of each
implementation. Implementation is executed to ensure the application is developed
according to the main objectives of the project and fulfil the user requirement. Testing
will be executed so that the developer will recognize the defects as soon as possible and
repair it immediately.
4.2 Implementation
The implementation phase refers to the actual activity of the instruction. The
purpose of this phase is the effective and effective delivery of instruction. This project
is implemented as an android application by using 3D Unity which is integrated with
Vuforia developer. Furthermore, this will help developer to design, code, test, debug
and execute the main process of the project. This project also used C# language for
writing a script.
47
4.2.1 Button in Application
Based on the Table 4.1 below, shows the buttons displayed on each
interface. This can make easier for users to navigate to the desired part. Among
the buttons used are:
Table 4.1: Button in Application
Button Description
This button goes to the AR camera are functioned to
go to the next scene which is user able to scan the
flashcard provided to show the 3D object and prayers
in Salah.
This button is the quiz button of the application
which is quiz 1 and quiz 2.
This is the hamburger button that have all button
when user click.
This back button goes to close the hamburger button.
48
This button goes to the home page.
This button goes to page that shown explanation
about ‘Belajar Bacaan Solat’ using AR Technology.
This button goes to page that shown the info of the
application and 12 prayers in Salah with sound.
This button goes to the AR camera are functioned to
go to the next scene which is user able to scan the
flashcard provided to show the 3D object and prayers
in Salah.
This button is sound button. For user tap the button to
listen prayers in Salah.
This button goes to page that shown the practice for
quiz 1.
This button goes to page that shown the practice for
quiz 2.
49
This button is to exit of this application.
This button is cancel button. After user tap the cancel
button then the interface will back into home page.
This button is confirm button. User need to tap this
button if confirm to exit.
This button goes to the previous step how to play page.
This button goes to the next step how to play page.
50
4.2.1 Loading Page
Figure 4.1 Show the loading page. It takes a few second to go home
page when the loading bar already full.
Figure 4.1: Loading Page
4.2.2 Home Page
Based on the figure 4.2 below, show the whole interface for home page.
At there is navigation and it consists of 2 main button such as Scan Button and
Quiz Button, one hamburger button that consists of other button such as back
button, Exit Button, How to Play Button and Info Button.
Figure 4.2: Home Page
51
4.2.3 Info About Apps Page
Based on the figure 4.3 below, it shows about explanation about the
application of ‘Belajar Bacaan Solat’ using AR Technology and 12 prayers
in Salah with sound. User can back to home page when press button home.
Figure 4.3: Info Page
Based on the figure 4.4 and figure 4.5 below, it content 12 prayers
in Salah with sound. User can see the prayers with a sound based on flashcard
and user can go to the next page when click the next button and can go back
to home page when press button home.
Figure 4.4: About Prayers in Salah
52
Figure 4.5: About Prayers in Salah
4.2.4 How To Play Page
Based on the figure 4.6 below, the page that shown how the user need
to do when they using the AR techniques in this application.
Figure 4.6: How to Play Page
53
4.2.5 Scan Page
Based on the figure 4.7 below, the scan page for user to play and learn
the AR used. User need to get the flashcard of Prayers in Salah that have image
which are called as marker. Next, user can scan the image on the flashcard using
scan button and the 3D model will pop up and show the animation. It also the
prayers in Salah will automatically pop up and user can scroll down the details of
Prayers in Salah based on the flashcard that have being scan. In addition, the
user can learn from sound of prayers in Salah.
Figure 4.7: Scan Page
54
4.2.6 Home Page Quiz
Based on the figure 4.8 below, it is about the quiz of the application
which is quiz 1 and quiz 2.
Figure 4.8: Home Page Quiz
4.2.7 Quiz 1 Page
Based on the figure 4.9 below, user must choose true or false based
on the questions given and it has 6 question with the score.
Figure 4.9: Quiz 1 Page
55
4.2.8 Quiz 2 Page
Based on the figure 4.10 below, user must choose the answer based
on the questions given and it has 6 question with the score.
Figure 4.10: Quiz 2 Page
4.2.9 Exit Page
Based on the figure 4.11 are specified interface for those who
want to exit from the applications. There will have ‘ya’ or ‘tidak’ button to
confirm exit.
Figure 4.11: Confirmation Exit Panel.
56
4.2.10 AR Marker
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. In order for an AR application to estimate the orientation and position
of a camera with respect to the real world frame, most applications employ a
tracking technique known as marker based augmented reality.
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. Besides that, Vuforia
developer is a website that let developer check if the image is a suitable marker
and every marker feature. There are 12 markers based. Based on figure 4.12
below, show the example of marker and based on figure 4.13 below, show the
marker features.
57
Figure 4.12: Example of markers
Figure 4.13: Example of features
58
4.2.11 3D Model (12 model)
Augmented Reality or AR is a combination of 2D objects in real
3D environment and present them into virtual objects in a real time. 3D
modelling is the process of developing a mathematical representation of any
surface of an object (either inanimate or living) in three dimension via
specialized software. The product is called as a 3D model. The model can
also be physically created using 3D printing devices. Furthermore, this
project created 3D model using Maya 3D included with the animation and
texture. Based on figure 4.14 until figure 4.25 below, show all the 3D model
in this project.
Figure 4.14: 3D Model ‘Bacaan Niat’
Figure 4.15: 3D Model ‘Bacaan Takbir’
59
Figure 4.16: 3D Model ‘Bacaan Al-Fatihah’
Figure 4.17: 3D Model ‘Bacaan Doa Iftitah’
Figure 4.18: 3D Model ‘Bacaan Rukuk’
60
Figure 4.19: 3D Model ‘Bacaan Iktidal’
Figure 4.20: 3D Model ‘Bacaan sujud’
Figure 4.21: 3D Model ‘Bacaan duduk antara dua sujud’
61
Figure 4.22: 3D Model ‘Bacaan Tahiyat Awal’
Figure 4.23: 3D Model ‘Bacaan Tahiyat Akhir’
Figure 4.24: 3D Model ‘Bacaan Salam’
62
Figure 4.25: 3D Model ‘Bacaan Doa Qunut’
4.2.12 Unity 3D Workspace
Unity 3D Workspace is a platform to create this application
especially the AR contents. Based on figure 4.26 there is Unity 3D
Workspace that content all the interfaces of this application is created here
and then the 3D animation contents then imported from Maya into Unity 3D.
Figure 4.26: Unity 3D Workspace
63
4.3 Testing and Result
System testing also knows as final testing is a technique to evaluate the
performance measures of this application whether it satisfies the requirements or not. The
system testing is to investigate the testing phase where the test of the design and set
requirement. Testing is needed to test system full function and free error. There are two
type testing for this project. Those are test run project and user test run project. Test run
project is when developer test runs the project by herself. This is to ensure that the project
can be used and is running accordingly. Lastly, based on figure 4.27 user testing and
figure 4.28 user testing there is user test run before presenting the final product, developer
give to the user test the project and give the feedback with the interview question about
the application. Criticisms and constructive feedback is taken to be implemented later on.
Figure 4.27 User Testing Figure 4.28 User Testing
64
4.4 Summary
In this chapter, it shows how this application process is done. Part implementa t ion
in this chapter that have been describe and show all the set interface in the application. It
can act as guide for new user to use this application. Testing also have been done to ensure
that all the function run smoothly. Furthermore, it also describes the test case that has
been done during the development processes.
65
CHAPTER 5
CONCLUSION
5.1 Introduction
In this chapter, the result of the project is discussed and concluded. The content of this
chapter will summarize the overall contribution.
5.2 Project Achievement and Contribution
‘Belajar Bacaan Solat’ using AR Technology enhances students understanding and
creates a more engaging and interactive learning that uses new era technology to help
people, especially students and teachers as learning interesting. It has achieved the
objectives and scope of this project. Below is the list of the achievement on this project:
i. Successfully created an AR Marker-based mobile application of prayers
in Salah via flashcard.
ii. Design and develop prayers in Salah flashcard that allow students learning
with augmented reality.
iii. Test prayers in Salah flashcard using augmented reality.
66
5.3 Problem and Limitation
There are a few problems and limitations that occur throughout the development of this project.
This problems and limitation during project development are scanning one image only. It cannot
make two or more scanning and it will not be working. This application must need light when
scanning an image. It cannot work in dark scene. Furthermore, the user needs a latest smartphone
to play this application.
5.4 Future Work
‘Belajar Bacaan Solat’ using AR Technology still has a lot of to be improved. There is
some suggestion that can be made in order to upgrade the application to be more efficient in the
future. The suggestion is adding more learning practices with interactive way. I hope this
application might be a sell in the market so that teacher and students can uses and learn about
Prayers in Salah with technology augmented reality with interactive way.
65
5.5 Summary
In conclusion for this chapter, implementation part in this chapter has been describe
and show all the user interfaces in the android application. It can act as a guide for new user
to use this application. Testing also have been done to ensure that all the functionality achieved
and run smoothly. Maintenance should be carried out if there is any bugs detected. The system
will repeatedly be tested to minimize the error.
66
REFERENCES:
Abdul Manaf, S. Z., Mohamad Zaid, A. S., Din, R., Hamdan, A., Mat Salleh, N. S.,
Kamsin, I. F., Abdul Karim, A., & Lubis, M. A. (2015). Aplikasi Mudah Alih
Panduan Solat dan Pengunaannya. Ulum Islamiyyah Journal, 16, 43–61.
Beynon-Davies, P., Came, C., Mackay, H., & Tudhope, D. (1999). Rapid application
development (Rad): An empirical review. European Journal of Information
Systems, 8(3), 211–232. https://doi.org/10.1057/palgrave.ejis.3000325
Boonbrahm, S., Boonbrahm, P., & Kaewrat, C. (2020). The use of marker-based
augmented reality in space measurement. Procedia Manufacturing, 42(2019),
337–343. https://doi.org/10.1016/j.promfg.2020.02.081
Huttenlocher, D. (2004). Computer vision. Computer Science Handbook, Second
Edition, 43-1-43–23. https://doi.org/10.4324/9780429042522-10
laila majnun (2018). Reuters (1.0)[ Mobile application software]. Retrieved from
https://play.google.com/store/apps/details?id=com.andromo.dev715390.app8640
85&hl=en
Muhamad Naim. (2019, April 4). Panduan Bacaan Dalam Solat (Ejaan Rumi) [Blog
post]. Retrieved from https://akuislam.com/blog/ibadah/bacaan-dalam-solat/
Ramzan, S. (2010). Courseware on E-solat in Mobile (Doctoral dissertation, UMP). 67
Randuic, D. I. (2011). Basic Concepts of Information and Communicat ion
67
Technology Notes. Open Society for Idea Exchange (ODRAZI), Zagreb, 7, 5–15.
Raziah Md Nasib. (2016). Penguasaan Bacaan Rukun Qauli Dalam Solat Dalam
Kalangan Murid Tahun 4 Sekolah Rendah.
http://ddms.usim.edu.my/bitstream/123456789/12602/1/Penguasaan Bacaan
Rukun Qauli Dalam Solat Dalam Kalangan Murid Tahun 4 Sekolah Rendah 25.pdf
Yuen, S. C.-Y., Yaoyuneyong, G., & Johnson, E. (2011). Augmented Reality: An
Overview and Five Directions for AR in Education. Journal of Educational
Technology Development and Exchange, 4(1).
https://doi.org/10.18785/jetde.0401.10
Zainuddin, Z., Areni, I. S., & Wirawan, R. (2016). Aplikasi Augmented Reality pada
Sistem Informasi Smart Building. Jurnal Nasional Teknik Elektro Dan Teknologi
Informasi (JNTETI), 5(3). https://doi.org/10.22146/jnteti.v5i3.258
68
APPENDIX
APPENDIX A (GANTT CHART FYP I)
69
APPENDIX B (GANTT CHART FYP II)
70
APPENDIX C (PROJECT POSTER)
71
APPENDIX D (INTERVIEW QUESTIONS)
USABILITY TESTING ‘BELAJAR BACAAN SOLAT’ (AR)
This section is used to identify the functionality of the "Belajar Bacaan Solat (AR)"
application in providing feedback on applications developed for improvement.
RESPONSE 1
1. Is this application complex for you?
This application is not complicated for me.
2. Is this application easy to use?
Yes, it's very easy to use.
3. Do you need the support of technical people in using this application?
I don't need the support of technical people.
4. Do you find that the functionality in this application is well-integrated?
Yes, very well integrated.
5. Are they out there learning to use this app quickly?
Yes, I think people out there will be able to learn using this app very quickly.
6. Is this application very complicated to use?
It's not complicated for me.
7. Is this application interactive to learning?
YES, it’s very interactive.
8. Do you need to learn a lot before using this application?
I don't think I need to learn much before using this application.