PERANCANGAN INFOGRAFIS ANIMASI 2D “ SIMULASI GRADASI
WARNA” DENGAN TEKNIK MOTION GRAPHIC
NASKAH PUBLIKASI
diajukan oleh
Melati Ayuning Diaz
12.11.5855
kepada
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER
AMIKOM YOGYAKARTA
YOGYAKARTA
2016
1
PERANCANGAN INFOGRAFIS ANIMASI 2D “SIMULASI GRADASI
WARNA” DENGAN TEKNIK MOTION GRAPHIC
Melati Ayuning Diaz
1), Melwin Syafrizal
2),
1)Teknik Informatika STMIK AMIKOM Yogyakarta 2)
Sistem Informasi STMIK AMIKOM Yogyakarta
Jl Ringroad Utara, Condongcatur, Depok, Sleman, Yogyakarta Indonesia 55283 Email : melati.d@students.amikom.ac.id1), melwin@amikom.ac.id2)
Abstract - Many students in Early Childhood
Education (PAUD) and Kindergarten (TK) who do not understand color gradation, and only learned about the basic colors which taught by their teachers. Researcher are trying to design a color gradation's simulation to facilitate PAUD and TK students in order to know various shades with few portions.
In this thesis, the researcher tried to bring up the main points of the existing problems, and try to design interactive applications in order to provide an explanation of the color gradation pattern of PAUD and TK students.
This study will generate interactive
applications using Adobe Flash, and ActionScript 2.0. The product will be a CD and can be distributed to students of PAUD and TK. Later, interactive applications are expected to provide benefits broadly researchers for PAUD and TK teachers in general, and early childhood and kindergarten students in particular.
Keywords: Interactive application, design,
development, testing, implementation, evaluation, teachers, and students.
1. Pendahuluan
1.1 Latar Belakang Masalah
Penggiat dunia edukasi kini sangat kreatif dalam memberikan materi untuk siswa ataupun mahasiswa. Baik secara langsung, memakai proyektor, bahkan bisa keluar dari lingkup sekolah atau kampus. Khususnya untuk pendidikan anak usia dini. Siswa pasti menginginkan pembelajaran yang asik dan menyenangkan dalam kelasnya..
Peneliti mencoba membuat rancangan infografis animasi 2D sebagai aplikasi interaktif berjudul “Simulasi Gradasi Warna” sebagai media pembelajaran mewarnai untuk anak usia dini. Rancangan aplikasi interaktif ini berisikan simulasi gradasi warna serta materi penjelasan yang ada disetiap objek animasi. Simulasi ini dibuat dengan desain yang menarik sehingga dapat digunakan dengan baik oleh anak usia dini pada khususnya, dan bagi orang tua secara umum. Dengan menggunakan software Adobe Flash, peneliti akan membuat aplikasi interaktif gradasi warna tersebut.Disajikan secara sistematik sehingga didapatkan gambaran tentang dasar pembuatan makalah ini dan hasil yang diharapkan.
Pada pengamatan peneliti, metode pembelajaran pendidikan anak usia dini masih menggunakan papan tulis, dan kapur untuk menggambar pola dan mewarnai pola tersebut. Sehingga jika metode belajar siswa terkomputerisasi dengan media yang saat ini marak digunakan: proyektor. Terlebih, segmentasi pendidikan anak usia dini banyak yang menengah atas jika ditinjau dari segi ekonomi. Sehingga penggunaan proyektor menjadi hal yang biasa. Adapun pembelajaran di kelas, pada guru bisa memasangkan kabel HDMI dari komputer/laptop untuk dapat tersambung ke layar proyektor. Atau setiap anak usia dini disediakan komputer masing-masing agar siswa tersebut dapat mencoba bereksperimen sendiri.
1.2 Rumusan Masalah
Bagaimana cara merancang infografis animasi 2D sebagai aplikasi interaktif “Simulasi Gradasi Warna”?
1.3 Maksud dan Tujuan Penelitian
Merancang aplikasi interaktif “Simulasi Gradasi Warna” yang dapat membantu anak memahami pelajaran mewarnai bagi pendidikan anak usia dini.
1.4 Metode Pengumpulan Data
1. Metode Literatur
Metode pengumpulan data menggunakan berbagai macam literatur yaitu mencari informasi diberbagai jurnal dan buku tentang desain aplikasi interaktif. 2. Metode Wawancara
Metode pengumpulan data dengan mengadakan tanya jawab secara langsung terhadap pihak yang terkait yaitu pendidikan anak usia dini untuk mendapatkan informasi tentang hal-hal yang akan dimasukkan kedalam aplikasi secara tepat dan akurat.
3. Metode Obvervasi
Metode pengumpulan data dengan cara mengadakan pengamatan secara langsung terhadap kegiatan yang dilakukan oleh pendidikan anak usia dini.
2. Landasan Teori 2.1 Tinjauan Pustaka
Menurut Galih Eko Setiawan (2014) Jurusan Teknik Informatika Universitas Nuswantoro Semarang yang berjudul “Media Pembelajaran Interaktif Simulasi
2
Pembangkit Listrik Tenaga Matahari Untuk Kelas VIII SMPN 15 Semarang” Untuk membuat sebuah media pembelajaran interaktif yang baik, perlu dilakukan beberapa tahapan yang jelas. Dengan demikian proses pembuatan media pembelajaran interaktif dapat dilakukan dengan lancar karena sudah dirancang dalam konsep yang terarah. [1]
Menurut Ashif Khairul Anam (2014) Jurusan Sistem Informasi STMIK AMIKOM YOGYAKARTA yang berjudul “Perancangan Multimedia Interaktif Pada Lembah Fitness UGM Sebagai Media Informasi dan Promosi” Pembuatan multimedia interaktif merupakan kemampuan untuk menggabungkan antara kemampuan animasi, text, grafik dan suara dengan kemampuan logika actionscript sehingga bisa dikatakan layak untuk memberikan informasi yang lebih menarik. [2]
Menurut Bayu Susilo (2014) Jurusan Manajemen Informatika STMIK AMIKOM YOGYAKARTA yang berjudul “Perancangan Dan Pembuatan Musik Video The Story After Berjudul “Melody” Berbasis Animasi 2d Menggunakan Teknik Digital Animasi Sebagai Media Promosi" Teknik animasi 2D cenderung mengambil fokus pada manipulasi gambar, sedangkan teknik 3D biasanya membagun dunia maya dengan karakter dan objek-bjek yang saling bergerak dan berinteraksi. Animasi 3D juga dapat membuat gambar yang terlihat realistis bagi pemirsanya. [3]
Menurut Cynthia Larasati Manggiasih (2011) Jurusan Sistem Informasi STMIK AMIKOM YOGYAKARTA yang berjudul “Analisis dan Pembuatan Simulasi Perubahan Zat Berbasis Multimedia Interaktif Mengunakan Adobe Flash” Struktur aplikasi multimedia sangat besar fungsinya terutama didalam pembuatan atau perancangan suatu aplikasi multimedia, karena dengan menggunakan struktur tersebut suatu rancangan aplikasi multimedia dapat terbantu dengan mudah. [4]
Menurut Muhammad Firiyadi (2014) Jurusan
Teknik Informatika STMIK AMIKOM
YOGYAKARTA yang berjudul “Peranangan Video Animasi 2D Simulasi Terjadinya Hilal Dengan Teknik Motion Graphic” Animasi 2D biasa disebut dengan animasi kartun. Kartun adalah suatu gambar interpreatif yang simbolis mengenai sikap orang, situasi atau kejadian tertentu. [5]
Pada buku yang berjudul Multimedia sebagai Alat Untuk meningkatkan keunggulan bersaing karya M.Suyanto (Bab 1 hal 20) multimedia merupakan kombinasi dari komputer dan video atau secara umum multimedia merupakan kombinasi dari tiga elemen. Tiga elemen yang dimaksud yaitu suara, gambar, dan teks. [6] Menurut Suyanto (2003 : 353), agar multimedia dapat menjadi alat kenggulan bersaing perusahaan, pengembangan sistem multimedia harus mengikuti sebelas tahapan pengembangan sistem Multimedia. [7]
2.2 Pengertian Multimedia
Pada buku yang berjudul Multimedia sebagai Alat Untuk meningkatkan keunggulan bersaing karya M.Suyanto (Bab 1 hal 20) multimedia merupakan kombinasi dari komputer dan video atau secara umum multimedia merupakan kombinasi dari tiga elemen. Tiga elemen yang dimaksud yaitu suara, gambar, dan teks. [4]
2.2.1 Elemen Multimedia 1. Teks (Text)
Bentuk data multimedia yang paling mudah disimpan dan dikendalikan adalah teks. Teks dapat membentuk kata, surat atau narasi dalam multimedia yang menyajikan bahasa. Kebutuhan teks bergantung kepada penggunaan aplikasi multimedia.
2. Suara (Sound)
Audio (suara) atau bunyi dalam PC multimedia, khususnya pada aplikasi bidang bisnis dan game sangat bermanfaat. PC multimedia tanpa bunyi hanya disebut unimedia, bukan multimedia.
3. Grafik (Image)
Alasan untuk menggunakan gambar dalam presentasi atau publikasi multimedia kaena lebih menarik perhatian dan dapat mengurangi kebosanan dibanding dengan teks. Gambar dapat meringkas dan menyajikan data kompleks dengan cara yang baru dan lebih berguna. Sering dikatakan bahwa gambar mampu myampaikan seribu kata, tetapi itu hanya berlaku ketika pengunjung dapat menampilkan gambar yang diinginkan saat memerlukannya.
4. Video
Video adalah salah satu media audio visual yang digunakan sebagai media komunikasi dalam pembangunan.
5. Animasi (Animation)
Kata animasi diambil dari kata animation, to animate. Jadi definisi animasi adalah menghidupkan segala benda atau objek mati. Kata “menghidupkan” disini bukanlah memberi nyawa yang merupakan hak Tuhan, melaikan membuatnya bergerak sehinga terlihat seperti hidup.
2.3 Definisi Animasi 2D
Animasi 2D adalah penciptaan gambar bergerak dalam lingkungan dua dimensi. Hal ini dilakukan dengan urutan gambar berturut-turut, atau “frame”, yang mensimulasikan gerak oleh setiap gambar menunjukkan berikutnya dalam perkembangan bertahap langkah-langkah.
2.4 Definisi Desain Grafis
Dapat didefinisikan sebagai aplikasi dari keterampilan seni dan komunikasi untuk kebutuhan bisnis dan industri (yang bisa disebut seni komersial). Elemen-elemennya adalah:
3
1. Garis 2. Bentuk 3. Warna 4. Kontras Nilai
2.5 Pengertian Motion Graphic
Motion graphic atau motion grafis adalah istilah salah satu media atau salah satu sub dari ilmu desain grafis untuk opening bumper, film, televisi, video clip dan internet. Pada dunia perdagangan, informasi, hiburan adalah suatu tantangan, ketika dimana pemirsa atau audience memutuskan apakah tidak atau akan untuk saluran, keluar dari situs web, atau ketika menonton trailer, untuk melihat film.
2.6 Pengertian Media Interaktif
Media interaktif merupakan istilah untuk gabungan antara berbagai elemen multimedia yang bersifat interakif dan menarik perhatian usernya sehingga terjadi interaksi antara user dan media itu sendiri.
2.7 Teori Produksi Multimedia
a. Multimedia Content Production b. Multimedia Communication c. Digitalisasi
d. Editing e. Animasi
f. Computer Based Animation
2.8 Pengertian Infografis
Pengertian Infografis adalah suatu bentuk penyajian data dengan konsep visual yang terdiri dari teks dengan tambahan gambar-gambar ilustrasi yang menarik.
2.9 Pengertian Gradasi Warna
Gradasi warna adalah corak warna yang bisa dikembangkan dari dua warna atau lebih.
3. Analisis dan Perancangan 3.1 Deskripsi Aplikasi
Aplikasi ini adalah sebuah aplikasi multimedia, yang dapat digunakan atau memilik fungsi sebagai media pengenalan atau pembelajaran tentang simulasi gradasi warna.
3.2 Mengidentifikasi Masalah
Pada tahap analisis sistem ini, analisis mempunyai fungsi untuk mengidentifikasi analisis sistem, melakukan studi kelayakan dan menganalisis kebutuhan sistem.
3.3 Analisis Sistem Multimedia 3.3.1 Analisis Sistem
Analisis dapat didefinisikan sebagai penguraian dari suatu sistem informasi yang utuh kedalam bagian-bagian atau komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan-permasalahan, kesempatan, hambatan yang terjadi dan
kebutuhan yang dihadapkan, sehingga dapat diusulkan perbaikan-perbaikannya.
3.3.2 Analisis Kelemahan Sistem
Tujuan utama dari analisis sistem adalah mengevaluasi dan menentukan permasaahan pada sekolah pendidikan anak usia dini yang sistem pembelajarannya kurang menarik dan belum mengunakan sistem komputerisasi.
3.4 Analisis Kebutuhan Sistem
Dalam pembahasan ini menguraikan kebutuhan sistem multimedia dan pembelajaran untuk pendidikan anak usia dini tentang ‘Simulasi Gradasi Warna’ agar dapat diusulkan untuk membantu guru dan anak usia dini dalam menyampaikan dan memahami materi tentang apa itu gradasi warna, dan apa manfaat belajar memahami gradasi warna.
3.4.1 Analisis Kebutuhan Fungsional
Sistem mampu memberikan informasi penjelasan tentang simulasi gradasi warna mulai
3.4.2 Analisis Kebutuhan Non Fungsional
Analisis kebutuhan non fungsional adalah bagian yang akan mendukung jalan proses pembutuhan aplikasi multimedia intraktif simulasi gradasi warna dengan teknik motion graphic. Kebutuhan in meliputi perangkat keras (hardware), kebutuhan perangkat lunak (software), dan kebutuhan sistem SDM (brainware). Berikut ini beberapa kebutuhan non fungsional tersebut.
a. Analisis Kebutuhan Perangkat Keras
Perangkat keras yang akan digunakan untuk membangun system aplikasi ini adalah sebuah notebook dengan spesifikasi sebagai berikut :
Laptop ASUS A43S
Processor Intel Core i3 2330M CPU @ 2,2 GHz
RAM 4GB
VGA NVIDIA GeForce® GT 610M
Hardisk 500 GB
b. Analisis Kebutuhan Perangkat Lunak
Aspek perangkat lunak (Software) adalah semua prangkat lunak atau aplikasi yang diperlukan untuk proses pebuatan animasi 2D ‘simulasi gradasi warna’ adalah sebagai berikut:
Adobe Photoshop CS6
Adobe After Effect CS6
Adobe Flash CS6
Adobe Audition CS6
3.5 Analisis Kelayakan Sistem
Analisis kelayakan sistem atau sering disebut studi kelayakan adalah suatu studi yang akan digunakan untuk menentukan kemungkinan apakah pengembangan proyek sistem multimedia layak dieruskan atau dihentikan.
4
3.5.1 Kelayakan Teknologi
Teknologi berkembang semakin cepat tak terkendali dengan teknologi komputer. Komputer telah memberikan banyak kemudahan bagi manusia. Hal yang paling berguna adalah dalam proses penyampaian informasi dan menyediakan peluang bagi kemajuan dan mengubah penyampaian informasi cara lama.
3.5.2 Kelayakan Hukum
Pertanyaan mendasar yang harus dijawab untuk menilai kelayakan hukum adalah “Dapatkah media yang baru yaitu media berbasis multimedia interaktif tidak melanggar etika dan hukum?”. Media tersebut tidak melanggar hukum karena media terebut sudah dikemas sesuai dengan materi dan tepat sasaran.
3.5.3 Kelayakan Operasional
Penilaian teradap operasi dilakukan untuk mengatur apakah media yang dibuat tersebut dapat diterima dan dapat berjalan dengan baik. Hal ini menyangkut kemampuan media informasi tersebut dalam memberkan informasi. Pertanyaan mendasar yang harus dijawab untuk menilai kelayakan operasional adalah “Dapatkah media yang baru yaitu media berbasis multimedia interaktif penyampaian materi seputar gradasi warna dapat digunakan dengan mudah dan dapat dimengerti oleh anak usia dini dan guru.
3.5.4 Kelayakan Jadwal
Dari kendala waktu, sistem informasi multimedia yang akan diharapkan jelas tidak ada kendala waktu. Karena perencanaan sebuah sistem ini disesuaikan dengan kurikulum sekolah yang sedang berlaku sehingga pengunaannya tidak kadaluarsa. Dengan demikian dari sisi kelayaka jadwal, pembuatan aplikasi multimedia tersebut layak untuk dilaksanakan.
3.5.5 Kelayakan Strategi
Pembelajaran menggunakan media interaktif dimungkinkan akan mempengaruhi strategi pengembangan pendidikan yaitu dalam hal strategi terkomputerisasi yang lebih menarik dan tepat sasaran.
3.6 Perancangan Sistem 3.6.1 Konsep Struktur Navigasi
Berikut ini merupakan struktur navigasi dalam aplikasi multimedia simulasi gradasi warna:
Gambar 1. Perancangan Struktur Navigasi
3.6.2 Perancangan Tampilan
1. Tampilan Menu Utama
Gambar 2. Rancangan Menu Utama 2. Rancangan Aplikasi
Gambar 3. Rancangan Aplikasi 3. Tampilan Warna yang Dipilih
Gambar 4 Menu Penggabungan Warna
4. Tampilan Hasil Penggabungan Warna
5
5. Tampilan Menu Credit
Gambar 6. Tampilan Menu Credit
4. Implementasi dan Pembahasan
Implementasi merupakan tahapan setelah melakukan analisis dan perancangan sistem pada siklus rekayasa perangkat keras dimana sistem siap dioperasikan pada keadaan yang sebenarnya sehingga dari sini akan dapa diketahui apakah aplikasi interaktif yang telah dibuat benar-benar dapat menghasilkan output atau keluaran yang sudah sesuai dengan tujuan yang diinginkan.
1. Hasil Perancangan Menu Intro
Gambar 7. Menu Intro 2. Tampilan Menu Utama
Gambar 8 Tampilan Menu Utama 3. Tampilan Menu Gradasi Warna
Gambar 9 Tampilan Menu Gradasi Warna
4. Tampilan Penggabungan Warna
Gambar 10 Tampilan Penggabungan Warna 5. Tampilan Hasil Penggabungan Warna
Gambar 11 Hasil Penggabungan Warna
6. Tampilan Menu Credit
Gambar 12 Tampilan Menu Credit
4.6 Hasil Pengujian
Tabel 1. Tabel Uji Aplikasi
No Kasus Hasil Pengujian
1. Melihat Menu Utama Berhasil 2. Menampilkan Menu Gradasi
Warna
Berhasil 3. Menampilkan Menu
Penggabungan Warna
Berhasil 4. Menampilkan Menu Hasil
Penggabungan Warna
Berhasil 5. Menampilkan Menu Credit Berhasil
5. Penutup
5.1Kesimpulan
Berdasarkan pembahasan dan penjelasan keseluruhan materi dari bab-bab sebelumnya dengan judul “Perancangan Infografis Animasi 2D ‘Simulasi Gradasi Warna’ dengan Teknik Motion Graphic” serta selesainya
6
penyusunan skripsi dan pembuatan aplikasi ini dapat diambil kesimpulan sebagai berikut:
1. Untuk mempelajari bagaimana bermain gradasi warna itu, dan pengguna akan mengetahui pencampuran warna yang sudah dipilih.
2. Aplikasi simulasi gradasi warna sistemnya menggunakan komputer, jadi para pengguna lebih tertarik untuk mengoperasikannya.
banyak warna. Dan aplikasi ini didesain dengan background yang menarik.
5.2 Saran
Agar aplikasi ini dapat lebih sempurna, ada beberapa saran dari penulis, diantaranya yaitu:
1. Aplikasi ini dapat terus dikembangkan lebih lanjut dalam hal pemilihan warna, kedepannya diharapkan untuk dapat menggunakan warna yang lebih banyak dan lebih spesifik.
2. Saat ini aplikasi simulasi gradasi warna ini masih pada sistem operasi Windows, harapannya semoga untuk kedepannya dapat dirancang ke dalam sistem operasi lain.
3. Penelitian ini masih dalam ruang lingkup yang terbatas. Peneliti berharap penelitian ini dapat dikembangkan lebih lanjut sehingga dapat memberikan kemudahan bagi pengguna aplikasi simulasi gradasi warna ini.
4. Peneliti berikutnya diharapkan dapat mengembangkan kembali aplikasi simulasi gradasi warna sehingga jauh lebih menarik dan bervariasi untuk digunakan.
Untuk kedepannya, bila sistem penentuan tingkat pembelajaran gradasi warna nantinya telah sempurna, maka sistem ini dapat digunakan di Taman Kanak-kanak, Pendidikan Anak Usia Dini, dan tempat pendidikan yang kiranya membutuhkan aplikasi multimedia interaktif simulasi gradasi warna ini.
Daftar Pustaka
[1] Fatah Sofyan, Amir dan Agus Purwanto. Digital Multimedia: Animasi, Sound Editing, & Video Editing.Yogyakarta: Andi. 2008.
[2] Hidayat, Tonny dan Amir Fatah Sofyan. Komputer Grafis: Image Editing, Desain Grafis dan Page Layout.Yogyakarta: Andi. 2008.
[3] Lukas Aditya. Perancangan Multimedia Interaktif Sebagai Media Pembelajaran Tentang Pengenalan Global Warning Sejak Usia Dini. Yogyakarta: Jurnal STMIK Amikom Yogyakarta. 2012.. [4] Manggiasih, Cynthia Larasati. Analisis dan
Pembuatan Simulasi Perubahan Zat Berbasis Multimedia Interaktif Mengunakan Adobe Flash. Yogyakarta: Jurnal STMIK Amikom. 2011. [5] Hilman, Muhammad Zidny. Pembuatan Aplikasi
Multimedia Tes Buta Warna Berbasis Computer Based Test Menggunakan Metode Ishihara. Yogyakarta: Jurnal STMIK Amikom. 2012.
[6] Manggiasih, Cynthia Larasati. Analisis dan Pembuatan Simulasi Perubahan Zat Berbasis Multimedia Interaktif Mengunakan Adobe Flash. Yogyakarta: Jurnal STMIK Amikom. 2011. [7] Suyanto, M. Multimedia sebagai Alat Untuk
meningkatkan keunggulan bersaing. Yogyakarta. 2003.
Biodata Penulis
Melati Ayuning Diaz, memperoleh gelar Sarjana
Komputer (S.Kom), Jurusan Teknik Informatika STMIK AMIKOM Yogyakarta, lulus tahun 2016.
Melwin Syafrizal, memperoleh gelar Sarjana Komputer (S.Kom), Jurusan Teknik Informasi STMIK AMIKOM Yogyakarta. Memperoleh gelar Master of Engineering (M.Eng) di Universitas Gajah Mada Yogyakarta.
