4.2.4. Pembuatan Assembly
Dalam pengembangan
Aplikasi materi
pelatihan berbasiskan Multimedia ini dibutuhkan spesifikasi perangkat keras
dan perangkat lunak, sebagai berikut: 1.
Spesifikasi Perangkat Keras Pengembangan Multimedia a.
Komputer Intel Pentium 4 dengan speed 3,06 Ghz berfungsi untuk memberikan proses kinerja, kreativitas
dan produktifitas yang lebih tinggi. b.
Hard disk 20 GB berfungsi untuk menyediakan tempat
bagi aplikasi perangkat lunak dan menyediakan tempat penyimpanan untuk keperluan aplikasi yang akan
dibuat. c.
Memory minimal 256
MB berfungsi
untuk mempercepat proses publish movie dan rendering
gambar, sekaligus sebagai tempat penyimpanan sementara perangkat lunak dan data.
d. Sound Card
berfungsi untuk memproses suara pada aplikasi ini.
e. Graphic Card
128 MB berfungsi untuk mempercepat proses penampilan gambar pada layar.
f. Mouse
berfungsi sebagai alat interaksi pengguna aplikasi ini sekaligus sebagai alat interaksi yang
penting pada pembuatan aplikasi.
90
g. Keyboard
berfungsi sebagai unit input data guna pengembangan aplikasi.
h. Active Speaker
berfungsi sebagai unit output suara untuk mendengarkan suara yang ada pada aplikasi.
i. Monitor
15 inci berfungsi sebagai unit keluaran yang dapat menampilkan tampilan aplikasi dan secara
otomatis sebagai interface antar muka. 2.
Spesifikasi Perangkat Lunak Pengembangan Multimedia a.
Macromedia Director MX 2004 sebagai software
programming dengan sentuhan grafis yang mampu
mengimpor dan mengendalikan banyak format. Macromedia Director MX 2004
ini berfungsi sebagai perangkat
lunak pengembangan utama yang mengintegritaskan elemen-elemen yang telah
dipersiapkan dari berbagai aplikasi lainnya.
Gambar 4.30. Proses penggabungan seluruh elemen Multimedia menggunakan Macromedia Director MX 2004
91
b. Macromedia Flash MX 2004
sebagai program standar profesional yang digunakan untuk membuat
animasi interaktif, juga animasi tombol yang diperlukan dalam aplikasi ini.
Gambar 4.31. Proses pembuatan gambaran umum menggunakan Macromedia Director MX 2004
c. Adobe Photoshop CS
untuk mendesain background tampilan pada setiap halaman, mendesain tombol
serta tulisan yang berfungsi sebagai judul pada setiap menu dan sub menunya.
d.
Gambar 4.32. Proses pembuatan background menggunakan Adobe Photoshop CS
92
e. Macromedia Fireworks MX 2004
untuk mendesain tampilan background pada menu yang terdapat pada
halaman intro dan menu lainnya.
Gambar 4.33. Proses pembuatan menu menggunakan Macromedia Fireworks MX 2004
f. Ulead Video Studio 10
untuk mengedit video, memotong adegan video, memberi suara tambahan
pada video, mengedit suara dan merubah format video.
Gambar 4.34. Proses pengeditan video madrasah menggunakan Ulead Video Studio 10
93
Langkah selanjutnya
setelah semua
spesifikasi pengembangan dapat dipenuhi, maka penulis mulai mengerjakan
tahapan-tahapan aplikasi pembuatan
dengan menggunakan
perangkat lunak yang telah disiapkan. Terdapat beberapa tahapan penting selama pengembangan rancangan materi pelatihan
berbasiskan multimedia yang akan penulis jelaskan sebagai berikut.
Langkah awal yang dilakukan penulis adalah mendesain tampilan halaman Intro. Tampilan halaman intro yang penulis buat
sangatlah sederhana yaitu mendesain kegiatan Madrasah sebagai menu pembuka dari aplikasi yang dibuat dengan menggunakan
animasi masking. Kemudian penulis membuat teks selamat datang di aplikasi multimedia computer based training dibawahnya agar
terlihat tidak terlalu sepi dengan menggunakan animasi masking juga. Penulis animasikan dengan menggunakan Macromedia Flash
MX 2004 dan disimpan dengan format file .swf.
Gambar 4.35. Tampilan halaman intro menggunakan masking
94
Langkah selanjutnya adalah mendesain tampilan menu, tombol, sub menu, gambar kantor departemen agama, gambar nada
suara, animasi-animasi lainnya dan tampilan pada setiap halaman, penulis membuatnya dengan menggunakan Software Macromedia
Fireworks MX 2004 dan Adobe Photoshop CS. File-file tersebut
penulis buat dengan berbagai bentuk dan menggunakan efek tertentu seperti layer style drop shadow, inner shadow, outer glow,
color overlay, gradient overlay , dan efek lainnya agar terlihat
menarik dan disimpan dengan format file .png dan .psd. Kemudian file tersebut penulis animasikan agar terlihat lebih dinamis dan
menarik dengan menggunakan Macromedia Flash MX 2004 dan disimpan dengan format file .swf.
Gambar 4.36. Tampilan header teks menggunakan masking
File yang sudah tersedia tadi kemudian disusun serapih mungkin agar menghasilkan tampilan yang menarik dan sesuai
dengan yang diinginkan. Fasilitas pengatur suara atau musik
95
background sengaja penulis berikan pada Menu Pembuka dan
Menu Utama saja. Untuk menu lainnya sengaja tidak penulis berikan pengatur suara, hal ini dimaksudkan karena selain menu
pembuka dan menu utama, menu lainnya sudah menggunakan efek suara dari teks dan yang lainnya.
Langkah berikutnya setelah semua elemen aplikasi tersedia, maka tahapan terakhir adalah penggabungan semua elemen yang
sudah tersedia. Penulis menggunakan software Macromedia Director MX 2004
untuk tahap akhir penyelesaian aplikasi ini. Aplikasi
rancangan materi pelatihan dibuat menjadi beberapa file terpisah dengan tujuan agar file-file yang ada di
dalamnya tidak membingungkan jika terjadi kesalahan ketika dilakukan pengeditan. Pada perangkat ini penulis membuat animasi
dengan menggunakan dimensi 800x600 pixels dengan framerate sebesar 25 fps dan aplikasi dibagi menjadi 8 delapan file yang
terpisah yaitu : Intro.dir, Menu_Utama.dir, Profil.dir, Materi.dir, Rekap.dir, Galeri.dir, Kontak.dir, dan TerimaKasih.dir. Untuk
menggabungkan 8 halaman tersebut penulis menggunakan script Lingo
yang berguna untuk mengatur, menjalankan, dan menampilkan aplikasi sesuai dengan rancangan, ditambah efek
transisi seperti DMXT Pixelate untuk menu utama, dan transisi DMXT Riple Fade
untuk menu Profil, Materi, Rekapn dan Galeri. Tujuan menggunakan efek transisi tersebut adalah agar aplikasi ini
96
terlihat menarik, tidak membosankan dan terlihat perbedaan saat pengguna berpindah dari halaman satu ke halaman lain.
Untuk keterangan lebih jelas tentang proses pembuatan dan pengeditan setiap menu yang terdapat pada aplikasi ini, maka
penulis mencoba menguraikan menu satu per satu yaitu : 1. Intro.dir
Pada halaman intro terdapat desain tampilan sederhana dengan proses masking terlebih dahulu yaitu dengan
mendesain kegiatan siswa siswi dalam proses kegiatan belajar mengajar berupa teks yang kemudian dilakukan
pengeditan dan penggabungan gambar. File teks diperoleh dengan membuat sendiri menggunakan
software Macromedia Flash MX 2004, serta file gambar diperoleh dari Madrasah Pendidikan Agama Kabupaten
Tangerang. Kemudian teks dan gambar tersebut dianimasikan dengan menggunakan teknik masking
sebagai menu pembuka dari aplikasi. Pada menu intro ini penulis menggunakan framerate sebesar 25 fps,
frame awal dimulai dari frame 1 dan berakhir pada frame 331, rotation 0.00 dan background color hitam.
Pada menu Intro terdapat dua pilihan button yaitu button
Menu Utama dan button Keluar.
97
Gambar 4.37. Layer pada menu intro
2. Menu_Utama.dir Pada Menu Utama terdapat animasi teks pada header,
animasi button, animasi logo, dan animasi garis pada menu. Untuk animasi teks pada header dibuat dengan
menggunakan teknik motion tween. Judul merupakan salah satu simbol dari animasi header yang memiliki
jumlah frame 60 dan 4 layer.
Gambar 4.38. Teknik masking pada pembuatan animasi logo
Animasi teks judul dibuat dengan menggunakan teknik masking
dan animasi garis dibuat dengan menggunakan teknik motion tween. Untuk animasi garis memiliki 3
layer dengan jumlah frame 50 dengan menggunakan
Software Macromedia Flash MX 2004 .
98
Gambar 4.39. Timeline dari animasi garis
Pembuatan button menggunakan dua warna. Penulis memilih warna hijau dan kuning agar terlihat serasi
dengan tampilan menu dan menggunakan animasi motion tween
yang memiliki 1 layer, dan 10 frame.
Gambar 4.40. Timeline dari animasi button
Pada Menu Utama ini terdapat teks yang mewakili judul dari aplikasi yang dibuat menggunakan teknik motion
tween . Untuk menu Utama, penulis menggunakan
musik latar
dengan memberikan
judul Musik_Tmplte.mp3
yang diperoleh dari browsing di internet dan membuat pengontrolan musik latar dengan
99
memilih parameters sound for channel volume slider dan mengisinya dengan memasukkan nilai 16 pada
menu contraining sprite dan mengisi initial sound volume
dengan angka 150.
Gambar 4.41. Parameters pengontrolan musik latar
Agar tampilan tidak membosankan, maka penulis menggunakan efek transisi, pada menu ini efek transisi
yang digunakan yaitu DMXT Pixelate Bentuk Pixel. Pada aplikasi ini jumlah durasi lamanya efek transisi
menggunakan default rata-rata, yaitu 2 detik. 3. Profil.dir
Pada menu Profil terdapat animasi teks pada menu Gambaran Umum. Background pada teks gambaran
umum menggunakan teknik motion tween dan animasi yang digunakan adalah teknik membesarkan setiap
huruf pada sebuah teks kemudian mengecilkannya kembali dengan ukuran semula. Dengan cara membuat
teks dengan font Cooper Black ukuran 30. Kemudian pilih menu modify - break apart. Setelah itu, pilih
menu modify - timeline - distribute to layers. Untuk
100
animasi gambaran umum memiliki 15 layer dengan jumlah frame 170 dengan menggunakan Software
Macromedia Flash MX 2004 .
Gambar 4.42. Timeline dari animasi gambaran umum
4. Materi.dir Pada menu ini terdapat 5 lima pilihan button menu
yaitu menu introduction, tugas dan tanggung jawab, lingkup kerja, monitoring dan pelaporan, dan floew
proses. Pada menu introduction terdapat penjelasan mengenai latar belakang dan tujuan. Sedangkan pada
menu tugas dan tanggung jawab terdapat animasi tingkatan sekolah yang dibuat dengan menggunakan
macromedia flash dengan cara menyiapkan 5 lima
layer untuk masing-masing gambar yang diperlukan dengan jumlah frame 25.
Gambar 4.43. Timeline dari animasi tingkatan sekolah
101
5. Rekap.dir Pada menu Rekap terdapat 4 empat grafik tentang
jumlah madrasah, pengajar dan siswa. Grafik tersebut dibuat dengan menggunakan microsoft office excel dan
mengisinya dengan nilai yang sudah disiapkan. Sedangkan untuk animasi siswa menggunakan teknik
motion tween dengan cara drag gambar ke stage, kemudian pilih modify pilih convert to symbol dan pilih
movie clip, pilih sampai frame 180 kemudian klik kanan pada frame terakhir lalu pilih insert keyframe.
Pada layer akhir tarik gambar sehingga terlihat animasi membesar. Animasi ini terdapat 2 layer dengan jumlah
frame 180 dengan menggunakan Software Macromedia Flash MX 2004.
Gambar 4.44. Timeline dari animasi grafik
Untuk penjelasan tentang jumlah madrasah, pengajar dan siswa seKabupaten Tangerang tahun pelajaran
20062007 sampai 20092010, penulis menggunakan teknik masking. Untuk animasi teks tentang penjelasan
rekap tersebut memiliki 2 layer. Layer pertama untuk gambar jumlah madrasah, sedangkan untuk layer kedua
102
untuk lingkaran dengan memilih modify kemudian pilih convert to symbol. Pada layer lingkaran pilih mask dan
animasikan lingkaran tersebut dari kecil sampai besar. Sehingga teks gambar tersebut muncul seperti bentuk
lingkaran dengan
jumlah frame
30 dengan
menggunakan Software Macromedia Flash MX 2004. 6. Galeri.dir
Untuk menu Galeri terdapat 2 dua pilihan menu. Terdapat menu Gambar dan Video. Pada menu Gambar,
terdapat animasi motion tween. Animasi untuk galeri dibuat dengan menggunakan Software Macromedia
Flash MX 2004 dan memiliki 3 layer dengan jumlah
frame 40.
Gambar 4.45. Timeline dari animasi gambar Depag
Pada menu video, pengeditan dilakukan dengan menggunakan SoftwareUlead Video studio 10 dan
melakukan pengeditan dengan mengecilkan efek volume suara dengan cara klik pada attribute audio
kemudian drag kebawah dan kecilkan.
103
Gambar 4.46. Proses pengeditan suara dengan mengganti suara asli
Untuk memperindah tampilan agar tidak membosankan, maka penulis menggunakan efek transisi, pada menu ini
efek transisi yang digunakan yaitu DMXT Ripple Fade Riak Air. Pada aplikasi ini jumlah durasi lamanya
efek transisi menggunakan default rata-rata, yaitu 2 dua detik dengan jumlah frame sebanyak 45.
Gambar 4.47. Jumlah frame pada aplikasi yang dibuat
104
7. Kontak.dir Pada menu Kontak terdapat keterangan tentang biodata
penulis. Untuk animasi gambar menggunakan teknik motion tween
dengan 1 layer dan jumlah frame sebanyak 20.
Gambar 4.48. Timeline dari animasi gambar penulis
Untuk animasi teks tentang penjelasan biodata penulis menggunakan teknik motion tween. Sedangkan animasi
nama menggunakan teknik masking. Untuk animasi nama memiliki 3 layer dan jumlah frame sebanyak 70.
Gambar 4.49. Timeline dari animasi nama penulis
8. Terima Kasih.dir Menu Terima Kasih adalah tahap akhir dari tampilan
aplikasi yang dibuat dan berisi ucapan terima kasih kepada semua pihak yang telah membantu dalam proses
pembuatan skripsi ini. Untuk animasi ucapan terima kasih ini menggunakan latar musik yang berjudul Give
105
Thank’s to Allah dan menggunakan teknik motion
tween dengan 3 layer dan jumlah frame sebanyak 400.
Gambar 4.50. Timeline dari animasi terima kasih
Untuk menggabungkan 8 halaman tersebut penulis menggunakan script Lingo yang berguna untuk
mengatur, menjalankan, dan menampilkan aplikasi sesuai dengan rancangan yang telah dibuat. Tujuannya
adalah untuk mempermudah memanggil setiap menu yang sudah disiapkan ketika kita akan memilih button
menu yang kita inginkan.
Gambar 4.51. Script Lingo untuk masuk ke Menu Utama
106
4.2.5. Tes Testing
Kategori