5

1. Pendahuluan Belajar suatu bahasa asing membutuhkan pemahaman dan teknik yang

memadai. Pada pembelajaran bahasa Mandarin, anak-anak diharapkan mampu mengucapkan setiap kosa kata dengan baik dan benar agar mampu berkomunikasi dalam bahasa Mandarin. Hal utama yang harus diperhatikan dalam pembelajaran bahasa Mandarin adalah hànyǔ pīnyīn ( 汉语拼音 ) yang merupakan cara pengucapan yang baik dan benar sesuai dengan tinggi rendahnya nada baca. Bahasa Mandarin juga memiliki keunikan dalam penulisan hurufnya (atau yang lebih dikenal dengan huruf hànzì (汉字)) karena harus dilakukan sesuai dengan aturan yang sudah dibakukan (bĭshùn (笔顺)). Hal – hal tersebut dirasakan akan menambah kesulitan bagi anak-anak.

Salah satu contoh sekolah yang memasukkan bahasa Mandarin ke dalam kurikulum pendidikan adalah SD Xaverius 3 Bandar Lampung. Proses pembelajaran bahasa Mandarin yang terjadi di SD Xaverius 3 adalah dengan cara para siswa dituntut untuk membaca buku atau materi dalam bentuk cetak yang diberikan oleh guru sehingga di sini hanya terjadi komunikasi 1 (satu) arah tanpa melibatkan interaksi langsung dengan para siswa. Berdasarkan wawancara dengan beberapa murid di SD Xaverius 3, hal ini menyebabkan mereka menjadi bosan dan pada akhirnya mengalami kesulitan dalam memahami setiap materi yang diajarkan.

Perkembangan teknologi di berbagai bidang terutama bidang pendidikan sangat membantu proses belajar mengajar menjadi lebih bervariasi. Salah satu teknologi yang digunakan dalam proses belajar mengajar adalah e-learning system. E-learning saat ini mengarah pada penyediaan suatu situs (website) yang berisi konten materi yang diajarkan dan dapat diakses dari manapun oleh para peserta didik.

Hal ini menjadi dasar bagi penulis untuk membuat suatu aplikasi pembelajaran yang dapat membantu anak-anak di SD Xaverius 3 agar bisa memahami pengenalan dasar-dasar bahasa Mandarin lebih interaktif dengan menggunakan komputer. Di dalam program ini berisi konten-konten selain gambar, disertai pula animasi yang menggunakan efek suara yang mempermudah pemahaman anak mempelajari nada, pelafalan dan huruf hànzì. Dukungan teknologi untuk dapat menyediakan situs seperti itu adalah dengan menerapkan HTML5. Teknologi HTML5 memiliki keunggulan dalam penyediaan modul animasi, kanvas maupun video-audio, sehingga dengan kombinasi antara situs dengan HTML5, diharapkan aplikasi pembelajaran bahasa Mandarin ini dapat meningkatkan minat belajar siswa.

2. Tinjauan Pustaka

Penelitian sebelumnya yang terkait dengan topik penelitian ini adalah dengan judul “Aplikasi Pembelajaran Bahasa Mandarin untuk Anak-Anak Sekolah Dasar dengan Menggunakan Swish Max dalam Bentuk CD Interaktif”, pada penelitian tersebut dijelaskan bahwa siswa – siswi disediakan sarana pembelajaran pendidikan bahasa yang inovatif dan interaktif untuk dapat mempelajari Bahasa Mandarin dengan baik dan benar menggunakan program aplikasi Swish Max yang dikenal sebagai program pembuat animasi. Software pendukung lainnya adalah

6

Adobe Photoshop untuk mengedit gambar-gambar yang digunakan dalam aplikasi interaktif tersebut [1].

Perbedaan penelitian sebelumnya dengan penelitian ini adalah terletak pada teknologi yang digunakan dan media penyampaian materi. Teknologi yang digunakan adalah penerapan HTML5 pada konten audio, yang dapat diimplementasikan pada website tanpa perlu menambahkan plug-in pihak ketiga seperti Flash. Penyampaian materi pembelajaran bahasa Mandarin ini dapat diakses oleh para peserta didik dari manapun dan kapanpun, sehingga para siswa dapat memahami secara lebih mendalam mengenai materi yang diberikan.

Bahasa Mandarin

Bahasa Mandarin mencakup tiga materi dasar yaitu cara pelafalan, cara membedakan nada, dan cara menggores sebuah huruf hànzì. Tiga hal tersebut merupakan suatu dasar yang harus dimengerti untuk mempelajari bahasa Mandarin lebih lanjut. Pada pelafalannya, bahasa Mandarin memiliki suku kata untuk melambangkan bunyi-bunyi dalam Mandarin atau disebut Bopomofo, terbagi atas pelafalan huruf mati (konsonan) dan huruf hidup (vokal).

Contoh pelafalan pada huruf mati : b (dibaca po), p (dibaca pho), d (dibaca te), t (dibaca the), g (dibaca ke), k (dibaca khe) dan lain – lain. Contoh pelafalan pada huruf hidup : ai (dibaca ay), ei (dibaca ey), ou (dibaca ou), ü (dibaca iu, posisi gigi seperti ingin mengucapkan i, tapi mulut melafalkan huruf u) [2].

Setiap suku kata bahasa Mandarin tidak hanya terdiri dari vokal dan konsonan saja, tetapi juga memiliki nada. Ada 4 nada dan 1 nada netral dalam bahasa Mandarin. Nada dalam bahasa Mandarin memiliki fungsi untuk membedakan makna kata. Setiap kata dalam bahasa Mandarin dengan cara pengucapan yang sama, namun jika terdapat perbedaan nada, maka makna yang terkandung dalam setiap kata tersebut akan berbeda [3]. Contoh: 妈 mā(ibu), 麻 má(bintik/serat), 马 mǎ(kuda), 骂 mà(marah)

Selain belajar pelafalan dan nada, siswa juga mempelajari cara menulis huruf hànzì dengan benar. Huruf hànzì harus selalu ditulis dengan cara yang sama dan setiap huruf terdiri dari satu atau lebih guratan. Ada beberapa aturan dasar untuk menulis huruf hànzì. Arah utamanya adalah dari atas ke bawah dan dari kiri ke kanan [4]. Media Pembelajaran

Pembelajaran adalah sebuah proses komunikasi antara pembelajar, pengajar, dan bahan ajar. Komunikasi tidak akan berjalan tanpa bantuan sarana penyampai pesan atau media. Proses pembelajaran mencakup tiga komponen, yaitu input, proses dan output. Contoh komponen input antara lain bahan pelajaran yang cukup relevan dan up-to-date, serta alat atau media belajar. Contoh komponen proses antara lain strategi pembelajaran, pemanfaatan media pembelajaran. Sedangkan komponen output adalah hasil dari pembelajaran seperti prestasi peserta didik [5].

7

HTML 5 HTML (Hyper Text Markup Language) adalah file teks yang berisi

instruksi/script kepada web browser untuk menampilkan suatu tampilan grafis dari sebuah halaman web. Di dalam file HTML terdapat beberapa tag atau kode-kode yang dimengerti oleh web browser dan dapat menampilkannya di layar monitor. File HTML dapat dibuat dengan aplikasi text editor apapun di sistem operasi apapun, antara lain : Notepad di Windows, emasc atau vi di Unix atau SimpleText di Macintosh. File HTML ini juga bisa dibuat di aplikasi word processor apapun asalkan saat menyimpan file tersebut disimpan dengan format text-only. Salah satu kelebihan file HTML adalah cross platform, artinya file HTML dapat ditampilkan di beberapa Operating System (OS) yang berbeda dan memiliki tampilan yang sama walaupun saat pembuatannya menggunakan satu OS tertentu saja.

HTML5 adalah revisi yang dibangun oleh W3C (World Wide Web Consortium) untuk dimasukkan sebagai perubahan besar berikutnya pada standar HTML. Perkembangan web yang sangat cepat mendorong para pengembang W3C yang bekerjasama dengan WHATWG (Web Hypertext Application Technology Working Group) meluncurkan HTML5 guna memperbaiki HTML versi sebelumnya sekaligus untuk mempermudah pengembangan website. Standar ini memperkenalkan fitur baru seperti memutar audio dan video tanpa plug-in tambahan (seperti Flash).

Adapun beberapa alasan penggunaaan HTML5 adalah [7] : - Fiturnya masih berdasarkan pada HTML, CSS, DOM, dan JavaScript. - Mengurangi penggunaan plug-in dari pihak ketiga (Seperti Flash dan

Microsoft Silverlight). - Penanganan kesalahan lebih mudah diatasi. - Lebih Markup dan Scripting. - Lebih Independent. - Pengembangan ke publik yang lebih baik.

PHP PHP adalah bahasa scripting yang menyatu dengan HTML dan dijalankan

pada server side. Artinya semua sintaks yang kita berikan akan sepenuhnya dijalankan pada server sedangkan yang dikirimkan ke browser hanya hasilnya saja. (Anon Kuncoro Widigdo).[8]

3. Metode Penelitian

Metode perancangan sistem pada penelitian ini menggunakan model proses prototyping model. Gambar 1 menjelaskan langkah-langkah dari tahapan metode prototyping model [9].

8

Gambar 1 Metode Prototyping Model [9]

a. Listen to Customer

Mengumpulkan kebutuhan - kebutuhan pengguna (user) secara lengkap kemudian melakukan analisa terhadap kebutuhan tersebut untuk mencari solusi dengan mengimplementasikan fungsi-fungsi di dalam aplikasi. Penulis melakukan pengumpulan kebutuhan dengan melakukan observasi dan wawancara kepada guru-guru bahasa Mandarin di SD Xaverius 3 Bandar Lampung guna mengetahui bagaimana proses pembelajaran yang terjadi dan untuk mengetahui masalah-masalah yang dihadapi dalam proses belajar mengajar selama ini serta memberikan pemecahan masalah melalui aplikasi pembelajaran yang akan dibangun dengan menerapkan teknologi HTML5.

b. Build or Revise Mockup Merancang aplikasi pembelajaran bahasa Mandarin dengan

menerapkan teknologi HTML5 dengan menggunakan alat bantu perancangan sistem yaitu bahasa Unified Modelling Language (UML), melakukan perancangan database, dan merancang tampilan antar muka pengguna (user interface).

c. Customer Test Drives Mockup Tahapan akhir dari metode prototyping model adalah menerapkan

aplikasi sistem pembelajaran bahasa Mandarin di SD Xaverius 3 Bandar Lampung dengan memperhatikan kebutuhan perangkat lunak dan perangkat keras sesuai standarisasi kebutuhan aplikasi. Pada tahapan ini juga dilakukan pengujian secara bertahap yaitu dengan melakukan: Black-box testing terhadap aplikasi yang telah diimplementasikan

guna mengetahui apakah semua fungsi yang ada sudah berjalan dengan baik dan dapat digunakan oleh guru, siswa, maupun administrator di SD Xaverius 3 Bandar Lampung.

Pengujian dengan membandingkan nilai test siswa antara pembelajaran secara konvensional dan pembelajaran menggunakan aplikasi pembelajaran melalui media komputer.

Perancangan Sistem

Perancangan aplikasi yang dilakukan oleh penulis yaitu dengan menggunakan Unified Modelling Language (UML). Perancangan dimulai dengan membuat sebuah alur dari model perangkat lunak yang sesuai dengan alur

9

pembuatan aplikasi. Setelah membuat alur atau use case tersebut maka langkah selanjutnya adalah membuat aplikasi yang sesuai dengan use case yang telah dibuat.

1. Use Case Diagram Sistem

Hapus Member

Manajemen Member

Manajemen Home

Admin

Manajemen About

<<extend>> Melihat Latihan

Melihat Materi Belajar

Akses Data Member

Lihat Skor

Melihat Konten Home

Pengguna

Melihat Konten About

<<extend>>

<<extend>>

<<extend>>

<<extend>>

Latihan Bopomofo Latihan Nada Latihan Hanzi

<<extend>> <<extend>> <<extend>>

Belajar Bopomofo Belajar Nada Belajar Hanzi

<<extend>><<extend>> <<extend>>

Gambar 2 Use Case Diagram Sistem

Pada Gambar 2 dijelaskan bahwa terdapat 2 aktor dalam sistem pembelajaran

bahasa Mandarin yaitu Pengguna dan Admin. Masing-masing aktor memiliki interaksi dengan sistem melalui use case - use case. Aktor Admin dalam sistem ini mewakili guru atau administrator sekolah, dimana Admin dapat melakukan Manajemen Member, Manajemen Home, dan Manajemen About. Sedangkan aktor Pengguna dalam sistem ini yaitu para siswa atau peserta didik yang belajar bahasa Mandarin. Aktor Pengguna dapat melakukan Registrasi Awal, Melakukan Belajar Nada, Belajar Bopomofo, dan Belajar Hanzi, Melakukan Latihan Nada, Latihan Bopomofo, dan Latihan Hanzi, dan Melihat Score masing-masing. Berdasarkan use case diagram sistem ini, kemudian dijabarkan lagi ke dalam proses bisnis sistem yang digambarkan dengan activity diagram.

10

2. Activity Diagram Siswa

Mulai

Melakukan Login

Memilih Menu Pembelajaran

Melihat Hasil Score

Logout

Selesai

Input Username dan Password

Cek User

Membuka Halaman Home

Salah

Benar

Pilih Menu

Belajar/Latihan

Nada BopomofoHanzi

Proses Perhitungan Score

Menampilkan Score

Keluar dari Sistem

SistemSiswa

Gambar 3 Activity Diagram Siswa

Activity Diagram pada Gambar 3 menggambarkan bagaimana proses bisnis

yang terjadi dalam sistem pembelajaran bahasa Mandarin. Proses bisnis ini merupakan aktivitas yang terjadi di dalam sistem dimana antara aktor akan melakukan interaksi dengan sistem. Siswa akan melakukan login terlebih dahulu untuk kemudian dapat masuk ke dalam sistem. Di dalam sistem, siswa dapat memilih menu Belajar atau Latihan. Pada setiap menu tersebut, siswa diberikan pilihan mengenai Belajar Nada, Belajar Bopomofo, maupun Belajar Hanzi. Setiap materi yang dipelajari terdapat berbagai jenis soal latihan. Pada akhirnya, siswa dapat melihat score berdasarkan hasil latihan yang diikuti.

11

3. Class Diagram Sistem

AdminModelusernamepassword

update_entry()check_exists()

AdminController

index()konten_home()konten_about()member()member_delete()logout()konten_home_update_entry()konten_about_update_entry()

MemberModelidnamausernamepasswordsekolahkelas

insert_entry()update_entry()delete_entry()select_entry()select_entry_by_username()select_all_entry()check_exists()

MemberController

index()latihan()latihan_bopomofo()latihan_nada()latihan_hanzi()latihan_hanzi_insert()latihan_nada_insert()latihan_bopomofo_insert()skor()logout()

SkorModelidid_memberjenis_latihantanggalskor

insert_entry()select_all_entry()

GuestController

index()about()login()signup()signup_entry()login_entry()

KontenModelhomeabout

insert_entry()update_entry()update_home_entry()update_about_entry()select_entry()

Gambar 4 Class Diagram Sistem

Class diagram pada Gambar 4 menunjukkan relasi antar objek yang terdapat

dalam sistem pembelajaran bahasa Mandarin. Objek-objek tersebut yaitu Registrasi, Belajar, dan Latihan, dimana seluruh objek tersebut memiliki class boundary sebagai user interface, class controller sebagai method atau fungsi, dan class entity sebagai database-nya. Perancangan Database

Merupakan tahapan perancangan terhadap database sesuai dengan data-data yang terlibat dengan proses yang terjadi pada aplikasi pembelajaran ini. Keterkaitan antar data-data yang terlibat dituangkan dalam bentuk database.

1. tbl_administrator Tabel 1 Tabel Administrator

Nama_Kolom Tipe_data Username varchar (100) Password varchar (100)

12

Tabel administrator (Tabel 1) adalah tabel yang digunakan untuk menyimpan username dan password administrator. Tabel ini terdiri dari kolom username dan password.

2. tbl_konten Tabel 2 Tabel Konten

Nama_Kolom Tipe_data Home Text About Text

Tabel Konten (Tabel 2) adalah tabel yang digunakan untuk menyimpan kata –

kata dari home dan about. Tabel ini terdiri dari kolom home dan about. 3. tbl_member

Tabel 3 Tabel Member Nama_Kolom Tipe_data Id int (11) Nama varchar (255) Username varchar (255) Password varchar (255) Sekolah varchar (255) Kelas varchar (3)

Tabel Member (Tabel 3) adalah tabel yang digunakan untuk menyimpan

nama-nama member. Tabel ini terdiri dari beberapa kolom yaitu id, nama, username, password, sekolah, dan kelas.

4. tbl_skor Tabel 4 Tabel Skor

Nama_Kolom Tipe_Data Id int (11) id_member int (11) jenis_latihan varchar (255) Tanggal Datetime Skor int (11)

Tabel Skor (Tabel 4) adalah tabel yang digunakan untuk menyimpan skor

latihan dari member yang telah mengerjakan latihan. Tabel ini terdiri dari beberapa kolom yaitu id, id_member, jenis_latihan, tanggal, dan skor.

4. Hasil dan Pembahasan

Pada tahapan ini aplikasi pembelajaran bahasa Mandarin diimplementasikan berdasarkan pada rancangan yang telah dilakukan pada tahapan sebelumnya. Berikut ini akan dibahas mengenai implementasi tampilan halaman website (form) yang terdapat pada Aplikasi ini.

13

Gambar 5 Halaman Belajar Bopomofo

Gambar 5 menunjukkan tampilan dari halaman belajar bopomofo yang ketika

diklik akan mengeluarkan suara sesuai hurufnya. [10]

Kode Program 1 Potongan Kode Belajar Bopomofo

Kode Program 1 adalah kode program yang digunakan untuk membuat animasi di dalam canvas. Pada baris 1 sampai dengan baris 8 merupakan kode program untuk menangani ketika dilakukan event mouseup. Maka akan di cek pada setiap box huruf bopomofo jika mengenai akan dibunyikan sesuai dengan sound yang ada di dalam box. Sedangkan baris 10 sampai dengan baris 22 merupakan kode program untuk menangani event mousemove. Ketika user melakukan event mouse move maka perlu dicatat posisi x dan y cursor user.

1. canvas.onmouseup = function(e) { 2. for (i=0;i<boxes.length;i++) { 3. if (x >= boxes[i].x && x <= boxes[i].x + 60 4. && y >= boxes[i].y && y <= boxes[i].y + 60) { 5. boxes[i].sound.play(); 6. } 7. } 8. }; 9. 10.canvas.onmousemove = function(e) { 11. var targ; 12. if (!e) 13. e = window.event; 14. if (e.target) 15. targ = e.target; 16. else if (e.srcElement) 17. targ = e.srcElement; 18. if (targ.nodeType == 3) // defeat Safari bug 19. targ = targ.parentNode; 20. x = e.pageX - $(targ).offset().left; 21. y = e.pageY - $(targ).offset().top; 22.};

14

Gambar 6 Halaman Belajar Nada

Gambar 6 menunjukkan tampilan dari halaman belajar nada. Ketika kata –

kata diklik akan mengeluarkan suara sesuai huruf dan nadanya. [11]

Kode Program 2 Potongan Kode Belajar Nada

Kode Program 2 adalah potongan kode program yang digunakan untuk membuat suara pada halaman belajar nada. Pada baris 1 sampai dengan baris 26 merupakan kode program untuk membuat tabel yang masing – masing baris berisi link suara.

1. <table width="80%" border="1" rules="all"> 2. <tr> 3. <th>Nada 1</th><th>Nada 2</th><th>Nada 3</th><th>Nada 4</th><th>Nada 4. Netral</th> 5. </tr> 6. <tr> 7. <th><img src="<?php echo base_url(); ?>img/nada1.png" /></th> 8. <th><img src="<?php echo base_url(); ?>img/nada2.png" /></th> 9. <th><img src="<?php echo base_url(); ?>img/nada3.png" /></th> 10.<th><img src="<?php echo base_url(); ?>img/nada4.png" /></th> 11. 12. </tr> 13. <tr> 14. <td><a href="#" onclick="ba_play(1);return false;">Ba</td> 15. <td><a href="#" onclick="ba_play(2);return false;">Ba</td> 16. <td><a href="#" onclick="ba_play(3);return false;">Ba</td> 17. <td><a href="#" onclick="ba_play(4);return false;">Ba</td> 18. <td><a href="#" onclick="ba_play(0);return false;">Ba</td> 19. </tr> 20. <tr> 21. <td><a href="#" onclick="cai_play(1);return false;">Cai</td> 22. <td><a href="#" onclick="cai_play(2);return false;">Cai</td> 23. <td><a href="#" onclick="cai_play(3);return false;">Cai</td> 24. <td><a href="#" onclick="cai_play(4);return false;">Cai</td> 25. <td><a href="#" onclick="cai_play(0);return false;">Cai</td> 26. </tr>

15

Gambar 7 Halaman Belajar Hanzi

Gambar 7 menunjukkan tampilan dari halaman belajar hanzi. Ketika gambar

diklik akan masuk ke halaman sesuai bab yang dipilih. Setiap bab berisi materi bacaan, kosakata dan goresan huruf hanzinya.

Kode Program 3 Potongan Kode Belajar Hanzi

Kode Program 3 adalah potongan kode program yang digunakan untuk membuat tabel pada halaman belajar hanzi. Pada baris 1 sampai dengan baris 24 merupakan kode program untuk membuat tabel yang masing – masing berisi link gambar materi huruf hanzi.

1. <table width="700px" border="0" rules="all" > 2. <tr> 3. <th colspan="3">Pilih Bab</th> 4. </tr> 5. <tr> 6. <td><?php echo anchor('guest/belajar_hanzi_bab1','<img 7. src="'.base_url().'resources/hanzi_revisi/bab1.png" height="180px" 8 8. width="150px" />'); ?></td> 9. <td><?php echo anchor('guest/belajar_hanzi_bab2','<img 10. src="'.base_url().'resources/hanzi_revisi/bab2.png" height="180px" 11. width="150px" />'); ?></td> 12. <td><?php echo anchor('guest/belajar_hanzi_bab3','<img 13. src="'.base_url().'resources/hanzi_revisi/bab3.png" height="180px" 14. width="150px" />'); ?></td> 15. </tr> 16. <tr> 17. <td><?php echo anchor('guest/belajar_hanzi_bab4','<img 18. src="'.base_url().'resources/hanzi_revisi/bab4.png" height="180px" 19. width="150px" />'); ?></td> 20. <td><?php echo anchor('guest/belajar_hanzi_bab5','<img 21. src="'.base_url().'resources/hanzi_revisi/bab5.png" height="180px" 22. width="150px" />'); ?></td> 23. </tr> 24. </table>

16

Gambar 8 Halaman Latihan Bopomofo

Gambar 8 menunjukkan tampilan dari halaman latihan bopomofo. Ketika link

klik diklik akan mengeluarkan suara. Suara yang keluar merupakan sebuah soal yang harus dipilih jawabannya sesuai pilihan jawabannya.

Kode Program 4 Potongan Kode Hitung Skor Latihan Bopomofo

Kode Program 4 adalah potongan kode program yang digunakan untuk menyimpan hasil pengerjaan soal latihan bopomofo. Hasil pengerjaan akan ditangkap oleh program seperti pada baris 5 sampai dengan baris 14. Kemudian dihitung benar-salah jawaban pengguna seperti pada baris 17 sampai dengan baris 26. Kemudian hasil skor akan dimasukkan ke dalam basis data seperti pada baris 27.

1. $this->id_member = $_POST['id_member']; 2. $this->jenis_latihan = $_POST['jenis_latihan']; 3. $this->tanggal = date('Y-m-d H:i:s'); 4. 5. $a1 = $_POST["a1"]; 6. $a2 = $_POST["a2"]; 7. $a3 = $_POST["a3"]; 8. $a4 = $_POST["a4"]; 9. $a5 = $_POST["a5"]; 10. $a6 = $_POST["a6"]; 11. $a7 = $_POST["a7"]; 12. $a8 = $_POST["a8"]; 13. $a9 = $_POST["a9"]; 14. $a10 = $_POST["a10"]; 15. 16. $this->skor = 0; 17. if ($a1 == "c") $this->skor += 10; 18. if ($a2 == "b") $this->skor += 10; 19. if ($a3 == "b") $this->skor += 10; 20. if ($a4 == "a") $this->skor += 10; 21. if ($a5 == "c") $this->skor += 10; 22. if ($a6 == "a") $this->skor += 10; 23. if ($a7 == "c") $this->skor += 10; 24. if ($a8 == "a") $this->skor += 10;

17

Gambar 9 Halaman Skor Member

Gambar 9 menunjukkan tampilan dari halaman skor member, dimana akan

tampil nilai – nilai ketika member telah mengerjakan soal latihan.

Kode Program 5 Potongan Kode Skor Member

Kode Program 5 adalah potongan kode program yang digunakan untuk membuat tabel pada halaman skor member. Pada baris 5 sampai dengan baris 15 merupakan kode program untuk menampilkan skor member yang diambil dari database.

Tahapan berikutnya adalah membahas uji coba dan evaluasi aplikasi

pembelajaran bahasa Mandarin. Aplikasi akan diuji coba dari segi fungsionalitas dan performa dengan berbagai macam skenario berdasarkan implementasi yang dilakukan. Tujuan dilakukannya uji coba ini adalah untuk melakukan verifikasi dan validasi terhadap semua fitur dan fungsi dari aplikasi apakah telah sesuai dengan kebutuhan pengguna atau belum sehingga nantinya perlu dilakukan pengembangan sistem lebih lanjut. Pengujian pada aplikasi pembelajaran bahasa Mandarin dilakukan dengan menggunakan metode blackbox testing.

1.<table border="1" rules="all" width="80%"> 2. <tr><th colspan="4">SKOR MEMBER</th></tr> 3. <tr><th>No.</th><th>Tanggal</th><th>Jenis Latihan</th><th>Skor</th></tr> 4. <?php 5. $no = 1; 6. foreach ($skor as $s) { 7. echo "<tr>"; 8. echo "<td>$no</td>"; 9. echo "<td>$s->tanggal</td>"; 10. echo "<td>$s->jenis_latihan</td>"; 11. echo "<td align='center'>$s->skor</td>"; 12. echo "</tr>"; 13. $no++; 14. } 15. ?> 16. </table>

18

Hasil dari pengujian blackbox yang telah dilakukan yaitu menguji fungsi dari login user, logout, member registration, dan login admin. Pada fungsi login user, jika username dan password yang dimasukkan benar, maka hasil uji berhasil dan status uji dikatakan valid. Tetapi jika username dan password yang dimasukkan salah, maka hasil uji gagal dan status uji dikatakan valid. Pada fungsi logout, jika mengklik tombol logout akan keluar dari aplikasi dan harus login kembali untuk masuk, maka hasil uji berhasil dan status uji dikatakan valid.

Pada fungsi member regristration, jika kolom Nama, Username, Password, Sekolah, dan Kelas diisi, maka hasil uji berhasil dan status uji dikatakan valid. Tetapi jika salah satu dari kelima kolom atau semua kolom tidak diisi, maka hasil uji gagal dan status uji dikatakan valid. Pada fungsi login admin jika username dan password yang dimasukkan benar, maka hasil uji berhasil dan status uji dikatakan valid. Tetapi jika username dan password yang dimasukkan salah, maka hasil uji gagal dan status uji dikatakan valid.

Setelah melakukan pengujian sistem dengan metode blackbox testing, dilakukan juga pengujian dengan membandingkan nilai test antara pembelajaran secara konvensional dan pembelajaran menggunakan aplikasi pembelajaran melalui media komputer.

Uji coba dilakukan di SD Xaverius 3 Bandar Lampung pada 10 siswa kelas V tahun ajaran baru yang belum mendapatkan mata pelajaran bahasa Mandarin dan dikelompokkan menjadi 5 siswa pada kelompok A dan 5 siswa pada kelompok B. Terdapat tiga materi pelajaran yang diberikan, yaitu “Nada” sebagai materi satu, “Pelafalan” sebagai materi dua, dan “Hanzi” sebagai materi tiga. Kelompok A diajarkan dengan aplikasi komputer dan kelompok B diajarkan secara konvensional.

Pada kelompok A, ketiga materi diajarkan kepada siswa dengan menggunakan aplikasi komputer. Setiap materi yang diajarkan disertai dengan mengerjakan latihan soal sesuai dengan materi yang disampaikan. Pada kelompok B, ketiga materi diajarkan kepada siswa secara konvensional dan siswa juga diminta untuk mengerjakan latihan soal sesuai materi yang disampaikan.

Nilai kelompok A dan kelompok B dibandingkan. Nilai siswa yang lebih tinggi antara menggunakan aplikasi model pembelajaran dengan cara konvensional memperlihatkan apakah proses pemahaman mengenai materi yang menggunakan aplikasi model pembelajaran lebih baik dari pada proses pemahaman materi secara konvensional.

SD Xaverius 3 menetapkan bahwa para siswa, khususnya kelas V, harus mengikuti pelajaran bahasa Mandarin selama 90 menit dalam satu minggu. Dalam belajar mengajar, satu jam pelajaran memiliki waktu 45 menit. Pembelajaran bahasa Mandarin pada kelompok A dan B akan diadakan masing – masing tiga kali yaitu untuk membahas satu materi setiap satu pertemuan.

19

Tabel 6 Tabel Catatan Waktu Pembelajaran Siswa Kelompok A

No. Nama Waktu Materi 1 Materi 2 Materi 3

1. Grace 90 menit 90 menit 90 menit 2. Yohanes 90 menit 90 menit 90 menit 3. Kevin 90 menit 90 menit 90 menit 4. Sinta 90 menit 90 menit 90 menit 5. Bobby 90 menit 90 menit 90 menit

Tabel 7 Tabel Catatan Waktu Pembelajaran Siswa Kelompok B

No. Nama Waktu Materi 1 Materi 2 Materi 3

1. Marcel 90 menit 90 menit 90 menit 2. Surya 90 menit 90 menit 90 menit 3. Lita 90 menit 90 menit 90 menit 4. Amel 90 menit 90 menit 90 menit 5. Adi 90 menit 90 menit 90 menit

0

20

40

60

80

100

Materi 1 Materi 2 Materi 3

Perbandingan Nilai Rata - Rata Hasil Pembelajaran dengan Aplikasi dan Pembelajaran secara Konvensional

AplikasiKonvensional

Gambar 10 Grafik Nilai Rata – Rata

Gambar 10 menunjukkan bahwa terjadi perbedaan, rata – rata nilai tes pada masing – masing kelompok dalam pembelajaran menggunakan aplikasi lebih tinggi, dibandingkan dengan nilai tes yang mengunakan pembelajaran secara konvensional. Setelah melakukan pengujian dapat disimpulkan bahwa sistem pembelajaran bahasa Mandarin untuk pemula, dapat digunakan sebagai media pembelajaran oleh para siswa dan ataupun pemula. 5. Simpulan

Berdasarkan hasil dan pembahasan yang dilakukan, dapat disimpulkan bahwa penerapan HTML5 untuk konten audio pada alat bantu pembelajaran bahasa Mandarin dapat berjalan dengan baik dan dapat digunakan untuk pembelajaran

20

berdasarkan besarnya minat dan ketertarikan siswa dalam menggunakan aplikasi pembelajaran pada komputer. Untuk pengembangan aplikasi yang telah dibangun dapat ditambahkan materi dan variasi contoh soal pada pelajaran bahasa Mandarin agar siswa memiliki pemahaman tentang bahasa Mandarin secara lebih mendalam.

6. Pustaka [1] Lina, Ida Astuti, 2007, Jurnal : Aplikasi Pembelajaran Bahasa Mandarin untuk Anak – Anak Sekolah Dasar Dengan Menggunakan Swish Max dalam Bentuk CD Interaktif, Jakarta : Universitas Gunadarma. [2] Li, Sofia, 2011, 注音字母 zhuyin zimu (pelafalan lama) dan 拼音 pinyin (pelafalan baru). [3] Adelia, 2010, Mempelajari Nada dalam bahasa Mandarin. [4] Scurfield, Elizabeth, dan Song Lianyi, 2000, Bahasa Mandarin untuk Pemula, Jakarta : Grasindo. [5] Swaristika, Andriana, 2011, Skripsi: Perancangan Aplikasi Pembelajaran Bahasa Inggris “Telling the Time” Berbasis Multimedia, Jakarta : Universitas Pembangunan Nasional “Veteran”. [6] Achmad, M. Alwi, 2003, Skripsi : Penggunaan media visual dalam

proses belajar mengajar, Makasar : Universitas Negri Makasar. [7] Khafidli, M. Firgiawan, 2011, Trik Menguasai HTML5, CSS, PHP

APLIKATIF, Yogyakarta : Lokomedia. [8] Widigdo, A.K, 2003, Modul: Dasar Pemrograman Php dan MySql, IlmuKomputer. [9] Sommerville, Ian, 2000, Software Engineering (Rekayasa Perangkat Lunak), Jakarta: Erlangga. [10] Izzyc53, 2008, Mandarin Chinese Pronounciation, Better Chinese. [11] David Qing, 2011, Chinese Tones, Mandarin Impossible.