Membuat CD Interaktif Menggunakan Macromedia Director Oleh: Duta Syailendra M.Ds
Konsep Design: Pada tutorial ini menu terdiri dari 2 tingkat
Membuat Menu Utama: Melalui aplikasi Adobe Photoshop buatlah sebuah lembar kerja baru dengan parameter sebagai berikut :
Pada lembar kerja tersebut lalu ciptakan sebuah desain layout untuk halaman utama/index dari media belajar interaktif ini. Pada tulisan ini penulis menggunakan desain layout sbb: (ada pada CD dengan nama: background-halaman-index.JPG)) background-halaman-index.JPG
Dengan menggunakan aplikasi Photoshop penulis juga melakukan pembuatan background untuk halaman level ke-dua
Selanjutnya setelah ke-empat background tersebut diselesaikan pada aplikasi digital imaging dan dibuat dalam format JPG maka untuk selanjutnya pekerjaan pembuatan media dalam Macromedia Director telah dapat kita mulai.
1
Mengenal Macromedia Director Macromedia Director adalah software aplikasi untuk merangkai komponen multimedia dan grafis, oleh sebab itu untuk dapat menghasilkan karya multimedia yang maksimal sebaiknya juga menguasai software animasi dan software digital imaging maupun software digital illustration Macromedia Director juga menyediakan fasilitas sederhana untuk pengolahan grafis, akan tetapi tidaklah selengkap sebagaimana yang ada pada aplikasi khusus pengolah grafis 1.
2.
Memulai Macromedia Director Klik Start All Programs Macromedia
Macromedia Director
akan tampil splash screen Macromedia Director MX dan tunggu beberapa saat hingga muncul
Kemudian klik pada Create File 3.
Akan muncul user interface berikut ini
Terlihat tampilan standard Macromedia Director yang standard, untuk merubah tampilan dapat dilakukan dengan cara sbb: klik menu Window Panel Sets Director 8 Maka akan tampil jendela baru seperti berikut ini
2
Berikut ini akan dijelaskan masing-masing unit interface yang ada pada Macromedia Director
Catatan: Sebelumnya agar file video atau animasi yang berformat AVI dapat diimport oleh aplikasi Macromedia Director maka terlebih dahulu harus diinstalkan codec Indeo Video5.10
1.
Buka Aplikasi Macromedia Director pada komputer
3
Buat lembar kerja baru dengan mengklik Create File pada bagian Create New
2.
Untuk mempermudah pekerjaan dengan tampilan ruang kerja yang mempermudah Anda dapat lakukan klik Window Panel Sets Director 8
3.
Atur ukuran dan warna PANEL SET Klik kanan pada bidang kosong s t a g e Pada panel Properties Inspector pada tab Movie atur parameternya menjadi sbb Stage Size: 1024 x 768 pixel dengan Color = hitam
4.
Selanjutnya mulai melakukan IMPORT data dengan cara Klik menu File Import Pada kotak dialog import pilih setiap file yang akan diimport tombol Import
klik tombol Add
klik
Berikutnya akan tampil dialog box
Pilih Color Depth dengan parameter Stage (24 bits) hal ini akan berguna untuk menghemat memory. Aktifkan juga Same Setting for Remaining Images agar dialog box ini tidak tampil berulang kali. Selanjutnya klik OK Selanjutnya akan tampil dialog box Select Format, karena beberapa file yang akan diimport berupa file animasi maka pilih file format Animated.Gif lalu klik OK
Apabila data yang diimport berhasil maka akan terlihat pada Cast Member
4
Dimana pada Cast Member inilah data yang akan dipakai/ditampilkan pada proyek movie Anda disimpan. Tampilan Cast Member dapat dirubah menjadi Thumbnail , untuk itu dapat dilakukan dengan mengklik pada Cast View Style yang ada dibawah Cast:Internal (tanda kotak merah) 5.
Setelah proses import data dilakukan, untuk selanjutnya tahapan yang dilakukan adalah penyusunan data, yang dimulai dengan menyusun background-halaman-index yang merupakan halaman menu utama.
Drag background-halaman-index.jpg dari Cast Member ke Score Dapat juga di drag ke Stage, lalu atur gambar menjadi persis ditengah layar
Penting...!!! Cast Member background-halaman-index yang telah dimasukkan kedalam S c o r e disebut SPRITE . Dimana sprite background-halaman-index menempati sprite chanel nomor 1, dan berdurasi 30 frame. 6.
Selanjutnya untuk membuat tombol Menu dapat dilakukan dengan menggunakan Pallete Too ls yang ada di sebelah kiri, akan tetapi untuk mempermudah penggunaan dalam membuat tombol sederhana terlebih dahulu ganti Tools Default menjadi Classic.
Pada Tools pilih/aktifkan Push Button pada Stage lakukan drag, sampai dengan ukuran tombol sesuai dengan keinginan, lalu ketikkan pula tulisan yang diinginkan
5
Untuk merubah teks pada tombol dapat dilakukan dengan cara menekan tombol ENTER pada keyboard – maka akan muncul panel Text Button pada jendela kerja Anda.
Anda dapat melakukan perubahan warna dengan terlebih dahulu menyoroti huruf lalu memilih warna yang ada pada palette colour pada Tools. Lakukan pembuatan tombol sebanyak tiga kali,
Apabila tampilan sprite pada score ketiga tombol tersebut telah masuk, yang ditandai dengan tampilan sebagaimana pada gambar berikut ini, maka pembuatan halaman menu utama telah selesai.
7.
Tahapan ini adalah tahapan pembuatan halaman-halaman sub menu, dimana pada project ini ada tiga halaman sub menu yang akan diselesaikan.
6
Penyusunan desain layout pada halaman sub-menu dilakukan dengan cara yang sama, yaitu; dengan mendrag background-menu-sejarah-batak.jpg ke s c o r e tepatnya pada Sprite 1 , mulai frame 31.
Drag background-menu-sub-etnik.jpg ke s c o r e tepatnya pada Sprite 1 , mulai frame 61, selanjutnya drag background-menu-potensi-SDA.jpg ke s c o r e tepatnya pada Sprite 1 , mulai frame 91.
8.
untuk menguji coba hasil kerja jalankan project dengan cara mengklik tombol Play pada Toolbar.
Pada stage terlihat halaman background-halaman-index.jpg berganti dan terus berganti ke halaman sub menu berikutnya secara berulang-ulang, hal ini tentu saja masih belum tepat, dimana yang diharapkan halaman akan berhenti pada setiap halaman. Untuk membuat demikian maka dalam hal ini dibutuhkan script /perintah. Untuk membuat perintah, dapat dilakukan dengan cara berikut ini: Double klik pada frame script 30 (tanda panah merah),
7
selanjutnya akan muncul jendela Script, selanjutnya ketikan go the frame (artinya: setelah melewati frame ini maka Playback Head diam ditempat atau stop).
Untuk melihat apakah script yang dibuat berhasil dapat dilakukan dengan menekan tombol Play pada Toolbar , apabila telah berhenti pada frame 30 maka script telah berhasil. Selanjutnya buat masing-masing script tersebut pada ketiga sub-menu tersebut.
9.
Setelah selesai memberikan script tersebut diatas, untuk selanjutnya hal yang perlu dilakukan adalah memberi perintah/script pada tombol SEJARAH BATAK. Klik kanan tombol tersebut Script.
Pada script tersebut isikan: go 31 Yang artinya jika tombol di klik maka p l a y b a c k h e a d menuju frame 31 dimana ada halaman background-menu-sejarah-batak.jpg. CATATAN: perintah go 31 dapat saja diganti menjadi go to frame atau go to 31
8
10. Selanjutnya akan dilakukan pembuatan Background transparant untuk image GIF Drag panah-kembali1.GIF ke Score sprite Channel 2 pada frame 31, sebagaimana pada gambar berikut ini
Pada stage aturlah posisi gambar animasi panah tersebut. Perhatikan bahwa ada bidang putih disekeliling gambar tombol panah tersebut tersebut, bidang putih tersebut adalah background pada saat membuat gambar animasi tombol panah tersebut pada aplikasi Adobe Image Ready . Untuk menghilangkannya; aktifkan panah-kembali1.GIF tersebut, pada Property Inspector pilih tab Sprite pilih Background Transparent
11. Pada project ini ketiga halaman sub-menu akan dilengkapi oleh tombol panahkembali1.GIF oleh sebab itu agar tidak melakukan pembuatan tombol dan perintah/script secara berulang kali, sebaiknya dilakukan dengan cara: menambah durasi/panjang sprite panah-kembali1.GIF dari frame 31 ke frame 120, caranya; drag ujung kanan sprite sampai ke frame 120. Atau dapat pula dengan menggunakan cara lain, yaitu pada Property Inspector masukkan angka 120 pada End.
9
Lakukan pembuatan tombol keluar dengan menggunakan tombol-X.SWF dengan menggunakan teknik yang sama pada point 10. Dan berikan perintah/script pada tombol tersebut dengan perintah halt
12. Setelah pekerjaan selesai tentu saja harus diakhiri dengan membuat file executable, dimana hal ini dapat dilakukan dengan langkah sebagi berikut; Klik menu File Save beri nama sesuka hati (misalnya duta) Setelah file kerja disimpan selanjutnya dari menu File Publish tunggu beberapa saat maka file hasil executable akan ditampilkan. 13. SELAMAT MENCOBA ...
10
