PENDEKATAN GAMIFICATION UNTUK MOBILE LEARNING

Khanty Dwi Ichtyantri : 14112080

Pembimbing : Dr. rer. nat. I Made Wiryana, SSi, SKom, MSc
Jurusan Sistem Informasi
Fakultas Ilmu Komputer dan Teknologi Informasi
Universitas Gunadarma
Jl. Margonda Raya No. 100, Pondok Cina, Depok 16424
ichtyantri@gmail.com

ABSTRAK
Anak-anak pada era sekarang ini telah dihadapkan pada banyak teknologi yang semakin
berkembang. Banyak diantara anak usia dini yang familiar dalam penggunaan smartphone sehingga
membuat anak malas untuk belajar dan membuat para orang tua lupa untuk mengajarkan ilmu-ilmu
yang harus anak pelajari oleh anak, salah satunya ilmu agama khususnya pengenalan huruf hijaiyah.
Tak sedikit orang tua yang menyerahkan anaknya untuk belajar mengenal huruf hijaiyah di TPA dan
diajarkan oleh guru yang lebih berpengalaman. Namun kenyataannya para guru TPA pun mengalami
kesulitan dalam mengajar anak mengenal huruf hijaiyah dikarenakan anak merasa jenuh dan bosan.
Sebuah aplikasi Pendekatan Gamification Untuk Mobile Learnig yang bernama Taalam bertindak
sebagai alat pendukung belajar bagi anak untuk mengenal dan mempelajari huruf hijaiyah, aplikasi ini
juga digunakan oleh guru ngaji/TPA sebagai metode pembelajaran yang mampu menarik perhatian
anak yang sulit untuk belajar mengaji. Dalam pembuatannya, metode pattern digunakan agar
penerapan desain tidak keluar dari sistem yang telah dibuat. Pada akhirnya sistem yang telah
dirancangpun bejalan cukup baik dengan desain yang telah dibangun menggunakan metode pattern..
Kata kunci : android, hijaiyah, pattern android, user interface, gesture, gamification.
ABSTRACT
Children these days have used technologies that is currently developing. Most of them are too
focused when they play games on the smartphone and thus making them lazier and the parents fail to
teach the necessary stuff for their children, one of them is religion especially the intoduction of
hidaiyah letter. There are so many parents that let their children learn hijaiyah letter in school or
taught by experienced teacher. But actually, the teachers are having difficulty teaching them because
the children that are taught are bored. "Gamification Approach For Mobile Learning" application
called Taalam is a learning tool for kids to learn hijaiyah letter. This application can also be used by
teachers as a learning method that can pique the kids interest. In the process of making this
application, pattern method is used so the design implementation is stay on track with the system that
is built. In the end, the system thats been designed can run well with the design that is built using
pattern method.
Keywords : android, hijaiyah, pattern android, user interface, gesture, gamification

1.

PENDAHULUAN

1.1 Latar Belakang Masalah

Anak-anak pada era sekarang ini telah
dihadapkan pada banyak teknologi yang
semakin
berkembang
di
lingkungan
sekitarnya, salah satu perkembangan yang
semakin
banyak
yaitu
penggunaan
smartphone. Banyak diantara anak-anak usia
dini yang familiar dalam menggunakan
smartphone terutama dalam penggunaan
permainan yang banyak menarik perhatian
anak (Fuad Efendi, 2014).
Terdapat
dampak
berkembangnya
teknologi ini bagi anak, salah satunya yaitu
membuat anak menjadi terlalu fokus dengan
permainan yang disediakan sehingga membuat
anak malas untuk belajar dan membuat para
orang tua lupa untuk mengajarkan ilmu-ilmu
yang harus anak pelajari karena kurangnya
perhatian dan pengawasan para orangtua (Iis
widyawati et al., 2014).
Salah satu ilmu yang sangat penting dan
harus dimiliki oleh seorang anak sejak usia
dini yang merupakan umat muslim sebagai
basic sebelum mempelajari ilmu-ilmu lainnya
adalah membaca Al-Quran dengan baik dan
benar. Untuk membaca Al-quran dengan baik
dan benar harus didasari dengan pengetahuan
mengenai dasar-dasar huruf arab atau yang
dikenal dengan huruf hijaiyah.
Rasulullah SAW bersabda (Riwayat
Bukhori dan Muslim dari St. Aisyah ra.):
Orang yang membaca Al-Quran dengan
mahir, kelak mendapat tempat di dalam surga
bersama-sama dengan para Rasul yang mulia.
Sedangkan orang yang membaca Al-Quran
tetapi tidak mahir, membacanya terteguntegun dan tidak lancar, dia akan mendapat
dua pahala.
Beberapa
orang
tua
kesulitan
mengajarkan anaknya mengenal ilmu-ilmu
agama khususnya dalam mempelajari huruf
hijaiyah, tak sedikit orang tua yang
menyerahkan anaknya untuk belajar mengenal
huruf hijaiyah

di TPA dan diajarkan oleh guru-guru yang

lebih berpengalaman. Namun kenyataannya
para guru TPA pun mengalami kesulitan
dalam mengajar anak mengenal huruf hijaiyah
dikarenakan anak merasa jenuh dan bosan
Dari permasalahan di atas penulis
bermaksud mengembangkan sebuah Aplikasi
Taalam yang dibuat dengan Pendekatan
Gamification Untuk Mobile Learning yang
bertindak sebagai alat pendukung belajar bagi
anak untuk mengenal dan mempelajari huruf
hijaiyah serta sebagai metode pembelajaran
yang mampu menarik perhatian anak yang
sulit untuk belajar mengaji. Penggunaan
aplikasi Taalam bagi anak harus dengan
dampingan guru mengaji/TPA agar anak fokus
dalam mempelajari huruf hijaiyah.
1.2 Batasan Masalah
Aplikasi ini digunakan oleh anak-anak
sebagai user serta guru mengaji/TPA sebagai
pengawas dalam penggunaan aplikasi ini. Dari
aplikasi ini anakanak dapat mengetahui 30
huruf hijaiyah (termasuk Lam-alim dan
Hamzah),
cara
membaca
dengan
menggunakan tanda baca (fathah, kasrah dan
domah)
dan
latihan
untuk menguji
kemampuan anak-anak dalam mengenal huruf
hijaiyah
1.3 Tujuan Penelitian
Tujuan Tujuan dari penelitian ini
adalah mengembangkan sebuah aplikasi
pembelajaran pada tablet yang bersistem
operasi Android agar bisa dimanfaatkan oleh
guru TPA dalam mengenal dan mempelajari
huruf hijaiyah pada anak agar anak cepat
mengenal huruf hijaiyah dan tidak bosan
ketika belajar mengaji.
1.4 Metode Penelitian
Metode yang digunakan dalam penelitian ini
adalah:
1. Studi pustaka. Penulis melakukan
studi kepustakaan dengan cara
mengumpulkan lalu membaca literatur
- literatur dan jurnal dari internet serta
buku - buku yang relevan dengan
tugas akhir ini.

2. Diskusi. Berdiskusi dengan dosen

pembimbing dan nara sumber lain
berkaitan dengan proses pengerjaan
dan penyelesaian setiap masalah masalah yang ditemukan selama
proses tugas akhir berlangsung.
3. Survei. Melakukan survei langsung ke
TPA (Taman Pendidikan Agama)
untuk mengetahui berapa huruf
hijaiyah yang digunakan serta melihat
situasi yang terjadi ketika guru
mengajar anak mengaji.
4. Perancangan.
Penulis
membuat
rancangan tampilan dan alur program
yang akan dibuat.
5. Uji Coba dan Implementasi. Aplikasi
dibuat dan diimplementasikan pada
perangkat Tablet berbasis Android
untuk diuji coba kepada user.
2.

LANDASAN TEORI

2.1 Huruf Hijaiyah

Merujuk Kata huruf berasal dari
bahasa arab yaitu harf. Huruf adalah bentuk
jamak dari al-harfu yang berarti bagian terkecil
dari lafal yang tidak dapat membentuk makna
tersendiri kecuali harus dirangkai dengan
huruf lain. Sedangkan Hijaiyah berasal dari
asal kata yang berarti ejaan. Maksud ejaan
disini adalah ejaan Arab sebagai bahasa asli
Al-Quran. Oleh karena itu yang dimaksud
huruf Hijaiyah adalah huruf-huruf ejaan
bahasa Arab sebagai bahasa asli Al- Quran
(Abdul Mujib Ismail dan Maria Ulfah
Nawawi,1995:51).
2.1.1 Jenis Huruf Hijaiyah
Huruf hijaiyah berjumlah 28 huruf
tunggal atau 30 jika memasukkan huruf
rangkap lam-alif dan hamzah sebagai huruf
yang berdiri sendiri. Tabel 1 menampilkan
daftar 30 huruf hijaiyah.
Tabel 1. Tabel Huruf Hijaiyah

2.2 Gamification
Gamifikasi adalah penggunaan dari
teknik desain permainan, permainan berpikir
dan permainan mekanik untuk meningkatkan
non-game konteks. Biasanya gamifikasi
berlaku untuk non-game aplikasi dan proses,
untuk mendorong orang untuk mengadopsi
mereka, atau untuk mempengaruhi bagaimana
mereka digunakan. Gamifikasi bekerja dengan
membuat teknologi yang lebih menarik,
dengan mendorong pengguna untuk terlibat
dalam perilaku yang diinginkan. Teknik ini
dapat mendorong orang untuk melakukan
pekerjaan
mereka
yang
biasanya
membosankan.
2.3 Pattern Desain Antarmuka
Pattern atau pola adalah sebuah istilah
yang mengacu kepada solusi umum yang dapat
digunakan secara berulang kali untuk
menyelesaikan masalahmasalah umum yang
ditemukan dalam desain perangkat lunak.
Sebuah pola tidak berbentuk solusi akhir yang
dapat langsung diterjemahkan menjadi kode
program.
Pandangan
dalam pola
desain
antarmuka seharusnya memiliki fungsi yang
berguna (M. Van Welie et al, 2000). Pola
desain antarmuka seharusnya membantu dalam
pembuatan sistem menjadi lebih berguna
untuk manusia, sama seperti pandangan dari
pola yang diterapkan oleh Alexander dimana
pola menjadikan sesuatu masalah menjadi
lebih mudah. Bagaimanapun juga, sebelum
menentukan format dari pola desain
antarmuka, seharusnya terlebih dahulu
mengerti aspek kegunaan apa yang penting
agar format ini bisa terlaksana.
2.4 Domain Analysis
Pada hakikatnya domain analisis atau
analisis domain merupakan upaya peneliti
untuk memperoleh gambaran umum tentang
data untuk menjawab fokus penelitian.
Dengan cara membaca naskah data secara
umum dan menyeluruh untuk memperoleh
domain atau ranah apa saja yang ada di dalam
data tersebut. Pada tahap ini peneliti belum
perlu membaca dan memahami data secara
rinci dan detail karena targetnya hanya untuk
memperoleh domain atau ranah. Hasil analisis
ini masih berupa pengetahuan tingkat awal
3

tentang berbagai ranah konseptual. Dari hasil

pembacaan itu diperoleh hal-hal penting dari
kata, frase atau bahkan kalimat untuk dibuat
catatan pinggir.

Tabel 3. Penerapan Domain Anlisis

Dengan analisis domain, hasil yang

diperoleh merupakan kumpulan jenis domain
atau kategori konseptual beserta simbol yang
dirangkumnya. Teknik analisis ini sangat
relevan untuk dipakai dalam studi yang
bersifat eksploratif. Artinya, analisis hasil
studi hanya ditargetkan untuk memperoleh
gambaran seutuhnya dari sang tokoh, tanpa
harus dirinci unsur-unsurnya secara detail.
Dalam melakukan analisis domain,
Spradley menyarakan menelusuran hubungan
sistematis yang bersifat universal. Tabel 2
menggambarkan hubungan Semantik yang
bersifat universal dalam Analisis Domain dari
Spradly, yaitu:
Tabel 2. Tabel Domain Analisis

3.2 Analisi Kebutuhan

Tahap ini merupakan tahap interaksi
intensif antara analis sistem dengan komunitas
pemakai sistem atau end-user, dimana team
pengembangan
sistem
menunjukkan
keahliannya untuk mendapatkan tanggapan
dan kepercayaan pemakai, sehingga mendapat
partisipasi yang baik. Dalam melakukan tahap
ini akan dicapai 4 tujuan, yaitu:
Menjelaskan sistem saat ini secara lengkap.
Menggambarkan sistem informasi yang
ideal.
Membawa sistem informasi yang ideal ke
kondisi saat ini dengan memperhatikan
kendala sumber daya.
Memberi dorongan terhadap keyakinan
pemakai kedalam team pengembangan
sistem.
3.2.1 Keinginan Pemakai

3.

ANALISIS

3.1 Domain Analysis

Analisis domain digunakan untuk
memperoleh gambaran seutuhnya dari sang
tokoh atau aktor, tanpa harus merinci unsur
unsurnya secara detail. Dalam Tabel 3
dijelaskan hubungan simantik yang bersifat
universal dalam melakukan analisis domain.

Melakukan survei terhadap keinginan

pemakai merupakan tahap awal yang
dilakukan sebelum mulai membuat sebuah
sistem atau aplikasi. Survei secara langsung
berguna untuk mendapatkan informasi yang
ideal. Ideal di sini merupakan konsep dari
pada kenyataan, artinya bahwa tidak ada
sistem yang ideal atau sempurna tetapi bersifat
subyektif

3.2.2 Metode Kebutuhan Analisis

Metode dalam pengumpulan data
yaitu: interviews, questionnaires, observation,
procedure analysis dan document survey.
Dalam metode ini hanya digunakan beberapa
tahapan yaitu interviews dan observation.
3.2.2.1 Tanya Jawab (Interviews)
Pada tahapan ini dilakukan tanya
jawab kepada guru dan murid.
3.2.2.2 Observasi (Observation)
Dilakukan
observasi
dengan
mengunjungi TPA tempat mengaji dan
mewawancarai guru TPA serta anak-anak
khususnya anak-anak yang sulit untuk
mengaji. Dengan melakukan metode ini dapat
diketahui mengenai kesuliatan yang dihadapi
oleh guru TPA dan anak-anak yang sulit untuk
mengaji.

satunya yaitu anak yang mempelajari huruf

hijaiyah.
User as operator. Merupakan pengguna
yang bertugas untuk menginput informasi
tentang dirinya dalam penggunaan aplikasi
ini. Contohnya anak-anak yang diberi
pengawasan oleh guru ngaji atau TPA.
User as visitor. Merupakan pengguna yang
menggunakan aplikasi ini pada device
android masing-masing terutama tablet,
contohnya orangtua.
Stakeholder. Merupakan pihak-pihak yang
tidak menggunakan aplikasi ini, namun
terlibat dalam sistem mendapat dampak
yang baik, contohnya ketua yayasan atau
pemuka agama.
4.1.3 Konteks

1. Arahan (Conduct) analisis

2. Kebutuhan pemakai
3. Dokumentasi

Aplikasi Pendekatan Gamification

Untuk Mobile Learning ini dalam konteksnya
bertindak sebagai alat pendukung belajar bagi
anak yang tidak menggantikan peran guru
dalam mengajar untuk mengenal dan
mempelajari huruf hijaiyah, aplikasi ini juga
dapat digunakan oleh guru ngaji/TPA sebagai
metode pembelajaran yang mampu menarik
perhatian anak yang sulit untuk belajar
mengaji.

4.

4.1.4 Constraint

3.2.3 Dokumen Kebutuhan Analisis

PENENTUAN PATTERN

4.1 Desain
High level design menjelaskan
arsitektur yang akan digunakan untuk
mengembangkan produk software. Diagram
arsitektur memberikan gambaran tentang
seluruh sistem, mengidentifikasi komponen
utama yang akan dikembangkan untuk produk
dan interface. Pengembangan desain aplikasi
mobile, menggunakan koleksi yang terdapat di
Android
Interaction
Design
Pattern
[http://www.androiduipatterns.com/] koleksi
tersebut berisi pola-pola yang kompatibel
terhadap aplikasi mobile, android pada
khususnya.
4.1.1 Goal
Agar anak cepat mengenal huruf
hijaiyah dan tidak bosan ketika belajar
mengaji.
4.1.2 User
Dalam penggunaan aplikasi ini
terdapat beberapa pihak yang terlibat salah

Aplikasi ini digunakan oleh anak-anak

sebagai user serta guru mengaji / TPA sebagai
pengawas dalam penggunaan aplikasi ini. Dari
aplikasi ini anakanak dapat mengetahui 30
huruf hijaiyah (termasuk Lam-alif, Ha dan
Hamzah), cara membaca dengan menggunakan
tanda baca (fathah, kasrah dan domah) dan
latihan untuk mengetes kemampuan anak-anak
dalam mengenal huruf hijaiyah.
4.1.5 Teknologi
Aplikasi ini digunakan pada tablet
berbasis android karena banyak anakanak yang
familiar menggunakan smartphone berbasis
android.
4.2 Pola Desain Aplikasi
Penentuan sebuah pola atau pattern
desain sebuah aplikasi harus disesuaikan
dengan topik yang dibutuhkan dan fokus
terhadap solusi dalam kegunaan suatu aplikasi.
Pola desain yang ditentukan dalam aplikasi ini
harus mampu menarik perhatian penggunanya.

4.2.1 Daftar Pattern

4.2.3.1 Mock-up Main menu

Berikut daftar pattern yang digunakan

dalam perancangan aplikasi yang akan dibuat:
Main menu
Dealing with data
Drawing
Making choices
Getting input data
Notification
Score
Gambar 2. Mock-up Main menu

4.2.2 Pattern of Design

Dijelaskan contoh pattern dari yang
akan digunakan dalam aplikasi ini:
4.2.2.1 Main menu
1. Nama : Main menu

Pada Gambar 2 merupakan gambaran

tampilan awal dari aplikasi. Tampilan
menjelaskan terdapat tiga buah image button
yang digunakan sebagai tombol untuk
berpindah ke activity lainnya. Kemudian
terdapat pula togglebutton yang digunakan
untuk membuat aksi suatu tombol. Mock-up
ini sesuai dengan pattern main menu.
5.

IMPLEMENTASI

5.1 Kebutuhan Sistem

Gambar 1. Main menu
[http://www.game-patterns.com]

Konteks: Dari bagian utama terdapat banyak

item, sebaiknya ditampilkan secara vertikal.
Hal ini guna menyingkirkan menu horizontal
untuk bagian-bagian yang tersisa.
Masalah: Pengguna perlu mengakses bagian
utama dari aplikasi.

Mengenai hal-hal yang dibutuhkan

sistem untuk dapat beroperasi dalam Aplikasi
Taalam dengan Pendekatan Gamification
Untuk Mobile Learning adalah perangkat
tablet yang berbasis Android 6.1 muffin atau
di atasnya dan dengan akses internet untuk
melihat hasil daftar nilai. Aplikasi ini diuji
coba pada Tablet Samsung Galaxy S2 berbasis
android 6.0.1 (Muffin)
5.2 Struktur Program

Kekuatan: Struktur informasi dari aplikasi

memiliki dua atau lebih bagian. Bagian utama
melayani tujuan utama aplikasi. Bagian lain
yang lebih atau kurang independen dari bagian
utama dan melayani tujuan tambahan.
Sebagian besar pengguna akan perlu untuk
melihat bagian utama terlebih dahulu.
Solusi: Kombinasikan menu dalam menu
vertikal dengan menggunakan petunjuk visual
yang berbeda.
4.2.3 Mock-up interface
Gambaran atau Mock-up mengenai
halaman yang akan dibuat dalam aplikasi
berdasarkan pattern yang sudah dijelaskan
sebelumnya:

Gambar 3. Struktur Program

Dari Gambar 3 dapat dijelaskan dari
user management pengguna dapat memperoleh
scoring atau nilai, namun untuk melakukan
nilai pengguna harus melakukan mengerjakan
quiz atau latihan menjawab pertanyaan terlebih
dahulu. Jika semua pertanyaan sudah dijawab
maka pengguna mendapatkan nilai atau score.
Apabila pengguna ingin menyimpan nilainya
6

agar dapat dilihat orang lain, maka pengguna

harus menyimpan nilainya dan melakukan
input data seperti nama dan email untuk
ditampilkan pada output. Content berisi
pembelajaran mengenai huruf-huruf hijaiyah.
Dari content pengguna dapat mengenal huruf
melalui visuar atau suara serta mempelajari
cara menulis huruf hijaiyah melalui drawing.
5.2.1 Implementasi Users Management
User
management
merupakan
tampilan yang digunakan untuk memudahkan
pengguna berkomunikasi dengan program.
Salah satu tampilan user management yang
memudahkan pengguna yaitu tampilan main
menu, dimana main menu merupakan tampilan
awal dari aplikasi. Berikut tampilan kode user
management dari main menu:
<?xml version="1.0" encoding="utf8"?>
<RelativeLayout
xmlns:android="http://schemas.andr
oid.com/apk/res/android"
xmlns:tools="http://schemas.androi
d.com/tools"
tools:context="com.example.s46.kha
nty.MainActivity"
android:layout_width="match_parent
"
android:layout_height="match_paren
t"
android:background="@drawable/dasa
r" >
<ImageButton
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/imageView4"
android:onClick="menu1"
android:background="@drawable/sele
ctor" />
<ImageButton
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/imageView5"
android:onClick="menu2"
android:background="@drawable/sele
ctor1" />
<ImageButton
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/imageView6"/>
<ToggleButton
android:id="@+id/toggleSound"
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"/>

Gambar 4. Implementasi tampilan main menu

Dari Gambar 4 dijelaskan tampilan

main menu yang terdiri dari tombol-tombol
untuk menuju halaman lainnya serta
togglebutton yang digunakan untuk mematikan
dan menyalakan kembali backsound dalam
aplikasi
5.2.2 Implementasi Content
Halaman content merupakan halaman
dimana pengguna dapat belajar mengenal jenis
huruf hijaiyah dan detail dari huruf hijaiyah itu
sendiri. Implementasi content ini terdiri dari
beberapa halaman, salah satunya yaitu
halaman deret huruf. Berikut kode halaman
deret huruf:
<?xml version="1.0" encoding="utf8"?>
<RelativeLayout
xmlns:android="http://schemas.andr
oid.com/apk/res/android"
xmlns:tools="http://schemas.androi
d.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent
"
android:background="@drawable/dere
thuruf2"
android:id="@+id/front"
tools:context="com.example.s46.kha
nty.MainActivity1">
<ImageView android:id="@+id/tumb4"
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:src="@drawable/j4"
android:layout_toLeftOf="@+id/tumb
3"
android:layout_alignTop="@+id/tumb
1"
android:onClick="d" />
</RelativeLayout>

android:layout_centerHorizontal="t
rue" />

Gambar 5. Implementasi tampilan deret huruf

Pada
Gambar
5
merupakan
implementasi learning dari tampilan deret
huruf yang berisi deretan huruf hijaiyah dari
alif sampai ya. Pada tampilan ini pengguna
bebas memilih huruf mana pun untuk
mengetahui lebih detail mengenai huruf.
5.2.3 Implementasi Visual
Detail masing-masing huruf dijelaskan
pada halaman lainnya dimana salah satu huruf
dipilih untuk mengetahui cara penyebutan dari
huruf tersebut serta ucapan huruf yang disertai
dengan tanda baca fathah, kasrah, dan
dhamah. Implementasi visual ini akan
memberikan suara di masing-masing huruf
yang ada. Berikut kode yang digunakan dalam
implementasi visual:
<?xml version="1.0" encoding="utf8"?>
<RelativeLayout
xmlns:android=http://schemas.andro
id.com/apk/res/androidxmlns:tools=
"http://schemas.android.com/tools"
android:layout_width="match_parent
"
android:layout_height="match_paren
t"
android:background="@drawable/dere
thuruf2"
tools:context="com.example.s46.kha
nty.SubMainActivity1">
<ImageView
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/parent"
android:onClick="s0"
android:src="@drawable/s1" />
android:src="@drawable/nulis22"
android:id="@+id/imgButton"
android:background="#00000000"
android:layout_alignParentBottom="
true"

Gambar 6. Implementasi tampilan detail huruf

Gambar 6 merupakan halaman untuk

implementasi visual yang berisi tampilan
huruf dengan tanda baca fathah, kasrah dan
damah dilengkapi dengan suara atau
backsound jika huruf pada tampilan disentuh
5.2.4 Implementasi Drawing
Dalam
content
memungkinkan
pengguna untuk belajar menulis atau drawing
huruf hijaiyah. Berikut kode implementasi
drawing menulis huruf hijaiyah:
<?xml version="1.0" encoding="utf8"?>
<RelativeLayout
xmlns:android="http://schemas.andr
oid.com/apk/res/android"
android:orientation="vertical"
android:background="@drawable/tuli
s3"
android:layout_width="fill_parent"
android:layout_height="fill_parent
">
<android.gesture.GestureOverlayVie
w
android:id="@+id/gOverlay"
android:fadeOffset="1000"
android:fadeEnabled="true"
android:gestureColor="#FFFFFF"
android:gestureStrokeType="multipl
e"
android:layout_width="fill_parent"
android:layout_height="fill_paren"
android:layout_weight="1.0" />
</RelativeLayout> />

Gambar 7. Implementasi tampilan drawing

Tampilan Gambar 7 merupakan

implementasi
tampilan
drawing
yang
digunakan untuk menulis salah satu huruf
hijaiyah. Pada tampilan ini pengguna memiliki
dua buah tombol bantuan dimana tombol
bantuan ini digunakan untuk memberikan
pola-pola untuk menulis huruf hijaiyah.
5.2.5 Implementasi Scoring / Nilai
Implementasi scoring pada aplikasi
diperoleh ketika pengguna telah mengerjakan
latihan atau kuis yang ada dalam aplikasi.
Latihan ini berguna untuk menguji daya ingat
pengguna dalam memahami huruf hijaiyah.
Latihan dibagi menjadi 2 kategori dan berikut
kode pada tampilan pilihan kuis atau latihan:
<?xml version="1.0" encoding="utf8"?>
<RelativeLayout
xmlns:android="http://schemas.andr
oid.com/apk/res/android"
android:orientation="vertical"
android:background="@drawable/tuli
s3"
android:layout_width="fill_parent"
android:layout_height="fill_parent
"
android:id="@+id/quest1">
<Button
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/button1"
android:onClick="quiz1"
android:background="@drawable/sele
ctebakhuruf" />

Tampilan detail kuis memiliki

kesamaan hanya beda pada tampilan
pertanyaan kuis. Berikut kode pada tampilan
detail kuis atau latihan tebak huruf:
<RadioButton
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/Ans2"
android:checked="false" />
<RadioButton
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t" android:id="@+id/Ans3"
android:layout_below="@+id/imageVi
ew" />
<RadioButton
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/Ans4" />
</RadioGroup>
<Button
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/buttonAns"
android:background="@drawable/tomb
oljawab"
android:onClick="checkAns"/>

Gambar 9. Implementasi detail quiz / latihan

Gambar 8. Implementasi tampilan quiz / latihan

Tampilan Gambar 8 merupakan

implementasi tampilan quiz / latihan yang
ditampilkan dari menu latihan. Dalam
tampilan ini terdapat dua pilihan tombol untuk
memilih jenis latihan baik tebak huruf maupun
tebak bacaan.

Tampilan Gambar 9 merupakan

implementasi tampilan detail quiz / latihan
yang berisi pertanyaan serta daftar pilihan
jawaban yang bisa dipilih sesuai keyakinan.
Jika sudah memilih jawaban pengguna bisa
langsung menekan tombol jawab untuk
menjawab pertanyaan yang ada.
Setelah menjawab semua pertanyaan,
aplikasi akan menampilkan hasil berupa nilai
yang didapat pengguna atas pertanyaan yang
sudah dijawab.
9

Berikut kode dalam menampilkan

tampilan nilai / score:

tombol Ya jika Tidak maka tekan tombol

Tidak.

<TextView
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:textAppearance="?android:a
ttr/textAppearanceLarge"
android:id="@+id/textView1"
android:layout_centerVertical="tru
e"
android:layout_centerHorizontal="t
rue" />
<ImageView
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/imageView2"
android:background="@drawable/ya"
android:onClick="ya" />
<ImageView
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/imageView3"
android:onClick="tidak"
android:background="@drawable/tida
k" />
<ImageView
android:layout_width="wrap_content
"
android:layout_height="wrap_conten
t"
android:id="@+id/imageView7"
android:src="@drawable/n4" />

5.3 Uji Coba

Uji coba terhadap aplikasi dilakukan
dengan cara terjun langsung menanyakan ke
pihak pengajar baik guru Paud maupun guru
TPA terutama pada anak-anak yang
mengalami masalah sulitnya menghafal huruf
hijaiyah.
Pengujian dilakukan terhadap aspek
kemudahan pengguna untuk mengtahui apakah
aplikasi ini mudah untuk digunakan oleh
tenaga pengajar maupun anak-anak. Penguji
akan menguji halaman quiz pada aplikasi.
Tabel 4. Hasil Uji Coba

6.

PENUTUP

5.1 Kesimpulan

Gambar 10. Implementasi tampilan score

Tampilan Gambar 5.8 merupakan

implementasi tampilan score atau nilai.
Tampilan ini akan muncul ketika pengguna
sudah mengerjakan kuis. Pada tampilan ini
pun terdapat nilai atau score yang didapat dari
hasil mengerjakan latihan atau kuis. Kemudian
terdapat pilihan untuk memasukkan nilai ke
dalam rapot atau tidak. Jika Ya maka tekan

Kecenderungan anak-anak yang sulit

untuk menghafal huruf hijaiyah karena metode
pembelajaran yang membuat anak cepat bosan
dan sulit untuk belajar. Ditambah kebiasaan
anak-anak yang lebih sering memegang
gadget membuat orang tua menjadi lupa untuk
mengajarkan anak-anak mengenal ilmu
agamnya khususnya pengenalana huruf
hijaiyah. Tak sedikit orang tua yang membawa
anaknya ke TPA untuk diajarkan ilmu agama
khususnya pengenalan huruf hijaiyah, namun
di dalam TPA pun guru memiliki kendala
untuk mengajarkan anak murid kerna anak
yang cepat jenuh dan bosan dengan pelajaran
yang diberikan. Oleh karena itu dibutuhkan
media pembelajaran yang mampu menarik
perhatian anak agar tidak jenuh dan bosan.
Dalam penelitian ini digunakan
domain analisis untuk memecahkan masalah
10

di atas. Domain analisis adalah upaya peneliti

untuk memperoleh gambaran umum tentang
data untuk menjawab fokus penelitian.
Dilakukan dengan membaca naskah data
secara umum dan menyeluruh untuk
memperoleh domain atau ranah apa saja yang
ada di dalam data tersebut. Pada tahap ini
peneliti belum perlu membaca dan memahami
data secara rinci dan detail karena hanya untuk
memperoleh domain atau ranah.

[10] Thanh Diane Nguyen and Jean

Vanderdonckt. User Interface Master Detail
Pattern on Android. 2012.
[11] UNITiD and contributors. Android
Patterns.
http://unitid.nl/androidpatterns/,
2016.
[12] Martijn van Welie. Pattern in interaction
design. http:// welie.com/patterns/index.php/,
2008.

5.2 Saran
Saran dalam pengembangan aplikasi
Taalam ini dapat dikembangkan dengan
penambahan pembelajaran huruf hijaiyah
dengan tanda baca lainnya seperti fathahtain,
domahtain, dan kashrahtain serta dengan
menambahkan latihan soal atau quiz lainnya
sehingga anak lebih termotivasi untuk belajar
mengenal huruf hijaiyah.

[13] Manpreet Vohra. A Simple Quiz Game in

Android.
http://developerfeed.com/simplequiz-game-andriod/, 2013.
[14] Iis Widyawati, Hendra Sugiman dan Edy.
Pengaruh Penggunaan Gadget Terhadap
Daya Kembang Anak. Universitas Budi Luhur,
2014.

DAFTAR PUSTAKA
[1] Tatiana
Aulachynskaya.
Games
Inspiration. http:// gamesinspiration.com/,
2014.
[2] Abdul Mujib Ismail dan Maria Ulfah
Nawawi. Pedoman Ilmu Tajwid. Surabaya :
Karya Abditama, 1995.
[3] Android Developer. Gestures on Android.
http://androiddevelopers.blogspot.co.id/2009/
10/gestures-on-android-16.html, 2009.
[4] Adam Dutzi. Game Patterns. http://gamepatterns.com/, 2013.
[5] Fuad Efendi. Pengaruh Gadget Terhadap
Perkembangan Anak Usia Dini. Universitas
Brawijaya, 2014.
[6] Arif Gunawan. Rahasia Sukses Mengajar
Buku Iqra Yang Mudah dan Menyenangkan.
Yayasan Wakaf Madani, 2008.
[7] Juan Pablo Hourcade. Child-Computer
Interaction. Shutterstock.com, 2015.
[8] Abu Yala Kurnaedi. Tajwid Lengkap
Asy-Syfii. Pustaka Imam Syafii, 2008.
[9] Nazauddin Safaat N. Pemrograman
Aplikasi Mobile Smartphone dan Tablet PC
Berbasis Android. Informatika Bandung, 2012.

11