SNIPTEK 2014
ISBN: 978-602-72850-5-7
PERANCANGAN ANIMASI INTERAKTIF PERMAINAN MEWARNAI UNTUK ANAK USIA DIATAS EMPAT TAHUN Oos Muhamad Jumroh AMIK BSI Tangerang
[email protected] ABSTRAK — Perkembangan ilmu pengetahuan dan teknologi sangat pesat terutama dibidang teknologi salah satunya adalah komputer, komputer sebagai sarana penyedia permainan yang diharapkan dapat memberikan edukasi yang baik dan tepat. Sehingga saat ini banyak jenis permainan komputer yang beredar jarang sekali permainan yang mendidik, banyak permainan yang mengandung unsur kekerasan ataupun hal-hal yang tidak pantas. Usia anak di atas empat tahun merupakan dasar untuk menggali kecerdasan yang ada pada anak. Karena pada masa ini anak-anak mudah sekali menerima berbagai upaya dalam pengembangan potensi yang dimiliki, berupa permainan edukasi dengan memasukan soal-soal latihan dalam tentang pendidikan agama islam. Perancangan ini dibuat menggunakan metode waterfall yaitu metode dengan menganilis, perancangan, impelementasi, pengujian dan pengoprasian dengan harapan memperoleh pengetahuan baru sebagai informasi serta menggunakan Macromedia Flash 8. Salah satuh contoh penerapan dalam permainan mewarnai adalah pembelajaran bagi pendidikan usia di atas empat tahun dikemas dengan animasi interaktif dan pembelajaran dengan animasi interaktif ini mengoptimalkan konsep multimedia dari audio visual, game serta gambar yang menjadikan permainan mewarnai lebih menarik dan interaktif. Kata Kunci:Animasi Interaktif; Mewarnai; Usia Diatas Empat Tahun ABSTRACT - The development of science and technology is very rapid, especially in the field of technology one of which is the computer, computer as a means of game providers are expected to provide good education and appropriate. So today many types of computer games are rarely a game that educates, many games that contain elements of violence or things that are not appropriate. Age of children above four years is the basis to explore the intelligence that exists in children. Because at this time the children are very easy to receive various efforts in the development of its potential, in the form of educational games to include exercises in the matter of Islamic religious education. This design is made
INF-244
Maryanah Safitri STMIK Nusa Mandiri Jakarta
[email protected] using waterfall method that is method with the release, designing, impelementasi, testing and pengoprasian with the hope of acquiring new knowledge as information and using Macromedia Flash 8. One example of application in coloring game is learning for education age above four years packed with animation Interactive and interactive animated learning optimizes the multimedia concept of audio visuals, games and images that make coloring games more engaging and interactive. Keywords: Interactive Animation; Coloring; Age Over Four Years
PENDAHULUAN Video games adalah salah satu sarana hiburan yang saat ini sedang mengalami kemajuan yang pesat dan banyak sekali jenis-jenis sangat tipe video games yang beredar dipasaran, namun jarang sekali kita temui game edukasi dan mendidik, bahkan banyak game yang ada sekarang mengandung unsur kekerasan ataupun hal-hal yang tidak pantas, pesatnya perkembangan teknologi informasi contohnya game online yang banyak dimainkan oleh anak-anak saat ini di jasa penyedia layanan internet atau sering disebut juga warnet (Sumber : detik.com/21-2-2013). Oleh karena itu penulis tertarik untuk membuat program permainan yang dapat memberikan nilai positif bagi setiap pemainnya terutama anak-anak berupa game edukasi. Game edukasi sangat menarik untuk dikembangkan. Ada beberapa kelebihan game edukasi dibandingkan dengan metode edukasi konvensional. Salah satu kelebihan utama game edukasi adalah visualisasi dari permasalahan nyata. Maksud penulis membuat suatu perancangan program animasi interaktif ini adalahmembangun aplikasi yang dapat mengubah cara belajar konvensional menjadi cara belajar simulasi dengan game edukasi, mengembangkan kreatifitas anak, karena dalam game edukasi memiliki unsur ketepatan, tantangan dan ketelitian, serta untuk memberikan pengetahuan kepada anakanak agar dapat mengenal berbagai macam warna dalam menunjang kreatifitas dalam mewarnai.
SNIPTEK 2014 Penulis membatasi ruang lingkup pembahasan animasi interaktif ini agar tidak keluar jauh dari pokok permasalahan yang akan dibicarakan. Penulis hanya membatasi teknik cara mewarnai, membuat permainan berupa quiz dan permainan yang cukup menarik dengan menggunakan Macromedia Flash 8 dan beberapa software pendukung seperti Adobe Photoshop
ISBN: 978-602-72850-5-7 Operasi Windows 7, Macromedia Flash 8 dan Adobe Phoshop CS6. B. Rancangan Perangkat Lunak Rancangan antar muka dalam aplikasi ini terdiri dari: 1. Tampilan Intro Tampilan ini berisi tentang judul program animasi yang sedang dimainkan
BAHAN DAN METODE Penelitian ini menggunakan menggunakan waterfall model dalam pengembangan perangkat lunak yang terdiri dari Analisis perangkat lunak (Software Analysis), Perancangan perangkat lunak (Software Design), Implementasi perangkat lunak (Coding), Pengujian perangkat lunak (Testing), serta Pengoprasian dan pemeliharaan (Operation and maintenance). Teknik pengumpulan data yang digunakan oleh peneliti dalam melakukan pengumpulan data untuk penelitian yaitu observasi dan studi pustaka. Sedangkan pengujian unit menggunakan Black Box Testing.
2.
Gambar 1. Tampilan Intro Tampilan Loading Tampilan ini berupa loading atau animasi berupa menunggu untuk dapat kehalaman berikutnya dengan cara tekan tombol start.
HASIL DAN PEMBAHASAN A. Analisa Kebutuhan sistem Kebutuhan sistem dibagi ke dalam dua jenis yaitu kebutuhan secara fungsional dan kebutuhan non fungsional. 1. Analisis Kebutuhan Fungsional Dibutuhkan sebuah aplikasi game yang mampu melakukan fungsi-fungsi seperti ini: a. Game ini merupakan game edukasi b. Pemain bisa mengetahui macam-macam warna c. Pemain dapat print hasil mewarnai d. Pemain dapat memainkan musik yang tersedia 2. Kebutuhan Non Fungsional Kebutuhan non fungsional dibagi menjadi: a. Aspek Perangkat Keras Spesifikasi perangakat keras untuk membuat game edukasi interaktif “Permainan Mewarnai Untuk Anak Usia Di Atas Empat Tahun” 1) Processor : berkecepatan 2.4 GHz 2) RAM : 2 GB Memory 3) Hard Disk : 500 GB 4) Monitor : resolusi 1024x 768Px 5) Mouse : standart mouse b. Aspek Perangkat Lunak Aplikasi dan software yang digunakan dalam pembuatan game ini adalah Sistem
3.
4.
Gambar 5.2. Tampilan Loading Tampilan Menu Utama Tampilan menu utama ini berisi 3 tombol menu dan 1 tombol navigasi untuk keluar, diantaranya tombol mewarnai, tombol soalsoal, tombol game lucu.
Gambar 5.3. Tampilan Menu Utama Tampilan Mewarnai Tampilan ini ada beberapa gambar hitam putih untuk dipilih dan diwarnai pada halaman berikutnya.
INF-245
SNIPTEK 2014 5.
ISBN: 978-602-72850-5-7
Gambar 5.4. Tampilan Mewarnai Tampilan Mewarnai Gambar Menampilkan karakter yang dipilih untuk diwarnai sesuai dengan kreatifitas anak-anak, hasilnya dapat di print dan tombol Menu Utama untuk kembali ke Halaman Menu Utama. Gambar 5.9. Tampilan Game 10. Tampilan Masuk Game Tampilan untuk masuk ke dalam arena game dengan menekan tombol mulai.
6.
7.
8.
9.
Gambar 5.5. Tampilan Mewarnai Gambar Tampilan Kuis Tampilan ini pemain bisa memasukan nama dan memulai soal dengan beberapa soal pilihan ganda. Gambar 5.6. Tampilan Kuis Tampilan Soal Kuis Tampilan ini berupa soal kuis dari satu sampai sepuluh dan terdapat animasi burung yang mengikuti mouse.
Gambar 5.7. Tampilan Soal Kuis Tampilan Nilai Kuis Tampilan ini hasil nilai dari sepuluh soal yang dijawab
Gambar 5.8. Tampilan Nilai Kuis Tampilan Game Tampilan Game mencari jejak ini terdapat suara buaya yang memberikan ketegangan.
INF-246
Gambar 5.10. Tampilan Masuk Game 11. Tampilan Arena Game Tampilan arena game dengan garis berbelokbelok, mencari jejak dari mulai start sampai finish.
Gambar 5.11. Tampilan Arena Game 12. Tampilan Kalah Main Game Tampilan ini jika pemain memainkan game.
kalah
saat
Gambar 5.12. Tampilan Kalah Main Game 13. Tampilan Menang Main Game Tampilan ini akan muncul jika pemain berhasil menyeselaikan beberapa level.
Gambar 5.13. Tampilan Kalah Main Game
SNIPTEK 2014
ISBN: 978-602-72850-5-7
14. Tampilan Musik MP3 Tampilan ini terdapat sepuluh tombol untuk memainkan lagu dan semua lagu dikhususkan untuk anak-anak.
Tombol Game Lucu
Tombol Mp3 Tombol Stop Suara Tombol Exit
Gambar 5.14. Tampilan Musik MP3 C. Pengujian Unit Berikut ini adalah pengujian blackbox perancangan animasi interaktif permainan mewarnai untuk anak usia di atas empat tahun. 1. Pengujian Terhadap Halaman Intro Tabel 5.1.Hasil pengujian Blackbox Testing Halaman Intro Input / Event Tombol Masuk
Tombol Profil Tombol Keluar
Proses on(release){ gotoAnd Play(1); } on(release){ gotoAnd Play(35); } on(release){ fscomm and("qu it"); } stop (); fscommand("fullscr een",true);
Output / Next Stage Menampilkan Halaman Loading
Hasil Pengujian Sesuai
Menampilkan Halaman Profil
Sesuai
Keluar Dari Permainan
Sesuai
Menampilkan Halaman Opening
Sesuai
Proses on(release){ gotoAndPlay (2);}
Output / Next Stage Menampilkan Halaman Menu Utama
Hasil Pengujian Sesuai
3. Pengujian Terhadap Halaman Menu Utama Tabel 5.3.Hasil pengujian Blackbox Testing Halaman Menu Utama Input / Event Tombol Mewarnai Tombol Soal-Soal
Proses on(press){ gotoAndPlay(3) nextFrame(); } on(press){ gotoAndStop(12) nextFrame();
Menampilkan Halaman Game
Sesuai
Menampilkan Halaman Mp3
Sesuai
Menghentikan Suara
Sesuai
Keluar Dari Permainan
Sesuai
fscommand("quit ");}
4. Pengujian Terhadap Halaman Mewarnai Tabel 5.4.Hasil pengujian Blackbox Testing Halaman Mewarnai Input / Event Tombol Menu Utama Tombol Kartun
Proses on(release){ gotoAndPlay(3); } on(release){ gotoAndPlay(4) nextFrame(); }
Output / Next Stage Kembali ke Halaman Menu Utama Menampilkan Halaman Mewarnai Gambar
Hasil Pengujian Sesuai Sesuai
5.
2. Pengujian Terhadap Halaman Loading Tabel 5.2.Hasil pengujian Blackbox Testing Halaman Loading Input / Event Tombol Start
} on(press){ stopAllSounds(); gotoAndStop(24) nextFrame(); } on(press){ gotoAndStop(34) } on(release){ stopAllSounds(); } on(release){
Output / Next Stage Menampilkan Halaman Mewarnai
Hasil Pengujian Sesuai
Menampilkan Halaman Kuis
Sesuai
Pengujian Terhadap Halaman Mewarnai Gambar Tabel 5.5. Hasil pengujian Blackbox Testing Halaman Mewarnai Gambar Input / Event Tombol Kembali Tombol Warna Tombol Print
Proses on(press){ gotoAndPlay(3) } on (press){ _root.teks=kode warna;} on (release) { printNum(2, "bmax");}
Output / Next Stage Kembali ke Halaman Mewarnai Mewarnai Gambar
Hasil Pengujian Sesuai
Prints Hasil
Sesuai
Sesuai
6. Pengujian Terhadap Halaman Kuis Tabel 5.6.Hasil pengujian Blackbox Testing Halaman Kuis Input / Event Tombol Main Menu Tombol Masuk
Proses on(release){ gotoAndPlay(3); } on(press){ stopAllSounds(); gotoAndStop(13) }
Output / Next Stage Kembali ke Halaman Menu Utama Menampilkan Halaman Soal Kuis
Hasil Pengujian Sesuai Sesuai
7. Pengujian Terhadap Halaman Soal Kuis Tabel 5.7.Hasil pengujian Blackbox Testing Halaman Soal Kuis
INF-247
SNIPTEK 2014 Input / Event Tombol Main Menu Tombol Jawaban yang benar Tombol Jawaban yang salah
Proses on(release){ gotoAndPlay(3);} on (release){ gotoAndPlay(15) nilai++; } on (release){ gotoAndPlay(15) }
ISBN: 978-602-72850-5-7 Output / Next Stage Kembali ke Halaman Menu Utama Ke Soal Selanjutnya
Hasil Pengujian Sesuai
Ke Soal Selanjutnya
Sesuai
Sesuai
8. Pengujian Terhadap Halaman Nilai Kuis Tabel 5.8.Hasil pengujian Blackbox Testing Halaman Nilai Kuis Input / Event Tombol Menu Utama
Proses on(release){ gotoAndPlay(3); }
Output / Next Stage Kembali ke Halaman Menu Utama
Hasil Pengujian Sesuai
12. Pengujian Terhadap Halaman Kalah Main Game Tabel 5.12.Hasil pengujian Blackbox Testing Halaman Kalah Main Game Input / Event Tombol Coba Lagi
Proses
Output / Next Stage Menampilkan Halaman Arena Game
on(release){ gotoAndPlay(26) nextFrame(); }
Hasil Pengujian Sesuai
13. Pengujian Terhadap Halaman Menang Main Game Tabel 5.13. Hasil pengujian Blackbox Testing Halaman Menang Main Game Input / Event Tombol Menu Utama
Proses on(release){ gotoAndPlay(3); }
Output / Next Stage Kembali ke Halaman Menu Utama
Hasil Pengujian Sesuai
9. Pengujian Terhadap Halaman Game Tabel 5.9.Hasil pengujian Blackbox Testing Halaman Game
14. Pengujian Terhadap Halaman Musik Mp3 Tabel 5.14.Hasil pengujian Blackbox Testing Halaman Musik Mp3
Input / Event Tombol Mulai Main
Input / Event Tombol Menu Utama Tombol Stop Suara
Tombol Tentang Tombol Menu Utama
Proses on(release){ gotoAndPlay(25) nextFrame(); } on(release){ gotoAndPlay(32) nextFrame(); } on(release){ gotoAndPlay(3); }
Output / Next Stage Menampilkan Halaman Game
Hasil Pengujian Sesuai
Menampilkan Halaman Tentang Cara Bermain Kembali ke Halaman Menu Utama
Sesuai
Sesuai
10. Pengujian Terhadap Halaman Masuk Game Tabel 5.10.Hasil pengujian Blackbox Testing Halaman Masuk Game Input / Event Tombol Mulai
Proses on(release){ gotoAndPlay(26) nextFrame(); }
Output / Next Stage Menampilkan Halaman Arena Game
Hasil Pengujian Sesuai
11. Pengujian Terhadap Halaman Arena Game Tabel 5.11.Hasil pengujian Blackbox Testing Halaman Arena Game Input / Event Arena Game
INF-248
Proses on (rollOver){ gotoAndStop(32) } on (rollOver){ gotoAndStop(28) }
Output / Next Stage Menampilkan Halaman Kalah Main Game Menampilkan Halaman Menang Main Game
Hasil Pengujian Sesuai
Tombol Lagu
Proses on(release){ gotoAndPlay(3); } on(release){ stopAllSounds(); } on(press){ musik6.stop(); musik7.stop(); musik8.stop(); musik9.stop(); musik10.stop(); Tasya2.stop(); Tasya3.stop(); Tasya4.stop(); Tasya5.stop(); Tasya1 = new Sound(); Tasya1.attachSound(" Tasya1"); Tasya1.setVolume(10 0); Tasya1.start(0); }
Output / Next Stage Kembali ke Halaman Menu Utama Menghentika n Suara
Hasil Pengujian Sesuai
Memainkan Musik
Sesuai
Sesuai
KESIMPULAN Berdasarkan hasil penelitian yang dilakukan oleh penulis, maka penulis menarik beberapa kesimpulan sebagai berikut: 1. Aplikasi ini menyediakan menu game dan musik untuk anak-anak agar menambah daya tarik minat pengguna untuk menggunakan aplikasi ini.
SNIPTEK 2014
ISBN: 978-602-72850-5-7
2. Melalui aplikasi pembelajaran ini anak-anak dapat menyajikan cara mewarnai sesuai dengan kreatifitas anak dan hasilnya dapat diprint. 3. Flash menggunakan bahasa pemograman bernama ActionScript dan pada program Macromedia Flash 8 terdapat 2 jenis ActionScript yaitu ActionScript 1 dan ActionScript 2.
REFERENSI Binanto, Iwan. (2010). Multimedia Digital Dasar Teori dan Pemogramannya. Yogyakarta : Andi Offset. Chandra. (2004). Tujuh Jam Belajar Flash 8 untuk Orang Awam.Palembang : Mitra Wacana Media. Darjat. (2009). Panduan Belajar Flash untuk Pemula.Yogyakarta : MediaKom. Koswara, Eko. (2012). Manipulasi Photo dengan Photoshop. Bekasi : Dunia Komputer. Pressman, R.S. (2010). Software Engineering : a practitioner’s approach, New York : McGraw-Hill. Rizky, Soetam. (2011). Konsep Dasar Perangkat Lunak. Jakarta : PT. Prestasi Pustaka Raya. Sjukani, Moh. (2009). Algoritma dan struktur data 1 dengan C, C++ dan JAVA, Jakarta : Mitra Wacana Media. Suciadi, Andi Andreas. (2003). Menguasai Pembuatan Animasi dengan Macromedia Flash MX. Jakarta : Andi. Suyanto, M. (2005). Multimedia Alat Untuk Meningkatkan Keunggulan Bersaing. Yogyakarta : Andi.
INF-249
