Modul 6 Macromedia Flash 8

Transkripsi

1 Laporan Praktikum Modul 6 Macromedia Flash 8 Mata kuliah : CF 1310 Pengantar Teknologi Informasi Disusun oleh : Nama Route Gemilang Semester Ganjil 2008/2009 Jurusan Sistem Informasi Fakultas Teknologi Informasi Institut Teknologi Sepuluh Nopember Surabaya

2 Laporan Pendahuluan Tugas Pendahuluan 6 mengenai Macromedia Flash 8 Laporan Praktikum adalah laporan yang dibuat setelah melakukan praktikum, laporan itu dibuat dalam bentuk file PDF, tujuan dibuatnya Laporan Praktikum adalah sebagai bahan evaluasi dan laporan kita setelah melakukan praktikum. Isi dari Laporan Praktikum sendiri adalah mengenai modul yang dipersentasikan oleh Tutor yang mendapatkan tugas untuk mempersentasikan. Tugas Pendahuluan 6 adalah Tugas yang diberikan kepada para Praktikkan sebelum melakukan praktikum. Tugas Pendahuluan 6 merupakan kelanjutan dari Tugas-tugas Pendahuluan sebelumnya, tetapi Tugas Pendahuluan 6 ini mengenai Macromedia Flash 8, soal-soal yang diberikan pun mengenai Macromedia Flash 8. Soal-soal itu diberikan dalam bentuk soft copy yang dapat dilihat di websi.its-sby.edu/elearning. Soal-soal Tugas Pendahuluan 6 adalah 1. Apa yang bisa anda hasilkan dengan menggunakan aplikasi Flash. Berikan referensi yang mendukung jawaban anda? 2. Jelaskan fungsi dari salah satu fasilitas Flash pada gambar ini? 3. Berikan penjelasan pada masing masing toolbar dibawah ini? 4. Berikan penjelasan mengenai : o Motion Tween o Motion Shape o Motion Guide o Scene o Masking o Action Script

3 Tujuan diberikannya soal-soal Tugas Pendahuluan ini adalah untuk memudahkan dalam memahami modul yang dibawakan oleh Tutor mengenai Macromedia Flash 8. Soalsoal ini dikumpulkan sehari sebelum melakukan Praktikum dan dikumpulkan dalam bentuk file PDF. Cara mengumpulkan Tugas Pendahuluan 6 ini dapat dikumpulkan dengan cara mengirimkan hasil Tugas Pendahuluan ke alamat para Asisten masing-masing kelompok atau dapat dikumpulkan langsung ke para Asistensi masing-masing dalam bentuk soft copy. Tutor yang mempersentasikan modul mengenai Macromedia Flash 8 ini adalah Tutor kelompok 6 dari masing-masing shift. Tutor kelompok 6 shift 1 mempersentasikan modul mengenai Macromedia Flash 8. Tutor kelompok 6 ini mempersentasikan mengenai modul Macromedia Flash 8 ini pada tanggal 2 Desember Persentasi dan Praktikum ini dilakukan di Lab Sistem Informasi Jurusan Sistem Informasi. Anggota dari Tutor kelompok 6 shift 1 sendiri adalah Chanif, Nila, Annisa, Wiga, Cherry, Ika, Lika, Yulia, Tata. Tutor kelompok 6 mempersentasikan modul mengenai Macromedia Flash 8 ini dengan bahan materi persentasi yaitu mengenai pengertian atau fungsi dari Macromedia Flash 8, Membuat Animation Motion Tween, Animation Motion Shape, Animation Motion Guide Materi yang dibawakan oleh Tutor kelompok 6 shift 1 Materi-materi yang dibawakan oleh Tutor kelompok 6 shift 1 ini mengenai Macromedia Flash 8, antara lain : 1. Pengertian Motion Tween Motion Tween adalah keadaan dimana kita dapat mengatur property seperti ukuran, posisi, dan rotasi untuk sebuah instance, grup atau text block dalam satu waktu.

4 2. Cara Membuat Motion Tween Langkah-langkah : a. Klik file > new b. Setelah muncul halaman utama. Kita dapat mengaturnya ukuran stagenya di properties. contoh: Keterangan : Width :550 px Heigth :400 px Bacground : #0000FF Frame Rate : 12 Ruler Units : pixels c. Pembuatan Obyeknya Pembuatan objek dapat dilakukan dengan mengklik Polysar Tool pada tool panel Pada properties inspector klik tombol option untuk menampilkan Tool Setting Lalu pada Style: star, number of sides: 5, Star point size: 0.00

5 Seperti gambar dibawah ini : d. Setelah selesai diatur Drag objek yang sudah ditentukan pada stage. Maka akan tampak seperti dibawah ini :

6 e. Selanjutnya klik kanan pada frame ke 40 lalu pilih Insert Frame f. Klik kanan pada salah satu Frame dari ke 40 Frame yang tadi. Lalu pilih Create Motion Tween. Maka dalam Frame akan terdapat garis putus-putus. Seperti gambar di bawah ini : g. Klik kanan pada Frame yang paling akhir, lau pilih Insert Keyframe. Maka timeline akan berubah seperti dibawah ini :

7 h. Pada saat Frame 40 pindahkan objek ke tempat lain misalnya disudut kanan bawah. Lalu klik menu Modify > Transform > Scale and Rotate. Kemudian atur scale dan rotate yang kita inginkan Pada Scale kita atur 150% dan pada rotate kita atur 90 degree. Lalu klik OK Untuk melihat hasil akhir dari apa yang kita buat cukup tekan Enter atau Ctrl+enter. Untuk melihat tampilan Browsernya tekan F12. tapi simpan terlebih dahulu file tersebut

8 3. Cara Membuat Motion Tween Efek Berputar Langkah-langkah : a. Membuat bentuk sembarang ( misal : kotak ) b. Meng-klik kanan frame 30 dan memilih Insert Frame Maka muncul tampilan seperti ini :

9 c. Meng-klik kanan pada frame 15, lalu pilih Create Motion Tween Terlihat garis putus-putus pada frame d. Meng-klik Kanan pada frame 30 dan memilih Insert KeyFrame

10 Terlihat tanda panah dari frame 1 sampai frame 30 e. Meng-klik kanan frame 15, pilih Insert Keyframe f. Membuka panel Properties g. Meng-klik Frame 1 untuk memilihnya pada Panel Properties, tentukan rotate = CCW untuk memilih berputar berlawanan dengan jarum jam. h. Menentukan Times = 3 untuk memutar objek 3 kali selama bergerak dari frame 1 sampai frame 15.

11 i. Meng-klik frame 15 untuk memilihnya j. Pada panel Properties, tentukan Rotate = CW untuk memutar objek searah jarum jam. k. Tentukan Times = 2 untuk memutar objek 2 kali selama bergerak dari frame 15 sampai frame 30. Menekan Enter untuk melihat hasilnya. 4. Pengertian Motion Shape Adalah Animasi yang digunakan untuk membuat animasi obyek yang dapat berubah bentuk dan juga mengubah tempat.

12 5. Cara Membuat Motion Shape Langkah-langkah : a. Pilih Oval Tool dan buat lingkaran pada frame ke 1 Timeline Layer 1 b. Pilih Rectangular Tool, buat lingkaran pada frame ke 25 Timeline Layer 1 dgn insert keyframe terlebih dahulu dan delete obyek oval yg sebelumnya.

13 c. Klik di sembarang frame antara frame Lalu mengubah tween pada properties menjadi shape. d. Perhatikan frame 1-25 pada timeline, muncul Arrow, background berwarna hijau muda (ciri motion shape) 6. Pengertian Motion Guide adalah animasi yang bergerak menyusuri sebuah lintasan atau alur.

14 7. Cara Membuat Motion Guide Langkah-langkah : Buat lembar kerja baru. Buat objek lingkaran pada lembar kerja. Klik kanan pada keyframe lalu pilih Create Motion Tween. Klik icon Add Motion Guide. Pilih panjang frame yang diinginkan kan lalu buat lintasan yang akan dilewati oleh objek. Pilih frame paling awal, lalu letakkan objek pada lintasan awal. Kemudian, tentukan pula letak objek pada lintasan akhir, dengan memilih frame yang paling akhir. Pilih frame paling awal, lalu letakkan objek pada lintasan awal. Kemudian, tentukan pula letak objek pada lintasan akhir, dengan memilih frame yang paling akhir.

15 8. Cara Membuat Symbol Button Langkah-langkah : Siapkan Lembar kerja baru Klik Insert F lalu New SymboL, sehingga muncul dialog box sebagai berikut : Ketikkan nama button yang akan dibuat, semisal HOME. Pada pilihan behavior, pilih Button, Akhiri dengan OK. Maka akan muncul tampilan sebagai berikut : Klik pada frame Up dan buat objek teks HOME dengan warna ungu tua. Selanjutnya, klik kanan pada frame over F Insert Keyframe, ubah warna teks. Klik kanan pada frame Down F Insert Key Frame, ubah warna teks. Klik kanan pada frame Hit F Insert Keyframe, ubah warna teks. Setelah selesai membuat tombol, klik Scene 1 untuk kembali ke lembar utama movie. Drag and Drop tombol Home yang telah kita buat, letakkan sesuai keinginan. Untuk preview, tekan tombol F12 pada keyboard 9. Cara Membuat Banner

16 Langkah-langkah : Membuka Macromedia Flash 8, kemudian pada panel Create new kita memilih flash document. Mengatur Panjang Lebar dari Stage, klik menu Modify à Document, ubah Dimensions menjadi width = 500px dan height = 150px (sesuai dengan ukuran gambar) dan background hitam (#000000). Membuat 2 layer, yaitu masked dan tulisan. Pada layer tulisan frame ke-1, membuat sebuah tulisan KOMUNITAS PECINTA WEB dengan warna putih di tengah stage, atur posisi sesuai dengan keinginan anda, kemudian pada frame ke-50 insertkan frame. Pada layer masked frame ke-1, membuat sebuah lingkaran berbentuk elips berwarna hitam, letakkan di samping kiri dari stage Pada layer masked frame ke-50, kita insertkan KeyFrame. Lalu mengubah posisi lingkaran elips ke samping kanan stage. Pada layer masked frame ke-1, Create Motion Tween.

17 Pada layer masked, klik kananà mask. Menjalankan movie dengan cara mengklik menu ColtrolàPlay (enter) untuk melihat jalannya frame. Atau dengan ColtrolàTest Movie (ctrl+enter) untuk melihat jalannya Movie pada Flash Player. Selain mempersentasikan Modul 6 Tutor kelompok 6 shift 1 juga memberikan soal Post Test, soal Post Test itu adalah Buatlah web menggunakan flash dengan ketentuan: o Font Verdana 10 o button berupa object (telah tersedia) o banner sesuai dengan contoh (banner.swf)

18

19

20 Penyelesaian : 1. Membuka Macromedia Flash klik start all program macromedia macromedia flash Pembuatan Website Pilihlah Flash document pada Create New pilih flash document pada General klik ok.

21 Aturlah Panjang dan Lebar dari Stage dengan cara meng-klik menu Modify Document, kemudian ubahlah Dimensions menjadi width = 550 px dan height = 400px dan background hitam (#000000) atau langsung dari kotak properties.

22 Pembuatan banner Pada pembuatan banner, kita akan membuat banner secara eksternal, yaitu pada dokumen flash yang lain. Buka dokumen flash baru, kemudian buatlah layer baru. Pada layer 1 ganti namanya menjadi banner dengan mengklik 2 kali pada layer name. Klik file import import to stage pilih image banner ok Kemudian akan muncul image banner, atur ukurannya dengan mengklik icon free transform tool. Klik kanan pada frame 40 layer banner insert keyframe Klik icon insert new layer ubah nama layer menjadi masking klik frame 1 pada layer masking klik icon oval tool buat lingkaran letakkan disamping kiri dari stage. klik kanan pada layer masking frame 40 insert keyframe ubah posisi lingkaran kesamping kanan stage klik kanan pada frame 8 layer masking create motion tween klik kanan pada layer masking mask. Untuk melihat hasilnya tekan CTRL+ENTER

23 Pembuatan halaman utama Pilih Flash Document dan klik. Kemudian muncul jendela Flash seperti berikut. Kembali ke soal post test, pada lembar kerja warna backgroundnya adalah hitam jadi beri warna background hitam dengan memilih warna Background dalam Properties. Sehingga warna background akan berubah seperti gambar di bawah.

24 Setelah itu kita akan men\mbuat tombol tombol dengan cara : Insert new layer rename menjadi home pilih menu insert new symbol pada kotak create new symbol ketik home pada name pilih button pada type ok. Lalu klik pada frame up pilih file import import to stage pilih image home ok Pada frame over klik kanan insert blank keyframe pilih file import import to stage pilih image home over ok Pada frame down klik kanan insert blank keyframe pilih file import

25 import to stage pilih image home down Klik scene drag button ok ke stage atur posisinya Lakukan langkah yang sama untuk membuat tombol tombol laiinya, seperti profile, archives, dll. Kliklah pada tombol home, kemudian pada menu actions ketikkan actions scrip On (press) { gotoandstop (1) } Ket. Angka 1 pada script diatas merupakan tempat dimana tombol tombol tersebut terletak pada time line Misal : 1 pada home, 10 pada profile, dst. Pada layer profil, forum, archive dan diary, lakukan hal yang sama seperti pada tombol home untuk mebuat link. Klik ctrl + enter. NB. Agar lebih mudah membedakannya, buatlah layer yang berbeda untuk setiap tombol, konten serta banner. Tulislah untuk konten masing-masing button dengan isi sebagai berikut:

26

27

28 Kendala-kendala dalam pengerjaan posttest adalah soal posttest terbilang cukup sulit dan terlalu banyak animasi yang harus dibuat sedangkan waktu yang disediakan masih kurang. Tutor kurang menyinggung masalah pembuatan website. Saran mungkin dapat dalam pembuatan soal post test jumlahnya soal seharusnya diperhitungkan dengan waktu yang diberikan untuk mengerjakan. Tapi selebihnya, Tutor sudah cukup baik, ini terbukti mempersentasikan sudah terorganisir. dalam pembagian tugas antar anggota dalam

29