INTERACTIVE E-MEDICINE APPLICATION
USING MOBILE
AHMAD NAZMI BIN MAHAMMED
BACHELOR OF INFORMATION TECHNOLOGY
(INFORMATIC MEDIA) WITH HONOURS
UNIVERSITI SULTAN ZAINAL ABIDIN
2018
INTERACTIVE E-MEDICINE APPLICATION
USING MOBILE
AHMAD NAZMI BIN MAHAMMED
BACHELOR OF INFORMATION TECHNOLOGY (INFORMATIC MEDIA)
WITH HONOURS
Universiti Sultan Zainal Abidin, Terengganu, Malaysia
DECEMBER 2018
i
DECLARATION
I at this moment declare that this report based on my original work except for
quotations and citations, which have duly acknowledged. I also state that it has not
previously or concurrently submitted for any other degree at Universiti Sultan Zainal
Abidin or other institutions.
Signature :…………………………………
Name : Ahmad Nazmi Bin Mahammed
Date : ...................................................
ii
CONFIRMATION
This project the E-Medicine Application was prepared and submitted by Ahmad
Nazmi Bin Mahammed (Matric Number: 044685) and has been found satisfactory in
terms of scope, quality, and presentation as partial fulfillment of the requirement for
the Bachelor of Of Information Technology (Informatics Media) with honors in
University Sultan Zainal Abidin.
Signature : …………………………………
Supervisor : Puan Maizan Binti Mat Amin
Date : …………………………………………
iii
DEDICATION
Firstly and foremost praised to Allah, for giving me the opportunity to
complete my final year project, E-Medicine Application using android smartphone
forgive me the strength and ability to finish this report. I also would like to express my
gratitude to my supervisor, Puan Maizan Binti Mat Amin for valuable advice,
guidance, and ideas given through the development of research until the end of my
final year project. In addition, thanks to my friend and family that give courage and
motivation during my research.
Finally, special thanks to all lecturers that giving a guideline for my research
during my presentation on E-Medicine Application’s project.
iv
ABSTRACT
In this increasingly advanced age, the need for a knowledge of medicines is
essential for all societies regardless of the children, adolescents, or old colorants. This
is because the community today is very concerned with their own health care and
balance of their body to reduce any likelihood of harmful illnesses to them. However,
some people are less susceptible to medicines recommended by the medical personnel
and the use of the drug in a manner approved by the health ministry. To address such
things, the E-Medicine Application project is built to expose a medicine related
information to all societies so that they know and follow all the procedures of digital
medicine. Additionally, the E-Medicine Application is an application that aims at
learning and teaching to the user by providing brief and fun information. The E-
Medicine application will provide information about medicines by displaying 3D
animation videos where it aims to attract all societies, especially children and
adolescents. In addition, the application will also state the type of drug and the codes
contained in the medication instructions for an image description to facilitate the user
understand what the application is trying to convey. In conclusion, this E-Medicine
Application project is aimed at awareness and dissemination of knowledge about
medicines to the community today to facilitate them to understand the concept of
taking all medicines with proper procedures and recommendations by health
professionals.
v
ABSTRAK
Pada zaman yang kian maju ini, keperluan sesuatu pengetahuan tentang ubat-
ubatan amatlah penting bagi semua masyarakat tidak kira golongan kanak-kanak,
remaja, dewasan mauhupun golognan tua. Hal ini kerana masyarakat sekarang
sangat mementingkan penjagaan kesihatan diri dan juga daya keseimbangan tubuh
badan mereka bagi mengurangkan sebarang kebarangkalian penyakit-penyakit
yang berbahaya kepada diri mereka. Walau bagaimanapun, ada sesetengah
masyarakat kurang terdedah tentang ubat-ubatan yang disyorkan oleh pihak
perubatan dan prosedur penggunan ubat tersebut dengan cara yang diluluskan oleh
kementerian kesihatan. Untuk mengatasi perkara-perkara sebegini berlaku, projet
Aplikasi E-Medicine dibina bagi mendedahkan sesuatu maklumat yang berkait
dengan ubat-ubatan kepada semua masyarakat supaya mereka mengetahui dan
mengikut segala prosedur ubatan-ubatan secara digital. Selain itu, Aplikasi E-
Medicine ini adalah sesuatu aplikasi yang bertemakan pembelajaran dan juga
pengajaran kepada pengguna itu dengan memberikan sesuatu maklumat secara
ringkas dan menyeronokkan. Aplikasi E-Medicine ini akan memberikan sesuatu
maklumat tentang ubat-ubatan dengan memaparkan video animasi 3D di mana ia
bertujuan menarik minat semua masyarakat terutamannya golongan kanak-kanak
dan golongan remaja. Di samping itu, aplikasi in juga akan menyatakan jenis
sesuatu ubat dan kod-kod yang terdapat pada arahan ubat tersebut bagi secara
gambaran imej bagi memudahkan pengguna memahami apa yang cuba
disampaikan oleh aplikasi itu. Kesimpulannya, projek Aplikasi E-Medicine ini
vi
adalah bertujuan ke arah kesedaran dan penyebaran ilmu tentang sesuatu ubat-
ubatan kepada masyarakat sekarang bagi memudahkan mereka memahami konsep
pengambilan segala-ubat-ubatan dengan prosedur yang betul dan disarankan oleh
pihak kesihatan.
vii
CONTENT
PAGE
DECLARATION i
CONFIRMATION ii
DEDICATION iii
ABSTRACT iv
ABSTRAK v
CONTENTS vii
LIST OF TABLE ix
LIST OF FIGURES x
CHAPTER I INTRODUCTION
1.1 Project Background 1
1.2 Problem Statement 2
1.3 Objectives 2
1.4 Scope
1.4.1 User Scope
1.4.2 Contents Scope
3
1.5 Expected Result 3
1.6 Limitation 3
1.7 Milestone and Activities 4
1.8 Report Structure 5
CHAPTER II LITERATURE REVIEW
2.1 Introduction 6
2.2 Courseware
2.2.1 2D and 3D Animation Technique
6
2.3 Related Work 7
2.3.1 An Evolutionary Approach to IT Support for
Medical
8
2.3.2 Trend in Interactive Knowledge discovery
Medicine
2.3.3 The Epidemiology of Medical Errors Article
8
8
viii
2.4 Existing Application 9
2.4.1 Epocrates App 9
2.4.2 Drugbook App 10
2.4.3 Kenali Ubat Anda App 11
2.5 Overall Analysis 12
CHAPTER III
METHODOLOGY
3.1 Introduction 13
3.2 ADDIE Model 13
3.2.1 Analysis Phase 14
3.2.2 Design Phase 14
3.3.3 Development Phase 15
3.3.4 Implementation Phase 15
3.3.5 Evaluation Phase 16
3.3 Hardware and Software Requirements
3.3.1 Hardware
3.3.2 Software
16
3.4 Application Design and Modeling Application 18
3.4.1 Intro for E-Medicine
3.4.2 Login
3.4.3 The Main Menu
3.4.4 Apps Info
3.4.5 Learn Video
3.4.6 Gallery
3.5 Summary 25
REFERENCE 26
ix
LIST OF TABLES
TABLE CHAPTER I PAGE
1.1 Show the Activities of E-Medicine Apps
4
TABLE CHAPTER II PAGE
2.1 The Comparison Between the Article Source
7
2.1 The Overall Analysis of Application
12
x
LIST OF FIGURES
FIGURE CHAPTER I PAGE
1.1 The Navigation Map of E-Medicine Apps 3
FIGURE CHAPTER II PAGE
2.1 The Example of Epocrates Apps 9
2.2 The Example of Drugbook Apps 10
2.3 The Example of Kenali Ubat Anda Apps 11
FIGURE CHAPTER III PAGE
3.1 The Rule of ADDIE Model 14
3.2 The Intro Page of E-Medicine Apps 19
3.3 The Login Page of E-Medicine Apps 20
3.4 The Main Menu of E-Medicine Apps 21
3.5 The Info of E-Medicine Apps 22
3.6 The List Video in E-Medicine Apps 23
3.7 The Gallery in E-Medicine Apps 24
1
CHAPTER 1
INTRODUCTION
1.1 Project Background
The application is one of the systems that operate by requiring a gadget like a
smartphone commonly used by today's society. The smartphone is now familiar with
our society as it is used to communicate online, take pictures, search virtual
information and more. To increase the level of smartphone usage, more applications
are built to provide users with satisfaction and help in finding any information needed
by the user. As you know, apps are helping many users in the form of management,
business and also medicine. Medical applications also help users in many ways
including using the medicine in the right way, especially secondary school students.
With the latest applications, they can study medicine in new ways to show the
difference in the way they learned beforehand such as the use of textbooks and more.
Besides, the application can be an awareness application to the public as well. A
variety of useful applications was created to help users learn and find the important
information in their lives such as health and medication apps (E-Medicine App). The
E-Medicine app is to develop information on the use of medicines recommended by
the medical personnel. For example, coded X is a non-poison medicine (OTC) which
is paracetamol. Additionally, the E-Medicine App will also display information on
general (over the counter) medicines and controlled medicine. By using the E-
Medicine App, we can find out the effects of taking irregular medicine on personal
health. For this application, it will build an app using Adobe Animate CC to build the
interface that is compatible with this application. In addition, the XAMPP will use to
build a database in this application. Furthermore, Adobe Photoshop is also in the
process of generating this application.
2
1.2 Problem Statement
The problem that occurs such as follow:
1. Lots of information learning about medicine is based only on textbooks.
2. Information in the form of text is difficult to describe for the student.
3. Less exposure in learning proper medication for student.
1.3 Objectives
The objective of this project are as the following :
1. To design E-Medicine application about proper medication.
2. To develop E-Medicine application.
3. To test the functionality of the proposed application.
1.4 Scope
The scope for this project are identified to make the application development
process easier. The scope is divided into two which are user scope and contents
scope.
1.4.1 User scope
Able to login into the application.
Able to use the function of button menu in the application.
Able to see the video in the application.
3
1.4.2 Contents scope
Have more interactive information about proper medication.
Have a quiz about of medicine for student.
The application get connect to database.
Figure 1.1: The Navigation Map of E-Medicine Apps
1.5 Expected Result
The student can use the E-Medicine App to find information about medicines.
Besides that, this application will show to the student how to take the medicine to
follow the correct procedure in medical. Besides, it also can do attract activity
provided by the application’s E-Medicine.
1.6 Limitation
This application has a login that needs to be filled by the user to enter the main
menu in the E-Medicine application. besides, the E-Medicine has a submenu in it
like as the apps info, types of medicine, procedure learning, safety procedure,
4
benefit, effect, code medicine, activities, and gallery. Furthermore, this application
has the database using the XAMPP software.
1.7 Milestone and Activities
The guideline of the E-Medicine Application is important to make the process of
this project will smooth and follow the procedure.
Table 1.1 Show the Activities of E-Medicine Apps
Task name
SEPTEMBER OCTOBER NOVEMBER DECEMBER
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
Topic Discussion
and Determination
Project Title
Proposal
Proposal writing
Literature Review
Proposal Progress
Presentation &
Evaluation
Discussion
Correction
Proposal
Proposed Solution
Methodology
Proof of Concept
Drafting Report of
the Proposal
Submit draft of
report to
supervisor
Seminar
5
Presentation
Final Report
Submission
1.8 Report Structure
Thesis structure is a summary of the whole project that divided into 6 chapters.
Chapter 1 will discuss the introduction, problem statement, objective, scope,
expected result and limitation. Chapter 2 will discuss the existing system. In
Chapter 3, design and modeling will also be discussed. Chapter 4 will show
the implementation of the system. Chapter 5 will show testing and result of the
system. Lastly, Chapter 6 is the conclusion of the whole project.
6
CHAPTER 2
LITERATURE REVIEW
2.1 Introduction
This chapter discuss about literature review for existing system. There
is 3 existing systems that will by study and analyze that is Epocrates App,
Drugbook App and also Kenali Ubat Anda App. The chapter also discuss
about the algorithm that will be used in mobile app system.
2.2 Courseware
Courseware is one of the approaches that can be used in teaching and
learning process so that it becomes more effective and interesting. This paper
demonstrates the process of development of multimedia courseware that can
be used for teaching and learning for the user. It is integrated with multimedia
elements such as graphics, audio, and video to make it more attractive to be
used by the user in their learning process.
2.2.1 2D and 3D Animation Technique
2D animation is one drawing followed by another in a slightly different
pose, followed by another in a slightly different pose, on and on for 24 frames
a second. Besides, 3D animation has more depth and is more realistic The
texture, lighting, and color of the 3D objects. for E-Medicine application, it has
some knowledgeable video that has to show the user in 3d animation for the
learning process. The object 3D animation will be built in the Autodesk Maya
software.
7
2.3 Related Work
The article of medicine needs to be focused on adding more references to the
medical in which it will be brought into the app. besides that, more information about
medicine and also medical can take in the article to put in the application.
Table 2.1 The Comparison Between the Article Source
Auther/Year Article Technique Advantages Process
description
Gregor
Endler,Michael
Langer, Jorg
Purucker,
Richard Lenz
(2011)
An
Evolutionary
Approach to
IT Support for
Medical
Suppply
Centers
Acquisition
Medical
Knowledge
Can give an
evaluation of
applicability
of traditional
techniques in
the field.
To increase the
power to
Compete, single
practitioners
often pool their
resources in
both medical
supply
centers and
networked
practices
Andreas
Holzinger
(2014)
Trends in
Interactive
Knowledge
Discovery for
Medicine:
Cognitive
Science meets
Machine
Learning.
Knowledge
Discovery of
Medical
To modelling
the complexity
of patients to
tailor medical
decisions,
health
practices and
therapies to
the individual
patient.
A synergistic
combination of
methodologies
of two areas:
Human–
Computer
Interaction and
Knowledge
Discovery/Data
Mining (KDD).
8
Nicoletta C.
Laue, David L.
B.
Schwappach,
Christian M.
Koeck
(2003)
The
Epidemiology
of Medical
Errors: A
Review of The
Literature
Disclosure
Medical
Public
The aim is to
give an
overview of the
literature
reporting on
adverse events
(AEs) and their
preventability.
The articles
retrieved were
divided into
two categories
that are four
large scale
retrospective
studies and
four
prospective
studies.
2.3.1 An Evolutionary Approach to IT Support for Medical Article
Cooperation environments are a current trend in health care. To increase their
power in competition, single practitioners often pool their resources in both medical
supply center and networked practices. Both structures create new demands on IT
infrastructure.
2.3.2 Trend in Interactive Knowledge discovery for Medicine Article
The main goal of future medicine is in modeling the complexity of patients to
tailor medical decisions, health practices and also therapies to the individual patient.
This trend towards personalized medicine produces amounts of data, and even though
the fact that human experts are excellent at pattern recognition in various conditions.
2.3.3 The Epidemiology of Medical Errors Article
Medical errors are one of the most important quality problems in healthcare
today. The best way into the incidences and characteristics of medical errors is
through studies on adverse events (AEs) since some fraction of AEs is results of errors
and as such preventable. Even though prevention is where effort should be directed,
only a few studies report on the preventability of AEs. Our aim is to give an overview
of the literature reporting on AEs and their preventability.
9
2.4 Existing Application
The existing application has been similar for E-Medicine apps in terms of
functions, problem-solving, types of information and other. Such an example of
that app is an Epocrates App, Drugbook Apps, and also Kenali Ubat Anda Apps.
2.4.1 Epocrates App
The Epocrates app is designed for the healthcare of body. Apps user
can check the dose of medicine, a medicine safety details and medical new.
Furthermore, the Epocrates Apps also have a smooth of management guidance
in medical.
Figure 2.1: The Example of Epocrates Apps
Strength
Have a button select that is easy to understand by the user.
Provides information on medicines along with pictures of the
medicines.
Weakness
Lack of detail information on each medicine displayed in the app.
simple interface colors and less user attention.
10
2.4.2 Drugbook app
One of the function Drugbook app is the user can search all about
medicine just by name or generic name. besides that, the user also can seach
all the company that related to medicine. The Drugbook app also can help user
to set reminder for their medicine along with schedule.
Figure 2.2: The Example of Drugbook Apps
Strength
Have different functions on every button option on the app like as
search, reminder time and learn information.
Design interface is simple but has an orderly set of information.
have information about how to use the medicine with safety.
Weakness
Lack of information in the form of graphics and images on the
application.
Information about medicine is more to text and it will be difficult to
attract the user's attention to read it.
11
2.4.3 Kenali Ubat Anda App
Kenali Ubat Anda app is designed to give more information about medications for
the user that how to use the medicine with following the schedule of medication.
besides that, this application also can show the user how to use the medicine with
true schedule medical (online).
Figure 2.3: The Example of Kenali Ubat Anda Apps
Strength
Have a list of organized activities on the app (Karnival Kenali Ubat
Anda).
The image gallery is available to show the functionality of the
application to the user.
Weakness
Information on medicines is more than text and this is less attractive to
users to read it.
Lack of information about the use of medicines in the form of videos
and images (offline).
12
2.5 Overall Analysis
Table 2.2 The Overall Analysis of Application
2D
Animation
Video Text Image Audio Mobile
Based
Epocrates
App
Drugbook
App
Kenali
Ubat Anda
App
13
CHAPTER 3
METHODOLOGY
3.1 Introduction
In this chapter, it will explain the specific details on the methodology being
used in order to develop this project. In order to make sure the project is in the right
path, methodology plays an important role as a guide for the project to complete and
working well as plan. There is different type of methodology that is used for different
type of application. It is important to choose the right and suitable methodology for
the development of an application thus it is necessary to understand the application
functionality itself. In order to ensure the effective of the E-Medicine application,
good identification is required before the development process begins. Furthermore,
the ADDIE model have five phase involved.
3.2 ADDIE Model
The ADDIE model is the generic process traditionally used by instructional
designers and training developers. The five phases in this model are Analysis, Design,
Development, Implementation, and Evaluation. The ADDIE model relies on each
stage being done in the given order but with a focus on reflection and iteration. This
model will give a streamlined and also focused approach that provides feedback for
continuous improvement.
14
Figure 3.1: The Rule of ADDIE Model
3.2.1 Analysis Phase
In the analysis phase, the research and categorized about the application are
important to collect the information about this project. The main objective of this
phase is to come out with a new idea or improvements to the existing of a medical
app. The existing application on any of the standards platforms is searched to establish
the novelty of the idea. The differences with the existing application are documented.
The other important task in this phase is to define the time required to develop the E-
Medicine application. The initial requirement gathering should also be completed.
3.2.2 Design Phase
In this phase, the idea for the E-Medicine application is developed into an
initial design of the application. The feasibility of developing the application on all
mobile platforms is determined. Alternatively, the specific target mobile platform is
identified (example: smartphone with Android 8.1.0 (OREO).
15
The application functionality is broken down into modules and into prototypes
for example combination of modules which are to be released in the prototype design.
The functional requirements are defined. For example are login, application
introduction, view of activities, information about medicine, gallery information of
medicine and more. A very important part of the design phase is to create the
storyboard for the user interface interaction.
3.2.3 Development Phase
In this phase, the application is coded. Coding for different modules of the
same prototype can proceed in parallel. The development process can be in two
stages: Coding for Functional Requirement and Coding for Design Requirements. The
code is developed first for the core functionalities. The parallel development can be
done for modules of the same prototype that are independent of each other.
Subsequently, these modules can be integrated. In the second stage, the user interface
is designed and that can be supported on as many mobile operating application
platforms as possible.
3.2.4 Implementation Phase
Under the implementation phase, the activity that is involved and starts to
develop and also test that project. In this phase, the application will build based on the
information collected and follow the requirements. This project will use a little PHP
language and for the interface, it will use the coding in the software Ionic. The project
also will relate with connecting to a database to store the information.
16
3.2.5 Evaluation Phase
Evaluation is the final phase after the process of implementation of this E-
Medicine Apps ‘s project. After the testing is completed and fixes the error in this
project, the application will be given to the supervisor to evaluate and give feedback
about this project. The feedback from the supervisor will record and take to improve
the process of building this project.
3.3 Hardware and Software Requirements
In the application development process, the requirements such as software and
hardware are the most important requirement to ensure that all process development
work with smoothly without any interruptions and problems. There are several
requirements that were used to complete this project which include:
3.3.1 Hardware
Minimum hardware requirements needed in the development of this application are:
i. Laptop : ASUS A456U
Processor : Intel Core i5-2.5GHz, 3M Cache
Memory : 8GB DDR4 RAM
Storage : 1TB SATA HDD
Operating system : Window 10 Pro
17
ii. Android Mobile Phone : XIOMI A1
Used to run, deploy and testing the application.
Android version 8.1.0 (Oreo) Android One.
iii. WD 1TB My Passport Ultra USB 3.0 Hard Disk
Used to backup the project of application.
Storage 1TB.
3.3.2 Software
Software requirement of this project are :
i. Xampp
This software used to manage the connection between
Apache and MySQL for this project.
ii. Adobe Animate CC 2018
This software used to create the movement of graphics
animation.
iii. Ionic Framework
Ionic Framework will be used to develop the interface and
function of the application.
iv. Google Chrome
Google Chrome is used as a platform for this application to
run the Xampp Server.
18
v. Microsoft Word 2010
Microsoft Word 2010 used to write the proposal and report.
vi. Adobe Photoshop CC 2018
This software used to make an icon, logo and adjust the
coloring image that will be used in the application.
3.4 Application Design and Modeling Application
A storyboard is a graphic organizer in the form of illustrations or images
displayed in sequence for the purpose of pre-visualizing a motion picture, animation,
motion graphic or interactive media sequence. For the application, the E-Medicine
Apps also have a storyboard that will give an example of design and modeling for this
project. The E-Medicine Apps have a standard function of the button like as Apps
Info, Code Medicine, Type of Medicine, Learn Video, Benefit, Effect, Safety
Procedures, Activities, and Gallery.
19
3.4.1 Intro for E-Medicine
Figure 3.2: The Intro Page of E-Medicine Apps
The homepage of E-Medicine will illustrate the concept of a more formulated
concept to medical. Besides, the simple homepage is very suitable to attract
users.
20
3.4.2 Login
Figure 3.3: The Login Page of E-Medicine Apps
The login interface is a part for E-Medicine user sign up application. After
signing up, users need to include their email and password.
21
3.4.3 The Main Menu
Figure 3.4: The Main Menu of E-Medicine Apps
Main menu E-Medicine application has a submenu which has its functions for
each section. It has a simple interface but easy for the user to understand when
using it.
22
3.4.4 Apps Info
Figure 3.5: The Info of E-Medicine Apps
E-Medicine Info is a section where it describes the information and objective
of the E-Medicine application itself.
23
3.4.5 Learn Video
Figure 3.6: The List Video in E-Medicine Apps
For this interface, it will show the user about the information of medicine by
default offline video. Besides, it will show some video in 3D animation.
24
3.4.6 Gallery
Figure 3.7: The Gallery in E-Medicine Apps
The gallery in the E-Medicine Application will show the user some example of
outdoor activities that related to medicine and also about medical in real life.
25
3.5 Summary
In conclusion, the selection of good methodology is very important to make
sure the development of application can be done within the exact time given.
Furthermore, a good methodology also can provide systematic steps in developing the
application so that the application can be developed with minimum errors and
problem. The methodology that is used by E-Medicine application for this project. It
also explains the required hardware and software that are used in this project that
guides to the success of this project.
26
REFERENCES
1. Gregor Endler,Michael Langer, Jorg Purucker, Richard Lenz (2011), An
Evolutionary Approach to IT Support for Medical Suppply Centers,
http://www.user.tu-berlin.de/komm/CD/paper
2. Andreas Holzinger (2014), Trends in Interactive Knowledge Discovery for
Medicine: Cognitive Science meets Machine Learning,
https://graz.pure.elsevier.com/de/publications/trends-in-interactive-
knowledge-discovery-for-personalized-medici
3. Nicoletta C. Laue, David L. B. Schwappach, Christian M. Koeck (2003),
The Epidemiology of Medical Errors: A Review of The Literature,
https://link.springer.com/article/10.1007/BF03041483
4. Drugbook – All Medicine Guide for PC Window Screenshots 3(2018),
https://appforpcwindows.download/28772/drugbook-all-medicine-guide-
app-apk-for-pc-windows-10-8-7-download/drugbook-all-medicine-guide-
for-pc-windows-screenshots-3
5. Dr. Anne Meneghetti, Jonathan Porter, Jason Bornhorst, Mark Swan,
Epocrates Wikipedia (2014), https://en.wikipedia.org/wiki/Epocrates