Adjy’s Weblog

Just another WordPress.com weblog

Mei 16, 2008 pada 9:07 am · Disimpan dalam Uncategorized

Tutorial Flash Mx bagi Pemula

Pernahkah anda melihat gambar yang bergerak-gerak ketika pertama kali masuk mengunjungi sebuah situs?atau pernahkah anda melihat kartun yang setiap hari ditayangkan di televisi kesayangan anda?Mungkin anda bertanya-tanya bagaimana cara membuatnya bukan?

Melalui tutorial berikut saya akan mengajak anda jalan-jalan ke dunia animasi dimana anda dapat berkhayal, berimajinasi bahkan mengimplementasikannya. Kali ini saya akan memperkenalkan anda dengan sebuah aplikasi yang cukup menyenangkan yang bernama Flash MX. Flash MX merupakan bagian dari keluarga Macromedia yang digunakan sebagai aplikasi pembuat animasi. Di bawah ini merupakan aplikasi yang termasuk ke dalam keluarga Macromedia.

Aplikasi-aplikasi Macromedia:

- Flash MX.
- Fireworks.
- Dreamweaver.
- Freehand.

Seiring dengan perkembangan zaman maka Flash MX disesuaikan sesuai kebutuhan akan pembuatan sebuah aplikasi web disamping pembuatan animasi.

Action Script 2.0 pada Flash MX 2004

Macromedia Flash adalah sebuah software animasi yang sekarang menjadi software favorit para web designer untuk membuat webnya terlihat dinamis dan lebih atraktif. Bahkan sekarang Flash digunakan untuk berbagai keperluan, diantaranya untuk presentasi, proposal modern, e-card, game dll. Tutorial ini ditujukan untuk para designer yang sudah mengenal flash dan ingin mengeksplorasi kehebatan flash, bagi yang masih pemula anda bisa mendownload ‘Tutorial Flash MX Bagi Pemula’, tutorial bagus dari Yanis Oktri Pranita.

“Mengapa menggunakan Action Script 2.0, apa manfaatnya?”, Action Script 2.0 dirancang untuk memudahkan programmer untuk membuat aplikasi berbasis flash, keuntungannya antara lain adalah untuk system navigasi pada suatu situs atau presentasi, menghemat ukuran file, membuat hal-hal yang bersifat interaktif. Agar lebih terasa keuntungannya anda dapat mencoba membuat aplikasi yang penulis berikan. Penulis memberikan contoh aplikasi yang tidak langsung mengarah pada contoh-contoh flash yang sudah ada, hal ini sengaja dirancang agar pembaca terangsang untuk membuat sebuah aplikasi yang memang hasil dari kreatifitas sendiri.

Rotasi Gambar dengan Action Script

24-04-2008 | 22:23:31 | Halaman Ini dibaca 1238 kali

Berikut ini akan dijelaskan bagaimana membuat gambar tersebut akan berputar atau berotasi dengan hanya menggunakan action script. Di sini kita akan menggunakan beberapa step-step karena tujuannya akan mempermudahkan pengguna untuk membuat gambar tersebut.

A. Step 1

Ciptakan 1 buat document dan kemudian tekan pada keyboard CTRL+J kemudian akan terbuka document properties dan kemudian isikan widht=180 px dan height =156 px dan atur frame rate dengan 100 fps.

B. Step 2

Pilih file > inport > Inport to stage (shortcut CTRL + R) dan kemudian akan muncul gambar seperti gambar di bawah ini.

C. Step 3
Klik gambar kemudian tekan pada keyboard F8 dan kemudian atur convert to symbol

D. Step 4

Kemudian klik gambar dan tekan F9 kemudian ketikan action script di bawah ini

onClipEvent (enterFrame){
this.ang=ang+0.01;
_alpha=190*Math.sin(this.ang)+190;
_rotation++;
_xscale=260*Math.sin(this.ang)+1900;
}

Test hasil percobaan kamu dengan cari tekan CTRL+ENTER

Membuat Flash Icon Animasi

16-04-2008 | 23:03:39 | Halaman Ini dibaca 2038 kali

(Arahkan pointer mouse anda ke gambar di atas ini).

Di pembahasan kali ini saya akan membuat sebuah tampilan flash icon, apabila di dekatkan ke sebuah icon kemudian icon tersebut akan memberikan aksi. Di sini kita menggunakan gambar dan kemudian gambar tersebut kita buat movie. Anda dapat mengikuti step-step di bawah ini, jangan anda lewatkan satu step saja karena akan mengalami kesalahan dan hasil flashnya tidak berjalan.

A. Step 1
Ciptakan sebuah document dan kemudian atur setting dengan cara menekan CTRL J.

B. Step 2
Buat 3 buah layar dengan nama masing-masing layar AS, InvisibleButton, icon.

C. Step 3
Kemudian klik File>Insert>Import to library, dan pindahkan gambar dari library ke stage.

Dan tulis tulisan seperti pada gambar di atas dan kemudian tekan F8, atur convert to symbol

D. Step 3
Seleksi gambar kemudian klik 2 kali dan dan klik pada frame ke dua klik kanan kemudian pilih insert key frame. Dan kemudian klik pada frame ke 10 kemudian pilih gambar dan pilih jenis color yaitu Advanced.

Dan klik setting kemudian atur seperti pada gambar

Kemudian klik ok dan klik di tengah frame antara frame 2 dan frame 10 dan kemudian klik kanan dan pilih motion.

E. Step 5
Buat layar 2 dan kemudian ambil gambar yang berada di library dan masukkan ke stage. Atur letak dari tulisan tersebut sehingga dapat membentuk.

library

F. Step 6
Klik pada layar AS dan klik pada frame 1 kemudian tekan F9 dan tuliskan action acript di bawah ini :
_root.icon.onEnterFrame = function() {
if (mouse_over_icon) {
_root.icon.nextFrame();
} else {
_root.icon.prevFrame();
}
};

G. Step 7
Klik pada layar Invisible button kemudian ambil gambar Invisible button yang ada di library dan masukkan ke stage.

F. Step 8
Klik Invisible button yang ada di stage kemudian tekan F9 kemudian tulis scrip di bawah ini :
on (rollOver) {
_root.mouse_over_icon = true;
}
on (rollOut) {
_root.mouse_over_icon = fstartlse;
}
on (release){
getURL(“http://www.ilmuwebsite.com/”, “blank”);
}
Kemudian jalankan dengan cara CTRL + ENTER

Hasilnya:

(Arahkan pointer mouse anda ke gambar di atas ini).

Tutorial Flash menggunakan Masking

07-08-2007 | 09:02:58 | Halaman Ini dibaca 8310 kali

Hoss,. Gomen (maaf) kalo tulisan ini sangat basi jadi bagi yang yang merasa sudah merasa bosan silahkan untuk mencari atau melanjutkan surfing,.. hiks! Yups, sekarang mulai aja ya,.. cape kalo mengtik kagak karuan gini,..

Pertama kali anda buka Macromedia Flash->File->New (sebenarnya sudah otomatis sewaktu anda membuka program), telihat stage masih dalam keadaan kosong lalu anda buat sederet tulisan, dalam hal ini saya menulis www.ilmuwebsite.com (gambar1)

oh, iya tulisan tersebut berada pada layer 1 dan frame 1. kemudian buat satu Layer baru dgn mengklik insert layer (gambar 2)

setelah itu copy tulisan pada layer 1 dengan shortcut Ctrl+C atau pada menu

Edit->Copy dan Paste in place pada layer 2 dgn shortcut Ctrl+Shift+V atau pada menu Edit->Paste in place sebelumnya layer 2 dalam keadaan aktif untuk mengaktifkannya tinggal klik layer 2. kenapa tidak langsung paste saja? Karena jika paste maka hasil yang akan di paste-kan akan berpindah tidak sejajar atau ngepas tulisan. Selanjutnya insert layer untuk di jadikan object mask, pada layer 3 kita buat persegi dengan warna yang berbeda dan letakkan dekat dengan tulisan (gambar 3)

eh, jangan lupa layer 3 harus pada baris kedua dari barisan layer caranya drag layer 3 kemudian tahan dan geser kebaris kedua.

Setelah persiapan layer sudah beres, kini pada toolbar Timeline klikkanan pada frame 15 klik Insert Frame (gambar 4) lakukan hal yang sama pada setiap layer.

Selanjutnya pada frame 15 pada layer 3 klik kanan pilih Create Motion Tween (gambar 5)

geser object persegi sampai ke akhir huruf. Test dengan menekan Enter jika object begerak dari kiri ke kanan maka animasi berhasil setelah animasi bergerak sekarang klik kanan pada layer 2 dan pilih Mask. (gambar 6)

kemudian lihat hasil dengan menekan Enter atau dengan testmovie pada menu Control->TestMovie atau juga dgn shortcut Ctrl+Enter dan jangan lupa untuk di save.

Komentar