Anda di halaman 1dari 49

Taufik Umar, S.

Kom
BAB I
PENGANTAR MULTIMEDIA UNTUK MEDIA PEMBELAJARAN
BAGIAN1

Multimedia
Menurut IBM, multimedia adalah gabungan video, audio, grafik dan teks dalam suatu produksi
bertingkat berbasis komputer yang dapat dialami secara interaktif atau menurut McCormick
multimedia secara umum merupakan kombinasi tiga elemen yaitu suara, gambar dan teks atau
menurut Robin dan Linda multimedia merupakan alat yang dapat menciptakan presentasi yang
dinamis dan interaktif yang mengkombinasikan teks, grafik, animasi, audio dan gambar video (dalam
http://lecturer.ukdw.ac.id/anton /download/multimedia2.pdf).

Sejarah Multimedia
Suyanto (2003 : 19) menyatakan bahwa istilah multimedia berawal dari teater, bukan komputer.
Pertunjukan yang memanfaatkan lebih dari satu medium sering kali disebut pertunjukan multimedia.
Pertunjukan multimedia mencakup monitor video dan karya seni manusia sebagai bagian dari
pertunjukan. Sistem multimedia dimulai pada akhir 1980-an, sejak permulaan tersebut hampir setiap
pemasok perangkat keras dan lunak melompat ke multimedia. Pada tahun 1994 diperkirakan ada lebih
dari 700 produk dan sistem multimedia dipasaran.

Definisi Multimedia
Dalam industri elektronika menurut Suyanto (2003 : 20), Multimedia adalah kombinasi dari komputer
dan video (Rosch, 1996) atau multimedia secara umum merupakan kombinasi tiga elemen, yaitu suara,
gambar dan teks (McCormick, 1996) atau multimedia adalah kombinasi dari paling sedikit dua media
input atau output dari data, media ini dapat audio (suara, musik), animasi, video, teks, grafik dan
gambar (Turban dkk, 2002) atau multimedia merupakan alat yang dapat menciptakan presentasi yang
dinamis dan interaktif yang mengkombinasikan teks, grafik, animasi, audio dan gambar video (Robin
dan Linda, 2001)

Definisi yang lain dari multimedia, yaitu dengan menempatkan dalam konteks, seperti yang dilakukan
oleh Hofstetter (2001), multimedia adalah pemanfaatan komputer untuk membuat dan
menggabungkan teks, grafik, audio, gambar bergerak (video dan animasi) dengan menggabungkan link
dan tool yang memungkinkan pemakai melakukan navigasi, berinteraksi, berkreasi dan berkomunikasi.

Objek Multimedia
Menurut Sutopo (2003 : 8), objek multimedia terbagi menjadi :

1. Teks
Menurut Sutopo (2003: 8), Hampir semua orang yang biasa menggunakan komputer sudah terbiasa
dengan teks. Teks merupakan dasar dari pengolahan kata dan informasi berbasis multimedia.
Dalam kenyataannya multimedia menyajikan informasi kepada audiens dengan cepat, karena tidak
diperlukan membaca secara rinci dan teliti. Menurut Hofstetter (dalam
http://lecturer.ukdw.ac.id/anton/download/multimedia2.pdf) adalah kebanya kan sistem
multimedia dirancang dengan menggunakan teks karena teks merupakan sarana yang efektif untuk
mengemukakan ide-ide dan menyediakan instruksi-instruksi kepada user (pengguna).

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |1
Taufik Umar, S.Kom
2. Image
Menurut Sutopo (2003 : 9), secara umum image atau grafik berarti still image seperti foto dan
gambar. Manusia sangat berorientasi pada visual dan gambar merupakan sarana yang sangat baik
untuk menyajikan informasi.

3. Animasi
Menurut Sutopo (2002: 2), animasi adalah pembentukan gerakan dari berbagai media atau objek
yang divariasikan dengan gerakan transisi, efek-efek, juga suara yang selaras dengan gerakan
animasi tersebut atau animasi merupakan penayangan frame-frame gambar secara cepat untuk
menghasilkan kesan gerakan.

4. Audio
Menurut Sutopo (2003 : 13), penyajian audio atau suara merupakan cara lain untuk lebih
memperjelas pengertian suatu informasi. Contohnya, narasi merupakan kelengkapan dari
penjelasan yang dilihat melalui video. Suara dapat lebih menjelaskan karakteristik suatu gambar,
misalnya musik dan suara efek (sound effect). Salah satu bentuk bunyi yang bisa digunakan dalam
produksi multimedia adalah Waveform Audio yang merupakan format file audio yang berbentuk
digital. Kualitas produknya bergantung pada sampling rate (banyaknya sampel per detik).
Waveform (wav) merupakan standar untuk Windows PC.

5. Video
Menurut Suyanto (2003: 279), video merupakan elemen multimedia paling kompleks karena
penyampaian informasi yang lebih komunikatif dibandingkan gambar biasa. Walaupun terdiri dari
elemen-elemen yang sama seperti grafik, suara dan teks, namun bentuk video berbeda dengan
animasi.

Perbedaan terletak pada penyajiannya. Dalam video, informasi disajikan dalam kesatuan utuh dari
objek yang dimodifikasi sehingga terlihat saling mendukung penggambaran yang seakan terlihat
hidup.

6. Interactive Link
Menurut Sutopo (2002: 220), sebagian dari multimedia adalah interaktif, dimana pengguna dapat
menekan mouse atau objek pada screen seperti button atau teks dan menyebabkan program
melakukan perintah tertentu.

Interactive link dengan informasi yang dihubungkannya sering kali dihubungkan secara keseluruhan
sebagai hypermedia. Secara spesifik, dalam hal ini termasuk hypertext (hotword), hypergraphics
dan hypersound Menjelaskan jenis informasi yang dihubungkan.

Interactive link diperlukan untuk menggabung kan beberapa elemen multimedia sehingga menjadi
informasi yang terpadu. Cara peng-aksesan informasi pada multimedia terdapat dua macam, yaitu
linier dan non-linier. Informasi linier adalah informasi yang ditampilkan secara sekuansial, yaitu dari
atas ke bawah atau halaman demi halaman, sedangkan pada informasi non-linier (seperti pada
Gambar dibawah) dapat ditampilkan langsung sesuai dengan kehendak pengguna.

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |2
Taufik Umar, S.Kom

Informasi linier(kiri) dan Non-Linier (kanan)

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |3
Taufik Umar, S.Kom
BAB II
PENGANTAR MULTIMEDIA UNTUK MEDIA PEMBELAJARAN
BAGIAN2

Aplikasi Multimedia dalam Bidang Pelatihan dan Pendidikan


Menurut Sutopo (2003 : 23), komputer multimedia mulai mendapat perhatian pada saat digunakan
untuk pelatihan atau pendidikan dari satu keadaan ke keadaan lain dengan siswa. Presentasi
multimedia dapat menggunakan beberapa macam teks, chart, audio, video, animasi, simulasi atau
foto. Bila macam-macam komponen tersebut digabungkan secara interaktif, maka menghasilkan suatu
pembelajaran yang efektif. Siswa dapat memilih materi pelajaran yang diinginkan dan komputer dapat
memantau kemajuan proses belajar siswa. Presentasi khusus dibuat untuk melengkapi materi
tersebut. Karena memerlukan bermacam-macam interaktif, pembuatan aplikasi pelatihan melakukan
perangkat lunak yang berbeda dibandingkan dengan presentasi bisnis.

Multimedia untuk pelatihan juga sangat efektif, berarti bahwa untuk mengembangkan aplikasi training
lebih sulit dan kompleks dibandingkan dengan presentasi. Namun, dengan perangkat lunak yang tepat,
dapat dikembangkan aplikasi walaupun tidak memiliki keahlian pemprograman.

Penerapan Teknologi Multimedia


Beberapa contoh penerapan teknologi multimedia adalah :

 Internet
Multimedia di internet siaran langsung dari ribuan stasiun radio, melihat animasi bagaimana cara
kerja sesuatu dan melihat video.
 Presentasi
Multimedia memungkinkan seorang presenter beralih dari overhead projector yang menampilkan
gambar dan teks yang kaku kepada gambar bergerak, suara dan animasi untuk menghidupkan
presentasi yang dibawakan.
 Kios
Kios yang interaktif dengan layar sentuh dapat menyediakan berbagai informasi dengan lengkap
ditempat-tempat umum, misalnya informasi mengenai produk, informasi yang disajikan jauh lebih
menarik bagi pengguna dibandingkan informasi yang tercetak.
 Tutorial
Multimedia dengan cepat telah menjadi dasar pelatihan berbasiskan komputer, sebagai contoh
perusahan menyediakan tutorial yang interaktif bagi karyawan baru untuk mempelajari prosedur-
prosedur di perusahaan.
 Online Reference
CD-ROM berbasiskan multimedia mulai menggantikan ensiklopedia baku, petunjuk penggunaan
dan brosur tentang informasi produk. Versi elektronik dari bahan referensi lebih mudah digunakan
dan lebih ringan bila dibawa.
 Publikasi
Berbagai buku, majalah dan koran telah didistribusikan sebagai suatu publikasi multimedia dengan
memanfaatkan CD-ROM dan internet. Halaman yang tercetak tidak akan pernah mampu
manampilkan visualisasi gerakan dan suara.

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |4
Taufik Umar, S.Kom
Tujuan Penggunaan Multimedia
Menurut Sutopo (2003 : 22), multimedia dapat digunakan untuk bermacam-macam bidang pekerjaan,
tergantung dari kreatifitas untuk mengembangkannya. Setelah mengetahui defenisi dari multimedia
serta elemen-elemen multimedia yang ada, serta aplikasi-aplikasi yang saat ini digunakan pada bidang
kehidupan manusia, maka dapat diketahui bahwa tujuan dari penggunaan multimedia adalah sebagai
berikut :

 Multimedia dalam penggunaannya dapat meningkatkan efektivitas dari penyampaian suatu


informasi.
 Penggunaan multimedia dalam lingkungan dapat mendorong partisipasi, keterlibatan serta
eksplorasi pengguna tersebut.
 Aplikasi multimedia dapat meransang panca indera, karena dengan penggunaannya multimedia
akan meransang beberapa indera penting manusia, seperti : Penglihatan, pendengaran, aksi
maupun suara.

Dalam pengaplikasiannya multimedia akan sangat membantu penggunanya, terutama bagi pengguna
awam.

Siklus Hidup Pengembangan Multimedia


Menurut Suyanto (2003 : 353), agar multimedia dapat menjadi alat keunggulan bersaing perusahaan,
pengembangan sistem multimedia harus mengikuti 11 (sebelas) tahapan pengembangan sistem
multimedia, yaitu :

1. Mendefinisikan Masalah
Mendefinisikan masalah sistem adalah hal yang pertama yang dilakukan oleh seorang analis
sistem.
2. Studi Kelayakan
Hal kedua yang dilakukan analis sistem adalah studi kelayakan, apakah pengembangan sistem
multimedia layak diteruskan atau tidak.
3. Analisis Kebutuhan Sistem
Menganalisis maksud, tujuan dan sasaran sistem merupakan hal yang dilakukan pada tahap ini.
4. Merancang Konsep
Pada tahap ini, analisis sistem terlibat dengan user untuk merancang konsep yang menentukan
keseluruhan pesan dan isi dari aplikasi yang akan dibuat
5. Merancang Isi
Merancang isi meliputi mengevaluasi dan memilih daya tarik pesan, gaya dalam mengeksekusi
pesan, nada dalam mengeksekusi pesan dan kata dalam mengeksekusi pesan.
6. Merancang Naskah
Merancang naskah merupakan spesifikasi lengkap dari teks dan narasi dalam aplikasi
multimedia.
7. Merancang Grafik
Dalam merancang grafik, analis memilih grafik yang sesuai dengan dialog.
8. Memproduksi Sistem
Dalam tahap ini, komputer mulai digunakan secara penuh, untuk merancang sistem, dengan
menggabungkan ketujuh tahap yang telah dilakukan.

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |5
Taufik Umar, S.Kom
9. Mengetes Sistem
Pengetesan merupakan langkah setelah aplikasi multimedia selesai dirancang.
10. Menggunakan Sistem
Implementasi sistem multimedia dipahami sebagai sebuah proses apakah sistem multimedia
mampu beroperasi dengan baik.
11. Memelihara Sistem
Setelah sistem digunakan, maka sistem akan dievaluasi oleh user untuk diputuskan apakah
sistem yang baru sesuai dengan tujuan semula dan diputuskan apakah ada revisi atau modifikasi.

Gambar. Rincian Siklus Pengembangan Aplikasi Multimedia

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |6
Taufik Umar, S.Kom
BAB III
MENGENAL ADOBE FLASH CS6 AS 2.0 UNTUK PEMULA

CD Interaktif
CD interaktif merupakan salah satu hasil implementasi dari multimedia dimana terdapat hampir semua
konten multimedia yaitu, Gambar,Video,Animasi,Text, pengolahan/editing, serta pemberian navigasi
untuk menjalankan CD tersebut. Dengan adanya navigasi, maka orang yang yang menjalankan CD
tersebut dapat menelusur ke bagian-bagian yang diinginkan, sehingga materi lebih jelas dan
mendalam. Sehingga terjadi interaksi antara orang yang menjalankan CD dengan program dan materi
yang ada pada CD tersebut. Beberapa kegunaannya antara lain: company profile, gambaran sebuah
proyek, CD materi pembelajaran, dan sebagainya.

Tahapan materi yang harus dipelajari adalah sebagai berikut :


- Camtasia studio (pengambilan objek gambar dan video /capturing)
- Adobe Photoshop (editing image/gambar)
- SwishMAX (animasi gambar dan teks dengan progam instan)
- Macromedia Flash (animasi gambar dan teks tingkat lanjut dengan action script)
- Pembuatan proyek CD pembelajaran, profil daerah, perusahaan dll.

Dan pada kali ini yang kita pelajari adalah design menggunakan aplikasi adobe flash CS3, adapun
tahapan pembuatan dapat dibagi menjadi :
- Menyiapkan gambar baground
- Membuat Scene
- Design Menu Utama
- Menconvert teks menjadi tombol
- Membuat Animasi Tombol
- Membuat Menu Video
- Memasukkan Video
- Membuat navigasi tombol dengan action scrip
- Publishing
- Membuat Autorun

Menjalankan aplikasi Adobe Flash


Untuk menjalankan adobe flash terlebih dahulu
yang perlu diperhatikan pastikan pada komputer
sudah terinstal Adobe Master Collection CS6.
Adapun untuk menjalankan aplikasi adobe flash
klik Start > All Program > Adobe Master
Collection CS6 > Adobe Flash Profesional CS6
Tunggu sampai muncul tampilan seperti gambar
disamping.

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |7
Taufik Umar, S.Kom
Penjelasan gambar di atas
KOMPONEN FUNGSI
Untuk membuka template-template yang sudah disediakan di
Create from template
Adobe Flash CS6.
Create New Untuk membuat atau membuka file dokumen baru.
Pada bagian ini akan di jelaskan dasar-dasar penggunaan yang ada
Learn di Adobe Flash, pengguna nanti akan diarahkan ke Situs Web
Adobe.com ketika memilih.
Untuk membuka file dokumen yang baru saja dibuat dan
Open a Recent Item
disimpan.
Untuk membuka file yang tersimpan di direktori folder pada
Open
komputer kalian.

Membuka dan membuat file dokumen baru


Seperti gambar tampilan diatas kalian dapat membuka atau membuat file dokumen baru di Adobe
Flash CS6 dengan dua cara:
1. Pada bagian Create New kalian dapat
memilih jenis versi Action Script
(Contoh Action Script 2.0).
2. Pada bagian menu pilih File lalu New
pada Tab General pilih jenis versi Action
Script. Kalian dapat melihat seperti
gambar di samping.

Tentukan berapa ukuran dokumen baru


(width, height, frame rate dan
background color) setelah itu tinggal klik
OK.

Selanjutnya akan muncul tampilan seperti gambar di bawah.


Menubar Whorkspace
Scale View

Toolbox
Panel Properties
Dan Library

Timeline Stage

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |8
Taufik Umar, S.Kom
Keterangan gambar di atas
KOMPONEN FUNGSI
Menunjukan tabulasi dari suatu dokumen atau stage yang sedang
Tab Dokumen
dibuat.
Suatu barisan menu yang berfungsi untuk melakukan perintah
Menu bar
yang di tampilkan menggunakan text.
Untuk mengatur layout atau tampilan area kerja di Adobe Flash
Workspace
CS6.
Pada panel ini kalian dapat mengatur suatu Stage,Obyek, dan
Frame yang kalian pilih. disini juga terdapat Publish Setting yang
Panel Properties
dapat kalian pilih untuk menentukan hasil dari program yang telah
kalian buat di Adobe Flash CS6.
Pada panel ini ditujukan untuk menyimpan keseluruhan obyek,
Panel Library seperti simbol,graphic,button,sound dan movie clip yang sudah
dibuat.
Menunjukan suatu tempat dibuat atau diolahnya keseluruhan
Stage
obyek yang ada di Adobe Flash CS6.
Scale View Untuk mengatur skala atau ukuran pada Stage.
Pada bagian ini digunakan untuk memanage (mengatur dan
Timeline
mengontrol) isi yang ada di file dokumen dalam layar dan frame.
Merupakan panel yang berisi beberapa tools atau tombol yang
Toolbox
dapat membuat, mengatur dan juga mendesain suatu objek.

Mengenal Panel Adobe Flash


Stage
Stage adalah lembar kerja yang digunakan untuk membuat atau mendesain objek yang akan
dianimasikan. Objek yang dibuat dalam lembar kerja dapat berupa objek vector, movie clip, text,
button dan lain-lain.

Move Scene Edit Scene Zoom

Edit Symbols

Penjelasan gambar di atas


KOMPONEN FUNGSI
Move Untuk berpindah dari lembar kerja simbol ke lembar kerja utama.
Scene Untuk menunjukan nama scene yang aktif.
Edit Scene Untuk memilih nama scene yang akan diedit.
Edit Symbol Untuk memilih nama symbol yang akan diedit.
Zoom Untuk mengatur besar kecilnya tampilan stage atau lembar kerja

Membuat multimedia interaktif dengan adobe flash action script 2.0 Halaman |9
Taufik Umar, S.Kom
Cara untuk menambahkan scene bisa dilakukan
dengan cara klik Window – other panel – scene
atau bisa juga dengan Shift + F2, lihat gambar di
samping.

Selanjutnya muncul tampilan seperti gambar di bawah

Delete Scene
Add Scene

Duplicate Scene

Penjelasan gambar di atas


KOMPONEN FUNGSI
Add Scene Untuk menambahkan scene.
Duplicate Scene Untuk menduplikat scene yang dipilih.
Delete Scene Untuk menghapus scene.

Timeline
Timeline berguna untuk menentukan durasi animasi, jumlah layer, frame, menempatkan script dan
beberapa keperluan animasi lainnya. Semua bentuk animasi yang Anda buat akan diatur dan
ditempatkan pada layer dalam timeline.

Lock or Unlock All Layers

Show or Hide All Layers Show All Layers as Outlines

Layer
Simbol Pensil
Titik Show or Frame
Hide All Layers

Elapsed Time
New Layer Delete Frame Rate
Controler Current Frame
New Folder
Titik Kunci Tombol pengatur tampilan animasi
Loop

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 10


Taufik Umar, S.Kom
Penjelasan gambar di atas
KOMPONEN FUNGSI
Show or hide all layers Untuk menyembunyikan atau menampilkan semua isi layer.
Lock or unlock all layer Untuk mengunci atau melepas kunci objek dari semua layer.
Untuk menampilkan objek pada semua layer dalam bentuk
Show all layers as outlines
outline.
Sebagai Lembar kerja yang menampung objek yang akan
Layer
dianimasikan di dalam Timeline.
Merupakan suatu bagian dari layer yang digunakan untuk
Frame
mengatur pembuatan animasi.
New layer Untuk menambahkan layer baru.
New folder Untuk menambah folder baru.
Delete Untuk menghapus layer.
Simbol Pensil Menunjukan bahwa layer dalam kondisi terpilih atau aktif.
Titik Show or Hide Untuk menampilkan atau menyembunyikan layer aktif.
Titik Kunci Untuk mengunci atau melepas kunci layer yang aktif.
Controler Untuk mengontrol animasi.
Loop Untuk mengaktifkan pengulangan animasi.
Tombol pengatur tampilan
Untuk mengatur tampilan animasi didalam stage.
animasi
Current Frame Untuk menunjukan posisi frame aktif.
Frame Rate Untuk mengatur kecepatan gerak animasi dalam tiap detiknya.
Elapsed Time Untuk menunjukan durasi atau lamanya animasi.

Action Script Blank Keyframe

Frame

Penjelasan gambar di atas :


KOMPONEN FUNGSI
Merupakan suatu perintah yang diletakan pada suatu keyframe
Action Script atau objek sehingga frame atau objek tersebut akan menjadi
interaktif.
Merupakan suatu bagian dari layer yang digunakan untuk
Frame
mengatur pembuatan animasi.
Merupakan sebuah simbol lingkaran kosong yang menampung
Blank Keyframe
suatu objek.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 11


Taufik Umar, S.Kom

Motion Editor
Motion editor berguna untuk melakukan control animasi yang telah dibuat seperti mengatur motion,
transformasi, pewarnaan, filter dan parameter animasi lainnya.

Toolbox
Toolbox merupakan panel yang berisi beberapa tools atau tombol yang dapat membuat, mengatur
dan juga mendesain suatu objek.

Selection Tool (V) Sub Selection (A)


Free Transform (Q) 3D Rotation (W)
Lasso (L)

Pen (P) Text (T)


Line (N) Rectangle ®
Pencil (Y) Brush (B)
Deco (U)
Bone (X) Paint Bucket (K)
Eyedropper (I) Eraser €

Hand (H) Zoom (M,Z)

Stroke Color
Fill Color
Black and White Swap Colors

Snap to Objects
Tombol pendukung dari
tombol yang terpilih

Penjelasan gambar di atas : Yang terpilih


TOOL SHORTCUT FUNGSI
Selection Tool V Untuk meneyeleksi objek.
Sub Selection A Untuk menyeleksi bagian objek untuk proses editing.
Free Transform Q Untuk mengubah bentuk objek secara bebas.
Untuk melakukan rotasi 3D pada objek berdasarkan sumbu X, Y
3D Rotation W
dan Z.
Lasso L Untuk menyeleksi objek dengan pola seleksi bebas.
Pen P Untuk menggambar objek.
Text T Untuk mengetik teks dan paragraf.
Line N Untuk menggambar objek garis lurus.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 12


Taufik Umar, S.Kom
Rectangle R Untuk menggambar objek kotak.
Pencil Y Untuk menggambar dengan bentuk goresan pensil
Brush B Untuk menggambar dengan bentuk polesan kuas.
Untuk menggambar corak dekorasi dengan menggunakan simbol
Deco U
graphic.
Untuk membuat animasi pertulangan dengan menambahkan titik
Bone X
sendi pada object.
Paint Bucket K Untuk memberi warna bidang objek.
Eyyedroper I Untuk mengambil sampel warna dari sebuah objek.
Eraser E Untuk menghapus bidang objek.
Hand H Untuk menggeser area lembar kerja atau stage.
Untuk memperbesar atau memperkecil tampilan lembar kerja
Zoom M, Z
atau stage.
Stroke Color Untuk menentukan warna garis.
Fill Color Untuk menentukan warna bidang objek.
Black and White Untuk mengubah warna garis dan warna bidang objek.
Untuk membalikan warna antara warna garis dan warna bidang
Swap Colors
objek.
Snap to Objects Untuk mengaktifkan atau mematikan fungsi snap to object.

Panel Properties dan Library


Panel properties berguna untuk menampilkan parameter dari sebuah tombol yang terpilih sehingga
Anda dapat memodifikasi dan memaksimalkan fungsi dari tombol tersebut. Panel properties
menampilkan parameter sesuai dengan tombol yang terpilih.

Panel Properties adalah panel yang menampilkan perintah dari sebuah tombol yang terpilih sehingga
kita dapat melakukan modifikasi dan memaksimalkan fungsi piranti tersebut. Panel properties juga
berguna untuk menampilkan parameter dari sebuah tombol yang terpilih sehingga Anda dapat
memodifikasi dan memaksimalkan fungsi dari tombol tersebut. Panel properties menampilkan
parameter sesuai dengan tombol yang terpilih.

New Simbol Delete

New Folder

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 13


Taufik Umar, S.Kom
Mengatur Stage
Stage atau biasa disebut area lembar kerja di dalam flash yang digunakan untuk meletakan suatu obyek
seperti gambar-gambar yang berada di Panel Library. Pada menu bar kalian bisa pilih Modify lalu pilih
Document setelah itu akan tampil jendela Document Settings seperti pada gambar dibawah. Setelah
kalian atur kalian dapat memilih tombol OK.

Penjelasan gambar di atas


KOMPONEN FUNGSI
Pada bagian ini digunakan untuk mengatur ukuran Stage dengan
Dimension memberi nilai Width untuk nilai lebar dan juga Height untuk
memberi nilai tinggi pada Stage.
Jika di centang maka ukuran objek secara otomatis akan
Scale content with stage
menyesuaikan ukuran Stage ketika diubah.
Digunakan untuk menentukan nilai satuan ukur yang dipilih
Ruler units seperti pada gambar diatas menggunakan Pixels untuk satuan
ukuranya.
Background color Untuk menentukan latar belakang dari warna Stage.
Untuk mengatur banyaknya frame yang dihasilkan dalam setiap
Frame rate
detiknya,digunakan untuk keperluan animasi.
Fitur yang sangat berguna di Adobe Flash CS6 kalian dapat
mengatur waktu untuk penyimpanan otomatis.Jika PC atau
Auto-Save komputer kalian mati namun pekerjaan lupa kalian simpan,maka
fitur ini akan membuat file recovery ketika kalian membuka lagi
Software Adobe Flash CS6.

Menggeser Stage
Kalian dapat menggeser Stage atau lembar kerja dengan menggunakan tools yang ada di Panel Tools.
Pertama kalian dapat memilih tombol yang bernama Hand tool lalu klik objek atau gambar dan geser
pada posisi yang diinginkan.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 14


Taufik Umar, S.Kom
Mengatur Skala Stage
Saat kalian sedang mengerjakan suatu objek terkadang ada salah satu objek yang harus kalian zoom
pada posisi tertentu, untuk memaksimalkan hasil dari pengerjaan suatu objek. Nah kalian dapat
melakukanya dengan mengatur skala stage dengan cara memilih tombol yang bernama Zoom tool.

Menampilkan Ruler pada Stage


Ruler digunakan untuk membantu kalain dalam mengerjakan suatu objek,agar ukuran dan bentuk
objek memiliki presisi ukuran yang tepat. Kalian dapat mengaktifkanya dengan cara:
- Pada menu bar kalian dapat memilih menu View lalu pilih Rulers.
- Kemudian rulers akan aktif seperti pada gambar di bawah:

Menampilkan Grid pada Stage


Grid digunakan untuk membantu dalam pengerjaan objek yang dimana akan menampilkan kotak
bantu yang berjajar pada area Stage. Kalian dapat mengaktifkanya dengan cara:
- Pada menu bar kalian dapat memilih menu View pilih Grid lalu Show Grid.
- Kemudian grid akan aktif seperti pada gambar dibawah:

Menambahkan Scene
Scene atau biasa disebut layar yang biasa digunakan untuk mengatur dan menyusun objek-objek. Cara
lain untuk menambahkan Scene yaitu dengan cara klik menu Insert setelah itu pilih Scene.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 15


Taufik Umar, S.Kom
Cara untuk membuat scene bisa dilakukan
dengan cara klik Window – other panel – scene
atau bisa juga dengan Shift + F2

Kemudian untuk menambahkan beberapa scene tinggal kita klik tombol + maka dengan sendirinya
akan muncul scene yang baru dan buatlah sampai 7 scene serta ganti nama scene tersebut seperti
gambar dibawah untuk merubah nama scene bisa dilakukan denga klik 2X pada scene tersebut
kemudian tinggal ganti namanya.

Mengenal Simbol
Simbol adalah objek flash dimana setiap simbol yang kita buat akan masuk ke dalam library. Untuk mengubah
sebuah objek menjadi symbol dapat kita lakukan dengan menyeleksi objek tersebut menggunakan selection tool
kemudian masuk menu insert pilih Convert to Symbol atau dengan menekan tombol F8 pada keyboard, maka
akan muncul tampilan seperti gambar di bawah.

Keterangan gambar di atas.


KOMPONEN FUNGSI
Untuk memberi nama symbol tersebut yang nantinya akan
Name
dicantumkan dalam library.
Type Sifat atau fungsi dari symbol.
Jenis symbol yang diperlukan untuk membuat objek animasi yang
Movie Clip memiliki multiframe sendiri sebagai timelinenya. Jadi symbol yang
dihasilkan bisa dimainkan secara terpisah dari movie utama.
Grafik Jenis symbol yang digunakan untuk membuat objek statis.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 16


Taufik Umar, S.Kom
Jenis symbol yang digunakan untuk membuat tombol interaktif
Button yang berfungsi untuk merespon mouse ketika diklik, melewati
atau yang lainnya.
Registration Untuk menentukan pusat atau titik putar objek.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 17


Taufik Umar, S.Kom
BAB III
MEMBUAT MULTIMEDIA INTERAKTIF MENGGUNAKAN ADOBE FLASH AS 2.0

Membuat Dokumen Baru


Buatlah dokumen baru dengan cara dengan klik
file kemudian pilih New

Selanjutnya atur ukurannya seperti gambar di bawah, setelah itu klik OK.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 18


Taufik Umar, S.Kom

Menyimpan Dokumen
Lakukan penyimpanan dengan cara klik file
kemudian pilih save.

Selanjutnya lakukan penyimpanan seperti


gambar di samping.

Keterangan :
Buat Folder pada Local Disk D dan beri nama
folder tersebut dengan nama MULTIMEDIA
INTERAKTIF BAGIAN 1 setelah itu simpan
dokumen tersebut dengan nama Multimedia
Interaktif.

Membuat Background
Ubah warna background menjadi #A5976A pada
panel properties.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 19


Taufik Umar, S.Kom
Maka hasilnya bisa kita lihat seperti gambar d i bawah.

Fill Color (#A5976A)


Stroke Color (None)

Buat sebuah layout dengan menggunakan ruller dan buat seperti gambar di bawah

Ubah nama Layer 1 menjadi background, lihat


gambar di samping.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 20


Taufik Umar, S.Kom
Buatlah sebuah rectangle tool beri warna fill (#725B3B) dan stroke (none) lihat gambar di samping

Fill Color (#725B3B)

Selanjutnya buat objek rectangle tool kembali dengan warna fill (#52432E) stroke (none), lihat gambar
di bawah

Fill Color (#52432E)

Fill Color (#725B3B)

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 21


Taufik Umar, S.Kom
Tahap selanjutnya buat kembali rectangle tool dengan warna yang berbeda yaitu fill color (#725B3B)

Fill Color (#52432E)

Fill Color (#52432E)

Sama seperti tahap sebelumnya, kita buat kembali objek rectangle tool dan kali ini kita pakai fill color
(#666666) dan stroke color (None) lihat gambar di bawah

Fill Color (#666666)

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 22


Taufik Umar, S.Kom
Tahap selanjutnya tambahkan beberapa teks dengan menggunakan Text Tool (T), lihat gambar di
bawah

Membuat Tombol
Aktifkan salah satu objek yang akan kita jadikan
tombol, lihat gambar di samping.

Untuk mengubah objek tersebut menjadi


sebuah tombol, klik kanan pada objek tersebut
kemudian pilih Convert to Symbol

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 23


Taufik Umar, S.Kom
Selanjutnya ubah Name (btn_beranda) Type
(Button) setelah itu akhiri dengan klik OK, lihat
gambar di samping

Maka hasil akhirnya bisa kita lihat pada gambar


di samping

Pada panel properties beri nama instan dengan


nama btn_beranda, lihat gambar di samping

Selanjutnya kita bisa memodifikasi tombol


tersebut dengan klik kanan pada tombol
tersebut kemudian pilih Edit in Place

Pada frame Up tambahkan teks (Beranda), lihat


gambar di samping

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 24


Taufik Umar, S.Kom
Penjelasan Frame Up, Over, Down dan Hit sebagai berikut :
UP : Frame keadaan tombol dalam kondisi normal (standby)
Over : Frame keadaan tombol dalam kondisi dilewati oleh pointer mouse
Down : Frame keadaan tombol dalam kondisi ditekan
Hit : area tekan tombol

Selanjutnya klik kanan pada Frame Over


kemudian Pilih Insert Keyframe

Pada frame Over ubah warna dasar tombol dan


ubah warna teksnya, warna dasar tombol
(#D4D4D4) dan untuk font ubah style (Bold) dan
ubah warnanya menjadi (#333333)

Untuk frame Down samakan seperti frame Up


dengan cara klik kanan frame Up pilih Copy
Frame kemudian klik kanan pada frame Down
pilih Paste Frame, hasilnya bisa kita lihat seperti
gambar di samping.

Menambahkan Sound Effect pada Tombol


Tahap yang satu ini kita harus melakukan proses import audio, untuk proses import sendiri terbagi
menjadi 2 yaitu import to stage dan import to library. Perbedaannya antara import to stage dan import
to library sebagai berikut :
1. Import to stage
Setiap media yang diimport secara otomatis akan muncul pada stage dan secara otomatis media yang
kita import juga akan masuk pada panel library.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 25


Taufik Umar, S.Kom
2. Import to library
Berbeda dengan import to stage pada import library media yang kita import tidak akan langsung
muncul di stage melainkan hanya muncul pada panel library, untuk memasukan media tersebut ke
stage harus di drag dari library ke stage.

Langsung saja bagaimana proses importnya, klik


file > import > import to library

Selanjutnya pilih media yang akan kita import


setelah itu klik Open

Secara otomatis media tersebut akan tersimpan


pada panel library, lihat gambar di samping

Aktifkan frame Over pada tombol beranda

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 26


Taufik Umar, S.Kom
Kemudian pada panel properties pilih salah satu
sound efek, lihat gambar di samping

Maka pada frame Over lihat perbedaannya


dengan frame yang lainnya yang belum ada
backsoundnya

Aktifkan frame Down, lihat gambar di samping

Kemudian tambahkan sound efek pada frame


Over, lihat gambar di samping

Tahap penambahan sound efek sudah selesai,


untuk kembali ke Scene 1 klik Scene 1, lihat
gambar di samping.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 27


Taufik Umar, S.Kom
Kemudian lakukan cara yang sama untuk
tombol-tombol yang lainnya, lihat gambar
disamping

Panel library

Tombol Paket Keahlian

Tombol Sarana Prasarana

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 28


Taufik Umar, S.Kom

Tombol Ekstrakurikuler

Menambahkan Foto
Buat layer baru dengan nama Foto_Gedung

Selanjutnya import Foto, pada kali ini kita


gunakan Import to Stage agar secara otomatis
foto tersebut muncul di stage

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 29


Taufik Umar, S.Kom
Atur letaknya seperti gambar di samping

Selanjutnya buat layer baru dengan nama


Masking

Selanjutnya pada layer masking buat objek


menggunakan rectangle tool, dan atur letaknya
seperti gambar di samping

Klik kanan pada layer Masking kemudian pilih


Mask

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 30


Taufik Umar, S.Kom
Maka perubahannya bisa kita lihat pada timeline

Membuat Konten
Buat layer baru dengan nama Konten

Selanjutnya tambahkan konten dengan menggunakan Text Tool dan buat seperti gambar di bawah

Aktifkan frame 1 layer konten

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 31


Taufik Umar, S.Kom
Tekan F8, kemudian convert menjadi Movie Clip
dan beri nama mc_konten

Dan jangan lupa beri nama instannya juga

Selanjutnya klik kanan pada konten tersebut dan


pilih Edit in Place

Ubah nama Layer 1 menjadi Beranda

Buat layer baru dengan nama Paket Keahlian

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 32


Taufik Umar, S.Kom
Tambahkan keyframe pada frame 2 layer Paket
Keahlian

Selanjutnya pada frame 2 layer Paket Keahlian tambahkan konten seperti gambar di bawah

Selanjutnya penjelasan dari Teknik Pengelasan


dikonvert menjadi Movie Clip dengan nama
mc_kontenpk

Jangan lupa dengan nama instant pada panel


properties

Tahap selanjutnya klik kanan pada penjelasan


Teknik Pengelasan kemudian pilih Edit in Place

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 33


Taufik Umar, S.Kom
Ubah nama Layer 1 menjadi Teknik Pengelasan

Buatlah garis bantu dengan ruller seperti gambar di bawah

Buat layer baru dengan nama Foto Teknik


Pengelasan

Selanjutnya import foto teknik pengelasan dan posisikan seperti gambar di bawah

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 34


Taufik Umar, S.Kom
Selanjutnya tambahkan layer baru dengan nama
Masking

Pada layer Masking tambahkan objek dengan


rectangle tool dan posisikan seperti gambar di
samping

Selanjutnya klik kanan pada layer masking dan


pilih Mask, lihat perubahan pada timeline

Dan hasilnya seperti gambar di samping

Selanjutnya ubah ukuran font penjelasan Teknik


Pengelasan seperti gambar di samping

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 35


Taufik Umar, S.Kom
Buat layer baru dengan nama Teknik Kendaraan
Ringan

Tambahkab keyframe pada frame 2 layer Teknik


Kendaraan Ringan

Tambahkan konten pada frame 2 layer Teknik


Kendaraan Ringan

Buat layer baru dengan nama Foto Teknik


Kendaraan Ringan dan tambahkan keyframe
pada frame 2 layer Foto Teknkin Kendaraan
Ringan.

Aktifkan frame 2 layer Teknik Kendaraan Ringan


kemudian import foto Teknik Kendaraan Ringan
dan atur posisinya seperti gambar di bawah

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 36


Taufik Umar, S.Kom
Tahap selanjutnya buat layer baru dengan nama
Masking dan tambahkan keyframe pada frame 2

Selanjutnya pada frame 2 layer Masking buat


objek dengan rectangle tool dan atur posisinya
seperti gambar di samping

Klik kanan layer Masking kemudian pilih Mask,


perubahannya bisa kita lihat pada timeline

Dan hasilnya bisa kita lihat pada gambar di


samping

Lakukan cara yang sama untuk beberapa Paket Keahlian yang lainnya, seperti berikut :
Teknik Komputer & Jaringan = Frame 3
Multimedia = Frame 4
Tata Busana = Frame 5
Teknik Otomasi Industri = Frame 6

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 37


Taufik Umar, S.Kom

Buat layer baru dengan nama Frame

Masih pada frame Frame Foto tambahkan objek dengan Rectangle Tool Fill color (putih) Stroke color
(putih) dan atur ukuran serta posisinya seperti gambar di bawah

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 38


Taufik Umar, S.Kom
Klik objek yang tadi kita buat ubah menjadi transparan 80% dengan cara klik objek tersebut kemudian
ubah opacity seperti gambar di bawah.

Masih pada layer dan frame yang sama, buat ulang objek persegi pada kali ini fill color kita ganti dengan
warna yang lain, lihat gambar di bawah

Tahap selanjutnya kita buat objek itu terpotong


dengan cara klik objek yang kedua kita buat
kemudian tekan Delete, maka hasilnya bisa kita
lihat seperti gambar di samping.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 39


Taufik Umar, S.Kom
Buat layer baru dengan nama Keterangan
gambar, lihat gambar di samping.

Masih pada layer Keterangan Gambar


tambahkan teks seperti gambar di samping

Selanjutnya klik kanan frame 2 layer keterangan


gambar pilih insert keyframe.

Selanjutnya pada frame 2 layer keterangan


gambar ubah menjadi Teknik Kendaraan Ringan,
lihat gambar di samping

Lakukan cara yang sama untuk paket keahlian yang lainnya


Teknkik Komputer & Jaringan

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 40


Taufik Umar, S.Kom
Multimedia

Tata Busana

Teknik Otomasi Industri

Buat layer baru dengan nama tombol

Selanjutnya tambahkan tombol dengan cara klik


Window kemudian pilih Common Libraries dan
terakhir pilih Button

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 41


Taufik Umar, S.Kom
Pilih salah satu tombol yang akan kita gunakan,
yang akan kita gunakan rounded grey back

Klik and drag tombol rounded grey back pada


stage dan atur ukuran serta letaknya seperti
gambar di samping

Selanjutnya pilih satu tombol lagi kali ini kita


gunakan rounded grey forward, klik and drag ke
dalam stage dan atur ukuran serta letaknya
seperti gambar di samping

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 42


Taufik Umar, S.Kom
Klik kanan tombol rounded grey back pilih
actions

Selanjutnya ketik scrip seperti gambar di


samping

on(release){
prevFrame();
}

Maksud dari script di atas adalah ketika tombol tersebut di klik secara otomatis akan menampilkan isi
frame sebelumnya.

Klik kanan tombol yang satunya rounded grey


forward pilih actions, setelah itu ketik script
seperti gambar di samping

on(release){
nextFrame();
}

Maksud dari script di atas adalah ketika tombol tersebut di klik secara otomatis akan menampilkan isi
frame selanjutnya.

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 43


Taufik Umar, S.Kom
Tahap selanjutnya blok frame 2 hingga frame 6
layer tombol, lihat gambar di samping

Klik kanan pada frame yang tadi kita seleksi


setelah itu pilih Convert to Keyframes

Maka lihat perubahan pada timeline

Buat layer baru dengan nama Action

Klik kanan frame 1 layer Action kemudian pilih


action, setelah itu ketik script seperti gambar di
samping.

stop();

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 44


Taufik Umar, S.Kom
Maksud script di atas adalah berhenti pada frame 1.

Selanjutnya kembali pada mc_konten dengan


cara klik mc_konten

Buat layer baru dengan nama Sarana Prasarana,


kemudian klik kanan pada frame 3 layer sarana
prasarana pilih insert keyframe dan hasilnya
seperti gambar di samping.

Pada frame 3 layer sarana prasarana tambahkan konten seperti gambar di bawah

Buat layer baru dengan nama Ekstrakurikuler,


kemudian pada frame 4 layer ekstrakurikuler klik
kanan pilih insert keyframe maka hasilnya bisa
kita lihat seperti gambar di samping

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 45


Taufik Umar, S.Kom
Pada frame 4 layer ekstrakurikuler tambahkan konten seperti gambar di bawah

Buat layer baru dengan nama Action

Klik kanan pada frame 1 layer Action pilih


Actions, setelah itu ketik script seperti gambar di
samping.

Tahap selanjutnya adalah kembali pada Scene 1


dengan cara klik Scene 1 lihat gambar di samping

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 46


Taufik Umar, S.Kom
Menambahkan Script Pada Tombol Menu dan Fullscreen
Tombol Beranda
Klik kanan tombol beranda kemudian pilih
Actions, ketikan script seperti gambar di
samping

on(release){
mc_konten.gotoAndStop(1);
}

Maksud dari script di atas adalah ketika tombol beranda di klik maka akan berhenti pada frame 1 movie
clip konten

Tombol Paket Keahlian


Klik kanan tombol Paket Keahlian kemudian pilih
Actions, ketikan script seperti gambar di
samping

on(release){
mc_konten.gotoAndStop(2);
}

Tombol Sarana Prasarana


Klik kanan tombol Sarana Prasarana kemudian
pilih Actions, ketikan script seperti gambar di
samping

on(release){
mc_konten.gotoAndStop(3);
}

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 47


Taufik Umar, S.Kom
Tombol Ekstrakurikuler
Klik kanan tombol Ekstrakurikuler kemudian
pilih Actions, ketikan script seperti gambar di
samping

on(release){
mc_konten.gotoAndStop(4);
}

Menambahkan Script Fullscreen


Buat layer baru dengan nama Action

Klik kanan pada frame 1 layer Action kemudian


pilih Actions setelah itu ketik script seperti
gambar di samping

fscommand(“fullscreen”,true);

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 48


Taufik Umar, S.Kom
BAB V
TAHAP PUBLISHING

Publishing
Untuk menjadikan file flash ini bisa berjalan tanpa aplikasi flash maka kita harus menjadikan file ini
berekstensi .exe

Caranya :
Klik File – Publish settings (Ctrl + Shift + F12)
maka akan muncul tampilan seperti berikut.

pada perintah di samping tentukan format aynga


akan kita gunakan, pada tahap ini kita cukup
memilih Flash (.swf) dan Win Projector(.exe)
setelah itu diakhiri dengan klik tombol Publish.

Proses publishing

Membuat multimedia interaktif dengan adobe flash action script 2.0 H a l a m a n | 49

Anda mungkin juga menyukai