laporan hasil praktikum bab vi.docx

8/11/2019 LAPORAN HASIL PRAKTIKUM BAB VI.docx

1/25

LAPORAN AKHIR PRAKTIKUM

MULTIMEDIA

NAMA : HANNA DARMAWAN

NIM : DBC 110 025

KELAS : Kamis, 15.00 WIB

MODUL : VI (Tombol dan Animasi Flash)

JURUSAN/PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS PALANGKA RAYA

2013


2/25

BAB I

TUJUAN DAN LANDASAN TEORI

A.Tujuan

Setelah menyelesaikan modul ini, mahasiswa diharapkan mampu membuat

tombol dan menggunakannya untuk interaksi.

B.Landasan Teori

Flash merupakan alat bantu untuk desain dan animasi. Tetapi penggunaan

aplikasi ini belum dapat maksimal jika belum menyertakan elemen interaksi. Pada

modul sebelumnya script telah dibuat untuk mencegah terjadinya perulangan

animasi. Pada modul ini akan dibuat buttons dan ActionScript sehingga pengguna

dapat mengontrol aplikasinya.

Cara yang paling gampang untuk menambahkan interaksi pada Flash

adalah dengan menggunakan tombol untuk menjalankan ActionScript. Pada

modul ini akan lebih dikhususkan pada penggunaan tombol. Berikut ini

merupakan hal-hal yang perlu diketahui dalam mengerjakan tombol danActionScript.

1. Tombol sebagai Symbol

Tombol merupakan bentuk representasi dari banyak, tetapi ada dua hal

penting yang membedakannya. Perbedaannya adalah secara default tombol tidak

memiliki timeline yang penuh pada grafik atau klip movie. Malahan, tombol

memiliki empat frame terpisah yang akan menempatkan pada keadanan/statesberbagai macam tombol (penampilan default dari tombol, pada saat mouse

melewati tombol dan di klik).

Perbedaan kedua adalah tombol secara otomatis mengubah penampilannya

pada saat berinteraksi dengan pengguna sehingga state-nya berubah juga.

Walaupun tombol harus deprogram dengan ActionScript untuk memberikan effect

pada movie,statetombol dan cursor feedback di atur untuk pengguna.


3/25

Ketika melihat didalam symbol tombol, timeline muncul secara unik

karena terdiri dari empat frame yang telah ditentukan. Ketiga frame yang pertama

adalahstatetombol. State Up merepresentasikan penampilan tombol ketika cursor

mouse tidak melewati tombol, state Over ditampilkan ketika mouse berada pada

tombol, dan state Down ditampilkan ketika pengguna mengklik pada tombol.

State keempat merupakan state pada saat ditekan.

Mengenal Simbol dan Library

Simbol adalah objek flashSetiap symbol yang kita buat akan masuk ke

dalam library. Untuk mengubah sebuah objek menjadi symbol dapat kita lakukan

dengan menyeleksi objek tersebut menggunakan Selection toolkemudian masuk

menu Insert pilih Convert to Symbol atau dengan menekan tombol F8 pada

Keyboard, maka akan muncul tampilan dengan pilihan sebagai berikut :

1. Name untuk member nama symbol tersebut yang nantinya akan dicantumkan

dalam Library.

2. Typeadalah sifat atau fungsi dari symbol

3. Movie Clip adalah jenis symbol yang diperlukan untuk membuat objek

animasi yang memiliki multiframe sendiri sebagai Timelinenya. Jadi symbol

yang dihasilkannya bias dimainkan secara terpisah dari movie utama

4. Grafik adalah jenis symbol yang digunakan untuk membuat objek statis.

5. Button adalah jenis symbol yang untuk membuat tombol interaktif yang

berfungsi untuk merespon mouse ketika diklik, melewati objek atau yang

lainnya.

6. Registrationberfungsi untuk menentukan pusat atau titik putar objek.

Library digunakan untuk menampilkan objek-objek yang kita import dari

luar lingkungan Flash 8 maupun objek-objek bawaan dari Flash 8 itupun sendiri.

Untuk menggunakannya Anda dapat menekan tombol F11 pada keyboard atau

dari menu Window pilih Library. Selain library terdapat juga common library

yang merupakan library bawaan flash yang di dalamnya terdapat beberapa tombol,

movie maupun suara yang dapat kita gunakan.


4/25

2. Navigasi dan Script

Setelah dapat membuat tombol maka langkah berikutnya adalah

memberikan script pada tombol yang telah dibuat. Flash akan menangani visual

feedback, termasuk cursor dan perubahan state, tetapi tombol belum operasional.

Untuk membuatnya menjadi operasional maka dapat dibuat dengan menggunakan

bantuan script.

Navigasi dilakukan dengan menggunakan script. Kemampuan dasar untuk

menghubungkan satu halaman lain dilakukan dengan menggunakan script. Pada

aplikasi Flash, kemampuan user untuk menavigasikan sekumpulan frame

sangatlah mendasar dan penting. Tanpa kemampuan untuk pergi ke frame tertentu

pembuatan aplikasi hanyalah menjadi satu alur saja. Dengan adanya navigasi

maka dapat menuju ke bagian pada suatu movie sehingga dapat menampilkan

berbagai macam objek yang berbeda pada tiap navigasi. Tabel dibawah ini

merupakan script-script dasar yang diperlukan untuk mengerjakan modul ini.

Action ActionScript notation Ar guments

gotoAndStop gotoAndStop(arguments); Scene Name (Frame Label,

Number, or Expression)

gotoAndPlay gotoAndPlay(arguments); Scene Name (Frame Label,

Number, or Expression)

nextFrame nextFrame(); None

prevFrame prevFrame(); None

nextScene nextScene(); None

prevScene prevScene(); None

paly play(); None

stop stop(); None


5/25

stopAllSounds stopAllSounds(); None

getURL getURL(arguments); url, target frame or window,

method for from submission

ActionScript pada frame

ActionScript pada frame adalah Actionscript yang diletakan pada frame, atau juga

sering disebut FrameScript. FrameScript ini hanya bisa dilakukan pada keyframe

atau blankkeyframe.untuk melihat frame yang telah diberikan script terdapat tanda

berupahurup a kecil yang menandakan keberadaan sebuah Script.

ActionScript pada MovieClip

ActionScript yang diletakan pada MovieClip sering disebut MovieScript. yang

harus diingat adalah untuk membuat movieScript tentunya harus ada MovieClip

tempat kita meletakan ActionScript tersebut. MovieClip memiliki bahasa (syntax)

sebagai berikut.

onClipEvent (event) {perintah

}

Arti syntax movieScript diatas adalah :

- Kata onClipEvent menunjukan bahwa perintah ini ditujukan untuk

MovieCliptempat diletakannya Script.

- kata event menunjukan event yang terjadi pada movieClip

tersebut.sebenarnya Event di MovieClip ada 9 diantaranya :load,


6/25

enterFrame, unload, Mouse up, Mouse Down,Key down, Key up, dan

data.Namun diantara semua itu yang sering digunakan yaitu load dan enter

Frame.

-

Kata perintah menunjukan perintah yang dapat diberikan pada

MovieClip.

ActionScript pada Button

Hal yang perlu diingat yaitu ActionScript pada button tentunya harus ada Button

tempat meletakanActionScript tersebut.Secara umum syntax yang digunakan

dalam penulisan ActionScript pada Button hampir sama dengan penulisan

MovieScript.Perhatikan syntax berikut ini ;

on (event) {

perintah

}

Arti syntax movieScript diatas adalah :

-

Kata on menunjukan bahwa perintah ini ditujukan untuk MovieClip

tempat diletakannya scriptdan ini merupakan syarat utama untuk Script

yang digunakan pada Button.

-

Kata event menunjukan event yang terjadi pada Button tersebut. ada 7

event yang terdapat pada buttonyaitu press, release, rollOver, rollOut,

dragOver, dragOut, dan keypress. Meski demikian hanya dua event yang

sering digunakan yaitu pressdan release.


7/25

BAB II

LANGKAH KERJA

I.

Langkah Kerja

1. Membuka flash dan memuat dokumen dlash baru yang digunakan untuk

animasi yang akan dibuat

2. Membuat animasi sesuai yang ada di modul VI tentang Tombol dan Interaksi

Flash, mengikuti tahap dari awal sampe akhir.

3. Setelah melakukan pembuatan Interaksi mengikuti langkah kerja, maka kita

akan mengerjakan tugas sesuai yang diminta pada modul VI.

4. Assiten praktikum akan memeriksa flash dan menilai hasil praktikum.


8/25

BAB III

PEMBAHASAN

Pada modul VI (Tombol dan Animasi) ini akan dibuat 4 tombol, yaitu

tombol Profil, Galeri Foto, Replay, dan Exit. Animasi ini memiliki dua halaman

yaitu halaman profil dan galeri foto dimana tiap halaman akan di inputkan foto

dan keterangan di tiap halamannya. Adapun pembahasan dari tugas ini adalah

sebagai berikut :

1.

PembuatanProjectBaru

Gambar 3.1ProjectBaru

Setelah kita memilih dokumen flash, kemudian kita akan melakukan

pengaturan padaframeratemenjadi 8 fbs. Seperti gambar dibawah ini:


9/25

Penjelasan :

Gambar diatas merupakan persiapan dalam pembuatan animasi dengan

pengaturanframe rate menjadi 8 fbs.

2. Membuat Tulisan Pembuka

Berikut merupakan pembuatan tulisan pembukaan, yaitu Selamat Datang

yang kemudian diberikan effectmasking.

Penjelasan :

Gambar diatas merupakan tulisan yang buat dengan menggunakan Text Tools,

dengan nama pada layer adalah selamat datang.

Selamat atang


10/25

3. Pemberian Effect Pada Tulisan/Text

EffectAlpha

Penjelasan :

Gambar diatas merupakan langkah dalam memberikan effectpada tulisan Selamat

Datang, yaitu effect Alpha kemudian nilainya di atur menjadi 8%.

EffectMasking

Selamat atang

Selamat atang


11/25

Penjelasan :

Gambar diatas merupakan langkah pemberian effect maskingpada tulisan dengan

cara membuat layerbaru > klik kanan > pilih mask, kemudian masukan 1 buah

lingkaran di letakkan didepan dan diakhir tulisan.

Pada langkah pemberian effect masking diatas, maka proses pembuatan tulisan

pembuka dengan kalimat Selamat Datang telah selesai, dan dilteruskan pada

langkah selajutnya.

4.

Membuat Tombol

TombolProfile

Penjelasan :

Gambar diatas merupakan langkah pertama membuat tombol profiledengan cara

insert > new Symbol atau dengan menekan tombol keyboard, yaitu CTRL+F8,

kemudian muncul 3 pilihan untuk tipesymbol, yaitu button, movieclipdangrapic,

dan dari ketiga pilihan tersebut maka pilih button.


12/25

Penjelasan :

Gambar diatas merupakan langkah keduadalam membuat tombol profile. Dapat

dilihat pada bagian atas projek terdapat pilihan UP dan Over yang digunakan

untuk mengubah warna kotak ketika akan ditekan. Kemudian masukan text

dengan kalimat Profile pada Kotak untuk menandakan bahwa kotak tersebut

adalah tombolprofile.

Profile

Profile


13/25

Penjelasan :

Gambar diatas adalah hasil akhir dari pembuatan tombol profile dengan

menggunakan scene, sehingga tombol akan muncul pada library, kemudian didragke layerseperti gambar diatas. Fungsi dari tombol profiledigunakan untuk

menampilkan data diri seperti nama, nim dan lain-lain.

Tombol Galeri

Penjelasan :

Gambar diatas merupakan langkah pertama dalam membuat tombol Galeri dimana

langkah-langkahnya sama seperti membuat tombolprofile.

Galeri


14/25

Penjelasan :

Gambar diatas merupakan langkah kedua dalam pembuatan tombol Galeri yang

diberikan effect untuk mengubah warna kotak ketika akan ditekan denganbeberapa pilihan, yaitu UP dan Over. Kemudian masukan text dengan kalimat

Galeri pada Kotak dengan menggunakan Text Tools untuk menandakan bahwa

tombol tersebut adalah tombol Galeri.

Penjelasan :

Gambar diatas adalah hasil akhir dari pembuatan tombol Galeri dengan

menggunakan scene, sehingga tombol akan muncul pada library, kemudian di

drag ke layer seperti gambar diatas. Fungsi dari tombol Galeri untuk

menampilkan sekumpulan gambar-gambar atau foto-foto.

TombolReplay

ProfileGaleri


15/25

Penjelasan :

Gambar diatas merupakan langkah pertama dalam membuat tombol Replay

dimana langkah-langkahnya sama seperti membuat tombolprofile dan Galeri.

Penjelasan :

Gambar diatas merupakan langkah keduadalam pembuatan tombol Replayyang

diberikan effect untuk mengubah warna kotak ketika akan ditekan dengan

beberapa pilihan, yaitu UP dan Over. Kemudian masukan text dengan kalimat

Replay pada Kotak dengan menggunakan Text Tools untuk menandakan bahwa

tombol tersebut adalah tombolReplay.

Replay


16/25

Penjelasan :

Gambar diatas adalah hasil akhir dari pembuatan tombol Replay dengan


drag ke layer seperti gambar diatas. Fungsi dari tombol Replay untuk

mengembalikan animasi tampilan awal pembuka.

TombolExit

Penjelasan :

Gambar diatas merupakan langkah pertama dalam membuat tombol Exit dimana

langkah-langkahnya sama seperti membuat beberapa tombol sebelumnya.

ProfileGaleri

Replay


17/25

Penjelasan :

Gambar diatas merupakan langkah kedua dalam pembuatan tombol Exit yang

diberikan effect untuk mengubah warna kotak ketika akan ditekan dengan

beberapa pilihan, yaitu UP dan Over. Kemudian masukan text dengan kalimat

Exit pada Kotak dengan menggunakan Text Tools untuk menandakan bahwa

tombol tersebut adalah tombolExit.

Penjelasan :

Gambar diatas adalah hasil akhir dari pembuatan tombol Exit dengan


dragke layerseperti gambar diatas. Fungsi dari tombol Exituntuk menampilkan

tampilan akhir dari animasi.

Replay

ProfileGaleri

ReplayExit


18/25

5. Membuat Tampilan

Setelah selesai membuat tombol-tombol pada langkah diatas, maka langkah

selanjutnya adalah membuat tampilan dalam masing-masing tombol.

Background Profile dan Galeri

Penjelasan :

Gambar diatas merupakan tampilan background dari tampilan tombolprofile, dan

Galeri yang telah dibuat tadi.

Isi Dari TampilanProfile, Galeri, danExit

Penjelasan :

Gambar diatas merupakan tampilan dari Profile dengan meng-insert-kan

keyframe, kemudian memberikan keterangan data diri dan foto.


19/25

Penjelasan :

Gambar diatas merupakan tampilan dari Profile dengan meng-insert-kan

keyframe, kemudian memberikan beberapa foto untuk mengisi tampilan dari

Galeri.


20/25

Penjelasan :

Gambar diatas merupakan tampilan dari Exit dengan meng-insert-kan keyframe,

kemudian memberikan text dengan kalimat Sekian Dan Terima Kasih untuk

menandakan akhir dari animasi.

6.

MemberiAction Script

Setelah selesai membuat tampilan pada langkah diatas, maka langkah

selanjutnya adalah actionscript untuk merelasikan atau melakukanpage linkantar

tombol 1 dengan tombol yang lainnya. Pada actionscriptyang digunakan adalah

on(release),gotoplay,and gotostop. Berikut pemberian script pada setiap tombol :

Profile

Untuk memasukkan actionscript bisa dilakukan dengan menekan tombol pada

keyboard, yaitu F9. Untuk memasukkan actionscript maka tombol harus aktif

terlebih dahulu dengan cara memilih tombol. Setelah tombol aktif, maka

dilakukan penulisanscript, yaitu :

scripton(Release) {

_root.gotoAndStop(36)} on

Penjelasan :

Script diatas digunakan untuk mengaktifkan tombol ketika diklik, lalu

gotoAndStop digunakan untuk pergi ke frame selanjutnya dan berhenti,

sedangkan (36) adalah urutan frame ke sekian pada profile, berikut penulisan

script-nya:

.

Galeri






21/25

scripton(Release) {


Penjelasan:



sedangkan (37) adalah urutan frame ke sekian pada Galeri, berikut penulisan

script-nya:

Replay





scripton(Release) {

_root.gotoAndPlay(1)} on

Penjelasan:


gotoAndPlaydigunakan untuk pergi ke frame selanjutnya dan memulai kembali

dari awal, sedangkan (1) adalah urutan frame ke sekian pada Replay, berikutpenulisanscript-nya:


22/25

Exit





scripton(Release) {


Penjelasan:



sedangkan (38)adalah urutanframeke sekian padaExit, berikut penulisanscript-

nya:

Setelah pemberian Action Script yang dilakukan diatas, maka dilakukan testing

dengan menekan Ctrl + Enterapakahsripct yang dituliskan tadi berjalan dengan

benar.


23/25

BAB IV

KESIMPULAN

Dari hasil pembuatan projek praktikum modul VI diatas, maka dapat disimpulkan

sebagai berikut :

Flash dimulai sebagai alat bantu untuk desain dan animasi, tetapi penggunaan

aplikasi ini belum dapat maksimal jika belum menyertakan elemen interaksi.

Cara yang paling gampang untuk menambahkan interaksi pada Flash adalah

dengan menggunakan tombol untuk menjalankan ActionScript.

Brightnessuntuk mengubah kecerahan warna Tintmengubah warna

Alphamembuat transparan

Advancedkombinasi dari ketiga pilihan.

Shared library adalah library yang dapat digunakan bersama-sama oleh movie.

Common Libraries adalah Library yang sudah ada dan disediakan oleh flash

untuk diguanakan, sehingga tidak perlu membuatnya lagi

Movie Clipsymbol yang menggambarkan animasi objek Buttonsymbol yang menggambarkan button yang digunakan untuk interaksi

dengan sesuatu.

Graphicsymbol yang menggambarkan object lain.


24/25

BAB V

DAFTAR PUSTAKA

Tim Dosen Multimedia, Modul Praktikum Multimedia, Teknik Informatika

Universitas Palangka Raya, 2013.

cbs-bogor.net/ebooklain/.../Tutorial_adobe_flashcs5_bag-1.pdf (diakses tgl 24

Mei 2013)

http://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-

script2.pdf (diakses tgl 24 Mei 2013)

http://belajar-flash.blogspot.com/
http://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-script2.pdfhttp://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-script2.pdfhttp://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-script2.pdfhttp://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-script2.pdfhttp://belajar-flash.blogspot.com/http://belajar-flash.blogspot.com/http://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-script2.pdfhttp://sakhsondotcom.files.wordpress.com/2012/05/materi-5-dasar-action-script2.pdf


25/25

BAB VI

LAMPIRAN

Tugas 1 :

Tugas 2 :

laporan hasil praktikum bab vi.docx

Documents