the mobile learning application of …...strength to complete my final year project ii entitled...

THE MOBILE LEARNING APPLICATION OF EDUCATIONAL RELATE TO

ANIMAL’S NAME IN HOLY QURAN

NOR JANNAH BINTI ABDULLAH

BACHELOR OF INFORMATION TECHNOLOGY (INFORMATICS MEDIA)

WITH HONOURS

UNIVERSITI SULTAN ZAINAL ABIDIN

2020

THE MOBILE LEARNING APPLICATION OF EDUCATIONAL RELATE TO

ANIMAL’S NAME IN HOLY QURAN

NOR JANNAH BINTI ABDULLAH

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 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 : NOR JANNAH BINTI ABDULLAH

Date :

ii

CONFIRMATION

This is to confirm that:

The research conducted and the writing of this report was under my supervision.

_____________________________________

Name : PROF. MADYA DR. YOUSEF

ABUBAKER MOHAMED AHMED

EL-EBIARY

Date :

iii

DEDICATION

Alhamdulillah. All thanks to Allah the almighty for blessing me and give me

strength to complete my final year project II entitled “The Mobile Learning Application

Educational Relate to Animal’s Name in Holy Quran”.

I would like to express my deepest gratitude to my supervisor, Prof Madya Dr.

Yousef Abubaker Mohamed Ahmed El-Ebiary for his advice, support and also guidance

towards this project. It was great moment to work under your guidance.

I sincerely thank to all my friends and my beloved lecturer for their advice, support

and also suggestion during the development of my final year project. Last but not least, I

would like to express my gratitude to my beloved parents for their continuous moral

support.

May Allah S.W.T bless all the effort to complete this project.

iv

ABSTRACT

This mobile application development project “The Mobile Learning

Application of Educational Relate to Animal’s Name in Holy Quran” is developed its aims

to facilitate its use and in line with today’s increasingly sophisticated technology. In

producing this mobile phone application. Some objectives and goals are targeted. The main

objectives are to analyze the advantages and disadvantages available on existing mobile

phone applications, designing a better and more attractive interface from the previous

mobile learning application and developing attractive and effective mobile learning

application software to help children know about something new. Besides, this mobile

learning apps that feature various multimedia elements such as text, video, audio and

animation. Among the suggestions suggested to enhance and improve this app is that the

animation produced should be more creative and attractive for the viewing of children and

the buttons created to create interactivity should be more user-friendly.

v

ABSTRAK

Projek pembangunan aplikasi mudah alih "Aplikasi Pembelajaran Mudah Alih

Pendidikan Berkaitan Dengan Nama Haiwan Dalam Quran" adalah dibangunkan

bertujuan untuk memudahkan penggunaannya dan seiring dengan teknologi yang semakin

canggih saat ini. Dalam menghasilkan aplikasi telefon bimbit ini. Beberapa objektif dan

maklumat disasarkan. Objektif utama adalah menganalisis kelebihan dan keburukan yang

terdapat pada aplikasi telefon mudah alih yang sedia ada, mereka bentuk antara muka

yang lebih baik dan lebih menarik dari aplikasi permainan mudah alih sebelumnya dan

membangunkan perisian aplikasi mudah alih yang menarik dan berkesan untuk membantu

kanak-kanak mengetahui sesuatu yang baru. Selain itu, aplikasi permainan mudah alih ini

yang menampilkan pelbagai elemen multimedia seperti teks, video, audio dan animasi.

Antara cadangan yang dicadangkan untuk meningkatkan dan menambahbaikan aplikasi

ini adalah dengan menghasilkan animasi yang lebih kreatif dan butang yang menarik

adalah bagi menarik minat kanak-kanak untuk menonton dan mewujudkan interaktiviti

yang lebih mesra pengguna.

vi

CONTENTS

PAGE

DECLARATION i

CONFIRMATN ii

DEDICATION iii

ABSTRACT iv

ABSTRAK v

CONTENTS vi - xi

LIST OF FIGURES xii - xv

LIST OF TABLES xv

CHAPTER 1 INTRODUCTION

1.1 Background 1

1.2 Problem statement 2

1.3 Objectives 3

1.4 Scopes 3-4

1.5 Limitation Of Work 4

1.6 Activities and Milestones (Gant Chart) 5

1.7 Expected Result 6

vii

CHAPTER 2

LITERATURE REVIEW

2.1 Introduction 7

2.2 Research On Existing Application

Research 1 8

Research 2 9

Research 3 10

CHAPTER 3

METHODOLOGY

3.1 Introduction 11

3.2 Methodology used in application development 12

3.2.1 Analysis 13

3.2.2 Design 13

3.2.3 Development 14

3.2.4 Implementation

3.2.5 Evaluation

15

15

3.3 Project / Application requirements analysis 16

3.3.1 Software Requirements 16-17

3.3.2 Hardware Requirements 17

3.4 Application Design 18

viii

3.4.1 Design Implementation Approach 18

3.4.1.1 Referral Approach 18

3.4.1.2 Screen Approach 18

3.4.1.3 Assistant Approach 18

3.4.1.4 Navigation Map 19

3.5 Framework Design 20

3.6 Storyboard 21

3.6.1 Interface for Start 21

3.6.2 Interface for Enter Name 22

3.6.3 Interface for Main Menu 22

3.6.4 Interface for Learn & Play 23

3.6.5 Interface for Al-Nahl Video 24

3.6.6 Interface for Al-Nahl Quiz 24

3.6.7 Interface for How to Play 25

3.6.8 Interface for Help 25

CHAPTER 4

DEVELOPMENT AND

IMPLEMENTATION

4.1 Specification of Multimedia Element Properties 26

ix

4.1.1 Elements Used 26

4.1.2 Buttons 27-29

4.1.3 Image 29

4.1.4 Video 30

4.2 Software Implementation 30

4.2.1 Start Interface 30

4.2.2 Enter Name Interface 31

4.2.3 Main Menu Interface 32

4.2.4 Help Interface 33

4.2.5 How to Play (Step 1) Interface 34




4.2.9 Learn & Play Interface 38

4.2.10 Al-Nahl Video Interface 39

4.2.11 Al-Nahl Quiz (Question 1)Interface 40




x


4.2.16 Al-Naml Video Interface 45

4.2.17 Al-Naml Quiz (Question 1)Interface 46





4.2.22 Al-Ankabut Video Interface 51

4.2.23 Al-Ankabut Quiz (Question 1) Interface 52





4.2.28 Al-Baqarah Video Interface 57

4.2.29 Al-Baqarah Quiz (Question 1) Interface 58





4.2.34 Al-Fill Video Interface 63

xi

4.2.35 Al-Fill Quiz (Question 1) Interface 64





4.2.40 Finish Game Interface 69

4.3 Coding 70

4.3.1 Next Coding 70

4.3.2 Enter Name Coding 71

4.3.3 score Coding 72

4.3.4 Exit Application Coding 72

CHAPTER 5 CONCLUSION AND SUGGESTION OF

IMPROVEMENT

5.1 Benefits of the Project 73-74

5.2 Improvement Suggestions of Applications 74-75

5.3 Conclusion 75

REFERENCES 76

APPENDIX A (GANT CHART FYP II) 77

ATTACHMENT 78

xii

LIST OF FIGURES

Figure Title Pages

2.1 Animals Mentioned in the Quran 8

2.2 Animals Featured in the Quran 9

2.3 Animals in the Quran 10

3.1 Workflow based on ADDIE Model 12

3.2 Navigation Map 19

3.3 Framework Design 20

3.4 Start Interface 21

3.5 Enter Name Interface 22

3.6 Main Menu Interface 22

3.7 Learn & Play Interface 23

3.8 Al-Nahl Video Interface 24

3.9 Al-Nahl Quiz Interface 24

3.10 How to Play Interface 25

3.11 Help Interface 25

4.1 Start Page 30

4.2 Enter Name Page 31

xiii

4.3 Main Menu Page 32

4.4 Help Page 33

4.5 How to Play (Step 1) Page 34




4.9 Learn & Play Page 38

4.10 Al-Nahl Video Page 39

4.11 Al-Nahl Quiz (Question 1) Page 40





4.16 Al-Naml Video Page 45

4.17 Al-Naml Quiz (Question 1) Page 46





4.22 Al-Ankabut Video Page 51

xiv

4.23 Al-Ankabut Quiz (Question 1) Page 52





4.28 Al-Baqarah Video Page 57

4.29 Al-Baqarah Quiz (Question 1) Page 58





4.34 Al-Fill Video Page 63

4.35 Al-Fill Quiz (Question 1) Page 64





4.40 Finish Game Page 69

4.41 Next button Coding 70

4.42 Enter Name Coding 71

xv

LIST OF TABLES

4.43 Score Coding 72

4.44 Exit Application Coding 72

Table Title Pages

2.1 Animals Mentioned in the Quran 8

2.2 Animals Featured in the Quran 9

2.3 Animals in the Quran 10

4.1 Button 27-29

1

CHAPTER 1

INTRODUCTION

1.1 Background

This world is increasingly sophisticated, everywhere technology. There are

many mobile learning applications existed, one of which is the form of learning. In line

with the development of information and multimedia technology today. This project

aims is to develop interactive application software that can change the way learning in

a more responsive and fun way.

The title “The Mobile Learning Application of Educational Relate to Animal’s

Name in Holy Quran” has been selected in producing the product. This mobile learning

application is developed for children aged 4 to 12 years old. It is specially designed to

help children to know valuable information about surah that used the animal’s name as

the name, such as Al-Fill, Al-Naml, Al-Nahl, Al-Ankabut, and Al-Baqarah. This

application contains multimedia elements such as audio, video, text, graphics and

animation. Audio and animation effects are entered to realize interactions between users

2

and interactive development. Therefore I will take an alternative to present this

application in a more understandable form and to let the kids learn about this in a very

funny and playful way.

1.2 Problem Statement

• Children nowadays were more interested to play games or learning something using

either mobile phones, computers, smartphones, or tablets than read a book or Holy

Quran.

• Most Children did not know about an animal’s stories in Holy Quran.

• Children are less and miss focus when telling them a story and difficult to imagine

than learn through phone or playing a game.

3

1.3 Objectives

The main objectives of this project are:

• To design an interesting mobile learning application for children from 4 up to 12

years old.

• To develop a fun mobile learning application that teach the kids the animals stories

that mentioned in the Holy Quran as Surah’s name in order to improve their Islamic

moral.

• To test efficiency of the application.

1.4 Scopes

• Smartphone

Smartphone must be provided.

• Android Platform.

This mobile learning application runs on Android Platform.

• Target User

The application targets children from 3 up to 12 years old

4

• Rating

This application provides THREE (3) levels. Such database score

assessment every level will be applied.

• Focus SIX (5) Surah

The application Focuses on SIX (5) surah’s as following:

Al- Fill, Al- Naml, Al-Nahl, Al-Ankabut, and Al-Baqarah.

1.5 Limitation of Work

• Can only be used using the smartphone environment.

• Only Android platform is suitable.

• More suitable for kids.

• Off-line mobile learning application.

5

1.6 Activities and Milestones (Gant Chart Fyp I)

TASK NAME

JANU

ARY FEBRUARY MAC APRIL

MAY

1 2 3 4 5 6 7 8 9 1

0 11 12 13 14 15

Topic Discussion

Project Title

Proposal

Proposal Writing

Proposal Writing

–

Literature Revie

w

Proposal Progres

sPresentation &

Evaluation

Discussion

Correction

Proposal

Proposed Solutio

n Methodology

Proof of Concept

Drafting Report

of The Proposal

Submit Draft of

Report to

Supervisor

Preparation For

Final Presentatio

n

Seminar

Presentation

Final Report

Submission

6

1.7 Expected Result

Make the user feel easy to use interface and the interactive mobile learning

application will engage the kids to learn more about Islam. Besides, to give exposure to

children’s about the surah that relates with animal’s name in gaming way. Lastly,

children will get more knowledge and will be aware of surah’s that have an animal’s

name as a title.

7

CHAPTER 2

LITERATURE REVIEW

2.1 Introduction

Literacy studies defined as making critical and systematic references to

documents containing information, ideas, data and methods of obtaining information

relating to the subject of a study conducted. Literacy studies are an important part of

research in which researches are conducting surveys on past studies. After the researcher

determines the theme of the study, the researcher will make a literacy study to obtain

the appropriate past study information. Among the information referred to from the

literary study include theories, designs, instrumentation studies, study procedures,

methods of data collection and research findings. The main purpose of literacy studies

is to put the study to be conducted on a scientific perspective.

8

2.2 Research

2.2.1 Research 1 : Animals mentioned in the Quran Application

The ”Animals mentioned in the Quran” application developed by ILMASOFT

DEEN in September 2019. The application uses Andorid version 1.0.2 and does not

use full internet connection to access. There are several advantages and

disadvantages to this application. Refer figure 2.1 and table 2.1.

Figure 2.1: Animals Mentioned in the Quran

Table 2.1: Animals Mentioned in the Quran

Advantages Disadvantages

Easy to understand

Easy to use

The interface is so

compact

Not suitable for

kids because of the

content so heavy

9

2.2.2 Research 2 : Animals featured in the Quran Application

“The Animals featured in the Quran” application developed by Tinnytapps in

May 2012. The application uses Android version 2.2 and does not use full internet

connection to access. There are several advantages and disadvantages to this

application. Refer figure 2.2 and table 2.2.

Figure 2.2: Animals Featured in the Quran

Table 2.2: Animals Featured in the Quran


The combination

colour use to contrast

with text.

There is no help

button

10

2.2.3 Research 3 : Animals in the Quran books

“The Animals in the Quran” books written by Nyla Ahmad in 2018. There

are several advantages and disadvantages to this application. Refer figure 2.3 and

table 2.3.

Figure 2.3: Animals in the Quran

Table 2.3: Animals in the Quran


The combination

colours of interface

are suitable.

Low attraction for

children to read the

book.

11

CHAPTER 3

METHODOLOGY

3.1 Introduction

In this chapter, we will discuss about the methodology that will be used in

developing the system. The methodology was very important element because its act as

guide throughout the system development in order to produce a complete and

functioning system. The process of developing an application is a through process and

it must be done stage by stage according to its own phases. There are many application

development phase models that can be used in developing an application and an

application development process can use a particular model only or incorporate

elements from different development models to serve as a guideline when the

application is developed.

12

3.2 Methodology used in application development

MODEL ADDIE

This model is among the instructional design models that often become the basis of

other instructional design models. Generally, the ADDIE Model (Rosset, 1987) can be

represented by the workflow as shown in the diagram below. Refer figure 3.1.

Figure 3.1: Workflow based on ADDIE Model

13

3.2.1 Analysis

In this phase we make some research and the problem that want to solve will be

identified as a whole. Problems can be determined through various methods or

techniques such as interviews, observations, surveys, and so on.

Once a problem can be identified, it is necessary to find out what causes or the

factors that cause the problem. This is to ensure the application of the learning to be

developed meets the needs of actual user. Therefore, in this phase several analysis have

been implemented on various aspects. Among them are analysis of user environments,

analysis of users, identifying the purpose of this application and so on.

3.2.2 Design

In this phase is the idea will be create or design the application interface by

designing a storyboard. It also explain overall view of the interface, structure, approach

of this application, the type of media and technology used.

The development of this mobile learning get the right objectives and can be

reached by the user after successfully completing the mission of this application. The

development of this learning application also checks the way or method for this learning

to be easily understood by the user.

14

3.2.3 Development

Based on financial allocation, media resources, time and so forth, this learning

application needs to be developed based on the design that has been designated through

the design phase. Development here refers to the process of developing or producing

software using existing applications such as programmer’s app, authoring, graphics,

audio and so on.

In this development phase also, it uses any designs or designs agreed upon in the

design, for example:

Users are provided with help to prevent users from experiencing problems

using software.

Content in the mobile learning of the resulting learning must be compatible

with the level of ability, age, background, user and so on.

Interesting stimuli such as multiple graphics, sound effects and so forth are

provided for users not to be tired of playing this mobile learning

application.

15

3.2.4 Implementation

Application learning “The Mobile Learning Application Of Educational Relate

To Animal’s Name in Holy Quran” is ready to be presented to test the effectiveness and

see the unnoticed problems during the design and development phase that may exist and

also this application prototype that to be tested by the developer and the supervision

panel in order to improve the application in case of finding comments. So that, the repair

or recovery process will be implemented before the application is actually issued or used

officially.

3.2.5 Evaluation

In this phase the system will be evaluated by the end user to make sure that

application is function in proper way. And if the application in line with the user’s scope.

Evaluation also involves the process of obtaining feedback from users on the content,

strategic, graphic,interfaces and so forth contained in this mobile learning application

either through supervision, testing, questionnaires and interviews and so on to ensure it

is appropriate or not to use.

16

3.3 Project /Application Requirements Analysis

In this developing mobile learning applications, all aspects need to be taken care

of, in terms of project requirements so that the process goes smoothly. The project

requirements are software requirements and hardware requirements.

3.3.1 Software Requirements

The main software that we used to develop this mobile learning application is

Unity 3D. This software is very much needed to organize and animate images. In

addition, there are other software used in the process of developing this mobile learning

application which is :

Unity 3D

Build mobile learning application

Adobe Flash CS6

Arrange, animate images, interfaces

Adobe Photoshop

Edit an image, design the logo, background and interface

of the application.

Microsoft Word 2016

Do the documentation of application

17

Google Chrome

Searching for information

3.3.2 Hardware Requirements

In develop the mobile learning application, the hardware requirements also

something that are very important and needed. The requirements as below :

Laptop

Lenovo

Processor

Intel (R) Core (TM) i5-5200U CPU @ 2.20GHz 2.20GHz

Laptop Memory

8.00 GB

Pendrive

HP16.00 GB

Mouse

Mobile phone

Iphone 6 – 64GB

During the development process, hardware and software compability is crucial

to avoid any undesirable problems.

18

3.4 Application Design

3.4.1 Design Implementation Approach

The application development mobile learning “The Mobile Learning

Application Educational Relate to Animal’s Name in Holy Quran” has been

using various approaches such as :

3.4.1.1 Referral Approach

Through this, referrals can be given by way of text usage. The

briefing instruction provided is to help the user to understand the contents of

this mobile learning applications. A brief description in the help module also

uses the same method and it briefly explains the mission that needs to be done.

3.4.1.2 Screen Approach

Through this approach, the text approach has been used in the aid

module section because in the form the text makes it easier for users to read

and understand instructions repeatedly.

3.4.1.3 Assistant Approach

Through this section, users can know about this application by simply

reading at the corner of the page module. In this app also, users are provided

with the instruction at the beginning of the mobile learning with this, it

19

facilitates the user to understand the learning’s needs and the learning’s

information.

3.4.1.4 Navigation Map

In developing this project, a navigation map sketch was created to

illustrate the continuity between one interface and another. In addition, the

navigation map also serves to give you an overview about the container in

this mobile learning application. Refer figure 3.2.

Figure 3.2: Navigation Map

20

3.5 Framework Design

Figure 3.3: Framework Design

Figure 3.3 above shows the framework design. Admin can update the application

while user or player can choose any button in this application. The database is in the

library in adobe flash. And Unity 3D will be used to create overall application.

21

3.6 Storyboard

In order to develop this project, the storyboard should be made available before

making this mobile learning application. It is most important things that we needed to

facilitate the development of this applications as a reference and it is used so that it is

in line with the navigation map. The storyboard is based on the selected topic and it

will not escape the navigation that has been made. With this storyboard, the entire

interface can be built from the beginning to the end.

3.6.1 Interface for Start

Figure 3.4 is the start interface for this interactive application. The user will be

asked to press the “START” button first before the go to the next page.

Figure 3.4: Start Interface

22

3.6.2 Interface for Enter Name

Figure 3.5 is the enter name interface for this application. The user must enter

the name first to play the application.

Figure 3.5: Enter Name Interface

3.6.3 Interface for Main Menu

Figure 3.6 is the main interface for this application. There are two buttons

with their own name in this section.

Figure 3.6: Main Menu Interface

23

3.6.4 Interface for Learn & Play

Figure 3.7 is the learn & play interface, in this section there have the video. There

are five video. The user should press the button of the animal’s picture to play the video.

While the user should press the “Home” button to go to the Home Page and press “Exit”

button to exit this application.

Figure 3.7: Learn & Play Interface

3.6.5 Interface for Al-Nahl Video

Figure 3.8 is the Al-Nahl video interface. The user can press the “Pause” button

to pause the video, “Stop” button to stop the video and “Next” button to play the quiz.

Figure 3.8: Al-Nahl Video Interface

24

3.6.6 Interface for Al-Nahl Quiz

Figure 3.9 is the Al-Nahl quiz interface. The user must choose the right answer

to get the score and press “Homepage Video” button to play the other video.

Figure 3.9: Al-Nahl Quiz Interface

3.6.7 Interface for How to Play

Figure 3.10 is the how to play interface. The user should press the “Home” button

to go to the Home Page and press the “Next” button for see the other step and also the

“Exit” button to exit this application.

Figure 3.10: How to Play Interface

25

3.6.8 Interface for Help

Figure 3.11 is the help interface. Users need to press the “Home” button

to go to the Home Page and press the “Exit” button to exit this application.

Figure 3.11: Help Interface

26

CHAPTER 4

DEVELOPMENT AND IMPLEMENTATION

4.1 Specification of Multimedia Element Properties

In the interface design, elements such as buttons, image graphics, animations

and audio are included. These elements have certain processes to produce them.

4.1.1 Elements Used

In this chapter, development will show and describe the elements contained in

the application of this learning. The elements used are buttons, images and audio.

27

4.1.2 Buttons

Table 4.1 shows the buttons displayed on each interface. This can make it easier

for users to navigate to the desired part. Among the buttons used are:

Table 4.1: Button

Button Description

This button is to start the learning

application and goes to the enter

name page.

This button goes to the main menu

page.

This button goes to the video page

and quiz page. Learn & Play have

five video that the user need to

choose.

This button goes to the how to play

page that shown the steps how to

play this application.

28

This button goes to quiz pages.

This button is to exit this application.

This button goes to the homepage.

This button goes to homepage video.

This button goes to help button.

This button goes to the previous

page.

This button goes to the Al-Nahl

video page.

This button goes to the Al-Fill video

page.

This button goes to the Al-Ankabut

video page.

29

This button goes to the Al-Naml

video page.

This button goes to the Al-Baqarah

video page.

4.1.3 Audio

The audio that will be included in this learning application is based on pre-

prepared audio so that it matches the application. Audio included in this app from a song

that is captured, edited and converted in format using the Audio Converter Software.

4.1.4 Image

The images generated in the development of this application have been created

entirely from Adobe Flash and Adobe Photoshop.

4.1.5 Video

The video generated in the development of this app have been created entirely

from Adobe Flash.

30

4.2 Software Implementation

In this app, when start the software, it is divided into several parts of which are

enter the name, learn & play, videos, quiz and how to play. When this project is

implemented, the first interface as shown below.

4.2.1 Start Interface

Figure 4.1: Start Page

Figure 4.1 as the first interface that displays the animals that have been used as

the name’s surah in Holy Quran and button “START”.

31

4.2.2 Enter Name Interface

Figure 4.2: Enter Name Page

Figure 4.2 shows the interface of enter name. In this interface user should enter

their name and press button “ENTER” to go to the next page.

32

4.2.3 Main Menu Interface

Figure 4.3: Main Menu Page

Figure 4.3 shows the interface for main menu. In this interface there is a button

that represents the sub-menu of its own. There are four main buttons in this game which

are learn & play, how to play, help and exit. Each button has its own screen display.

33

4.2.4 Help Interface

Figure 4.4: Help Page

Figure 4.4 shows the interface of Help. In this interface there are seven button

with their name. This is as a guard for user to know about button in this application.

34

4.2.5 How to Play (Step 1) Interface

Figure 4.5: How to play (Step 1) Page

Figure 4.5 shows the interface of How to Play (Step 1). In this interface there is

description for the first step for play this application.

35




description for the second step for play this application.

36




description for the third step for play this application.

37




description for the forth step for play this application.

38

4.2.9 Learn & Play Interface

Figure 4.9: Learn & Play Page

Figure 4.9 shows the interface of Learn & Play. In this interface there have the

bee button, ant button, spider button, cow button and elephant button. User need press

any button that they like to watch.

39

4.2.10 Al-Nahl Video Interface

Figure 4.10: Al-Nahl Video Page

Figure 4.10 shows the interface of Al-Nal Video. In this interface there have the

animation story about Surah Al-Nahl, The content for this video is “Hello, my name is

Nana Bee. What do you know about me? Actually that has the surah in Al-Quran that

used the name of me. The surah is Al-Nahl. This surah talks about the proof of greatness

Allah SWT in this reverse. Surah Al-Nahl is number 16th in the Quran, it has 128 verse

and takedown in Makkah. The verse of 68-69 about Allah told to bee to build the nest

in the mountains, on the tree and the buildings that people make it. Then feed on all

kinds of fruit and follow the ways made easy for you by Allah. From their bellies comes

a honey of different colours in which there is healing for people. The truth is a sign in

this for those who think.” For a user that want stop, play and pause this video user can

press the button at right-down and for go to the quiz user need to press “LET’S PLAY”

button.

40

4.2.11 Al-Nahl Quiz (Question 1) Interface

Figure 4.11: Al-Nahl Quiz (Question 1) Page

Figure 4.11 shows the interface of Al-Nahl Quiz (Question 1). In this interface

user need to choose the right answer to get the score.

41





42





43





44





45

4.2.16 Al-Naml Video Interface

Figure 4.16: Al-Naml Video Page

Figure 4.16 shows the interface of Al-Naml Video. In this interface there have

the animation story about Surah Al-Naml, The content for this video is “Hello. My

name is Hana. What do you know about me? Actually, there have the surah in Al-Quran

that use the name of me. The surah is Al-Naml. In this surah Al-Naml stated in verses

18 and 19 there is the word An-Naml (ant), where the ant king tells his men to enter

their own nests, so that they will not be attacked by Prophet Sulaiman and his army who

will pass by that place. And do you know that? Prophet Sulaiman can speak with the

animals. And one more thing is, this surah is number 27th in Al-Quran, it has 93 verse

and takedown in Makkah.” For a user that want stop, play and pause this video user can


button.

46

4.2.17 Al-Naml Quiz (Question 1) Interface

Figure 4.17: Al-Naml Quiz (Question 1) Page

Figure 4.17 shows the interface of Al-Naml Quiz (Question 1). In this interface


47





48





49





50





51

4.2.22 Al-Ankabut Video Interface

Figure 4.22: Al-Ankabut Video Page

Figure 4.22 shows the interface of Al-Ankabut Video. In this interface there

have the animation story about Surah Al-Ankabut. The content for this video is “Hello.

My name is Didi. What do you know about me? Actually, there have the surah in Al-

Quran that use the name of me, the surah is Al-Ankabut. This surah is number 29th in

Al-Quran, have 69 verse and takedown in Makkah. The story that related to spider is

when Prophet Muhammad and Saidina Abu Bakar run away and hides from kuffar

Quraish in Ghar Thur, and Allah SWT gives directions to the spider to build the nest at

the entrance of Ghar Thur so that the Kuffar Quraish could not find Prophet Muhammad

and Saidina Abu Bakar.” For a user that want stop, play and pause this video user can


button.

52

4.2.23 Al-Ankabut Quiz (Question 1) Interface

Figure 4.23: Al-Ankabut Quiz (Question 1) Page

Figure 4.23 shows the interface of Al-Ankabut Quiz (Question 1). In this

interface user need to choose the right answer to get the score.

53





54





55





56





57

4.2.28 Al-Baqarah Video Interface

Figure 4.28: Al-Baqarah Video Page

Figure 4.28 shows the interface of Al-Baqarah Video. In this interface there

have the animation story about Surah Al-Baqarah. The content for this video is “Hello.

My name is Sapi. What do you know about me? Actually, there have the surah in

Alquran that use the name of me. The surah is Al-Baqarah. The story that can relate to

this surah is when Allah SWT commanded to Bani Israel to slaughter the cow. This

surah is number 2th in Al-Quran, it has 286 verse and take down in Medina..” For a

user that want stop, play and pause this video user can press the button at right-down

and for go to the quiz user need to press “LET’S PLAY” button.

58

4.2.29 Al-Baqarah Quiz (Question 1) Interface

Figure 4.29: Al-Baqarah Quiz (Question 1) Page

Figure 4.29 shows the interface of Al-Baqarah Quiz (Question 1). In this


59





60





61





62





63

4.2.34 Al-Fill Video Interface

Figure 4.34: Al-Fill Video Page

Figure 4.34 shows the interface of Al-Fill Video. In this interface there have the

animation story about Surah Al-Fill. The content for this video is “Hello. My name is

Didi. What do you know about me? Actually, there have the surah in Alquran that use

the name of me. The surah is Al-Fill. This surah talks about the punishment of Allah

SWT to the elephant's army that want to destroy the Kaaba.This surah is number 105th

in Al-Quran, it has five verse and takedown in Makkah.The story of this surah is when

Abrahah who is the king at the time give directions to the elephant's army to destroy

the Kaaba. But Allah SWT sents of birds against them and pelting them with pellets of

hard-baked clay.Then they are like leaves eaten by the caterpillar.” For a user that want

stop, play and pause this video user can press the button at right-down and for go to the

quiz user need to press “LET’S PLAY” button.

64

4.2.35 Al-Fill Quiz (Question 1) Interface

Figure 4.35: Al-Fill Quiz (Question 1) Page

Figure 4.35 shows the interface of Al-Fill Quiz (Question 1). In this interface


65





66





67





68





69

4.2.40 Finish Games Interface

Figure 4.40: Finish Games Page

Figure 4.40 shows the interface of the finish game, this page will appear in last

of every animal’s quiz or when the user finishes answering the last question. The total

score that the user gets also appear at the right-up.

.

70

4.3 CODING

In this application, every process, button, section and page have their own

coding. The coding was write in Microsoft Video Studio.

4.3.1 Next Coding

Figure 4.41: Next button coding

71

4.3.2 Enter Name Coding

Figure 4.42: Enter name coding

72

4.3.3 Score Coding

Figure 4.43: Score coding

4.3.4 Exit Application Coding

Figure 4.44: Exit Application coding

73

CHAPTER 5

CONCLUSION AND SUGGESTIONS OF

IMPROVEMENT

5.1 Benefits of the Project

The learning application project titled The Mobile Learning Application of

Educational Relate to Animal’s Name in Holy Quran can benefit users in helping

children to be more interested in learning and can sharpen the understanding of children

in the educational of Holy Quran. In addition, this package indirectly generates

technology-generation of IT because the use of applications in smartphones and the

android systems are required to use this app.

Among the benefits of this mobile learning application are:

Attract the interest of consumers especially children.

Combines the areas of technology and educational elements in one app.

74

Develop a mobile learning app that has a consistent theme.

5.2 Improvement Suggestions of Applications

The mobile application project titled The Mobile Learning Application of

Educational Relate to Animal’s Name in Holy Quran is successfully completed, but

there are still many weaknesses available. However, the presence of this learning

application can be a driving force for future generations to produce much better learning

application and still not available in the market. Some suggestions to improve this app

are:

The learning app needs to be more creative by adding more animations to suit

the targeted group.

Buttons should be more interactive to be more user-friendly.

Add missions in learning application to make the learning more challenging and

fun.

Have database that user can know their position like high score.

Use more appropriate and more attractive audio and sound.

75

5.3 CONCLUSION

As a conclusion, with this learning game, the elements of fun and entertainment

can be applied so that children can feel that learning using this method is a good way of

learning, as well as helping parents to more easily teach children.

Additionally, this mobile learning has so many benefits in the early childhood

learning process to recognize the animal’s in the Holy Quran. The mobile learning

application of educational relate to animal’s name in Holy Quran can create interest and

motivate children. This will make the child more understand about the Holy Quran. The

application of this learning is an interactive learning in line with the ever-expanding

ICT industry in today's modernization.

76

REFERENCES

1. Ahmad, A. (2014). 12 Animal Stories From The Quran. Affiliate , 119.

2. Bahjat, A. (2012). ANIMALS IN THE GLORIOUS QUR’AN relating their

own stories. Agama Rasmi, 03-05.

3. Faisal, S. A. (2017, july 14). -463- THE ANIMALS IN THE HOLY QURAN.

Retrieved from Authentic Tauheed:

http://www.authentictauheed.com/2013/07/463-animals-in-holy-quran.html

4. Ghazal, R. (2017, may 24). Creatures of the Quran: domesticated animals.

Retrieved from Art & Culture: https://www.thenational.ae/arts-

culture/creatures-of-the-quran-domesticated-animals-1.635674

5. Haris, A. (2013). Ants and bee as Quranic Allegory within Al-quran.

Pendidikan Agama Islam- Ta'lim, 48.

6. Al-Quran (Holy Quran)

77

APPENDIX A (GANT CHART FYP II)

ACTIVITY WEEK

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

Project Meeting

with Supervisor

Project Development

Proposal Progress

Presentation & Evaluation

Project Development

Project Testing

Final Year Project Format Writing

Workshop

Project Testing

(continued)

Submit Draft

Report and Documentation of

the project

Preparation for

Final Presentation

Final Presentation

and Panel's Evaluation

Final Thesis

Submission and Supervisor's

Evaluation

78

ATTACHMENT

1) Application Logo

2) Application Poster

the mobile learning application of …...strength to complete my final year project ii entitled...

Documents