Sabtu, 15 Agustus 2009

Membuat Animasi Galery foto dengan Adobe Flash CS3

Membuat animasi gallery foto dengan adobe flash CS3

Kali ini saya akan memberikan tutorial cara membuat animasi galeri foto yang pada saat di jalankan, foto tersebut akan berubah menjadi foto yang lain secara bergantian. Berikut langkah-langkahnya.

1. Buat dokumen baru dari menu File – New

2. Tampilkan dokumen property (shortcut ctrl+J), kemudian aturlah nilai ukuran stage W: 259 px dan H: 315 px.

3. Masukkan 3 buah gambar yang anda inginkan ke dalam library dengan cara mengklik menu file – import – import to library

4. Klik dua kali pada layer 1, kemudian ubah namanya menjadi gambar 1

5. Klik frame 1 pada layer gambar1, lalu pindahkan gambar pertama pada Panel Library ke dalam stage.

6. Tampilkan panel properties (ctrl+F3), kemudian atur ukuran gambar dengan nilai W:259 px dan H:315 px, X:0, dan Y:0.

7. Klik pada posisi frame 70 dari layer gambar1, kemudian tekan tombol F5 (Insert Frame) dari keyboard.

8. Buat layer baru dengan cara mengklik menu insert – timeline – layer. Maka akan muncul layer 2 di atas layer gambar 1, kemudian ubah nama layer 2 menjadi gambar2.

9. Klik pada posisi frame 40 dari layer gambar2, kemudian tekan tombol F7 (Insert Blank Keyframe) dari keyboard.

10. Pindahkan gambar kedua yang ada pada panel library ke dalam stage, kemudian atur ukuran gambar menjadi sama dengan ukuran stage.

11. Pada gambar kedua, jadikan symbol movie clip dengan cara menekan tombol F8 (Convert to Symbol) dari keyboard, lalu pada bagia name ketik mc_gambar2, sedangkan pada bagian type pilih movie clip.


12. Klik pada posisi frame 50 dari layer gambar2, kemudian tekan F6 (Insert Keyframe) dari keyboard.

13. Pilih gambar yang ada pada posisi frame 40 dari layer gambar2 dan pindahkan posisi gambar ke kanan luar stage.


14. Tampilkan panel properties (ctrl+F3), kemudian pada bagian color pilih Alpha dan berikan nilai 0% (Untuk mentransparankan gambar).


15. Pilih gambar dengan cara mengklik pada posisi frame 50 dari layer gambar2, kemudian pada panel properties berikan nilai color alpha: 70%.

16. Pilih gambar dengan cara mengklik pada posisi frame 70 dari layer gambar2, kemudian pada panel properties bagian color pilih advance.


17. Klik tombol setting, maka akan muncul jendela Advance Effect dan aturlah nilai Red: 61, Green: 66, Blue: 132, Alpha: 0.


18. Blok posisi frame 40 sampai dengan frame 69 dari layer gambar2, lalu klik kanan dan pilih menu create motion tween.


19. Klik pada posisi frame 140 dari layer gambar2, kemudian tekan tombol F5 (Insert Frame) dari keyboard.

20. Buat layer baru dengan cara mengklik menu insert – timeline –layer. Maka akan tampil kayer 3 di atas layer gambar2, kemudian klik dua kali pada layer 3 dan ubah nama layer 3 menjadi gambar3.

21. Klik pada posisi frame 110 dari layer gambar3, kemudian tekan tombol F7 (Insert Blank Keyframe) dari keyboard.

22. Drag gambar yang ketiga pada panel library ke dalam stage dan atur ukuran gambar sama dengan ukuran stage.

23. Gambar yang ketiga tersebut jadikan symbol movie clip dengan cara tersebut tombol F8 (Convert to Symbol) dari keyboard dan ketikkan nama mc_gambar3 pada bagian name, sedangkan pada bagian type pilih Movie Clip.

24. Klik pada posisi frame 120 dari layer gambar3, kemudian tekan F6 (Insert Keyframe) dari keyboard.

25. Pilih gambar di stage pada posisi frame 110 dari layer gambar3, kemudian pada panel properties (ctrl+F3), aturlah nilai bagian color, pilih alpha: 0%.

26. Pilih gambar yang ada pada posisi frame 120 dari layer gambar3, kemudian pada panel properties (ctrl+F3) bagian color pilih advanced.

27. Klik tombol setting, kemudian aturlah nilai dari bagian red: 91, green: 168, blue: 198, dan alpha: 0.

28. Klik pada posisi frame 140 dari layer gambar3, kemudian tekan tombol F6 (Insert keyframe) dari keyboard.

29. Pilih gambar yang ada pada posisi frame 140 dari layer gambar3, kemudian pada panel properties bagian color pilih alpha dan berikan nilai 100%.

30. Blok frame 110 sampai dengan frame 139 dari layer gambar3, kemudian klik kanan pilih create motion tween.


31. Klik pada posisi frame 200 dari layer gambar3, kemudian tekan tombol F5 (Inser frame) dari keyboard.

32. Simpan dengan format *.fla

33. Dan publish dengan format *.swf bila anda ingin menampilkannya di halaman website atau blog anda.

34. Bila anda ingin menambahkan lebih banyak foto lagi, duplicate saja layer2 yang sudah ada dan ubah nama layer sesuai nomer. Dan tambahkan lebih banyak lagi foto ke library.

35. Selamat mencoba, silahkan tinggalkan komentar bila ada pertanyaan.


Berikut hasilnya:



| More

Ingin berlangganan Artikel seperti diatas? Masukkan alamat E-mail anda dibawah ini:

Delivered by FeedBurner

Artikel Lainnya

24 komentar:

ocim on 15 Agustus 2009 03.34 mengatakan...

wuih keren uy gambar flashnya

Danu.do.am on 15 Agustus 2009 03.37 mengatakan...

tq for information.. hehe
artikel yg bagus...!

asep canda on 15 Agustus 2009 03.58 mengatakan...

muantap info nya sob ini yang aku cari cari makasih ya

yans1212 on 15 Agustus 2009 04.18 mengatakan...

mantap man, sekalian ku praktekn ah..

Belajar SEO Para Pemula on 15 Agustus 2009 06.16 mengatakan...

wah menarik nih,

jellyfish on 15 Agustus 2009 06.16 mengatakan...

thanx..infonya..

Samudera Gema P mengatakan...

Silahkan di coba

robby mengatakan...

Cool Artikel....

ruri mengatakan...

koment box dengan tampilan yang berbeda,,,
nice tutorial... goodluck.

gema_gogo on 17 Agustus 2009 15.59 mengatakan...

@robby thanks

@ruri Iya makasih, tapi sudah balikin lagi sperti smula, berat kalo di pake loading.

berpikir dan berjiwa besar on 17 Agustus 2009 17.24 mengatakan...

waa keren tengs yaaa tutorialnya semoga suksessss

udin ads on 17 Agustus 2009 20.04 mengatakan...

tutorial yg mantap sob

asep canda on 17 Agustus 2009 20.31 mengatakan...

keren bangetz nih info sob makasih ya...!!!!!

gema_gogo on 17 Agustus 2009 20.43 mengatakan...

@berpikir makasih om..

@udin silahkan di coba

@asep terima kasih kembali...

My XDA Blogspot on 18 Agustus 2009 01.15 mengatakan...

seeep.... manteb nih tutorialnya...

hasilnya juga jozzz

Stories Funny Funniest Pictures on 18 Agustus 2009 04.42 mengatakan...

bgus jga ne buat pembelajaran

Desti on 18 Agustus 2009 04.46 mengatakan...

huaaaaah,,,aku dah lama bgt ga ngurus blog.
apa kabar nih teman blogger?
btw,,ajarin donk photoshop...

gema_gogo on 18 Agustus 2009 08.59 mengatakan...

@desti photosop saya gak begitu ahli, tapi kalo untuk urusan animasi saya ahlinya heheh... gak juga seh.

Go Blog on 18 Agustus 2009 18.45 mengatakan...

@ heeeeeeem mang flas bisa di taruh di blog yaaaa...

giamana caranya kang... ajarin dung di go blog niech..

gema_gogo on 18 Agustus 2009 18.49 mengatakan...

@Go Blog bisa kok,, kamu upload aja swf nya di tempat hosting, trus di embed di blogmu...

pinto mengatakan...

mantap... thanks ya... ini yg gw cari2 selama ini :D

pinto mengatakan...

boss gimana caranya kalau banyak gambar yg ditampilkan dalam satu layer tapi gambarnya bergantian secara bergilir..

misal:
gambar1 gambar2 gambar3

yg pertama berganti adalah gambar1.. setelah selesai baru gambar2 yg berganti dst sampai selesai baru balik lagi ke gambar1.. gmn ya boss??? thanks ^^

farid on 28 Februari 2010 05.35 mengatakan...

bagus banget bos

21johan on 17 Juli 2011 18.35 mengatakan...

mana mamang,, video flashnya kagak bisa terload..
nihil! ckck
thanks aja dah infonya,.,.

Posting Komentar

Silahkan memberikan Komentar, Top komentator akan saya Tampilkan Linknya di Blog saya.

NO SPAM PLEASE..

 

Award

Text

Plus44 Cyber Flash Comunity Copyright © 2009 Community is Designed by Bie