17
Dec

Contreng Silang

Written by admin


Berikut ini kita akan membuat animasi tanda contreng dan silang. Kita akan menggunakan Mask untuk membuatnya. Animasi ini bisa anda pakai pada kuis untuk memberitahu kepada user/pemain apakah jawaban yang dipilih benar atau salah.

Animasi Contreng

1. Buatlah sebuah flash document.

2. Klik kanan frame 2 dan pilih Insert Blank KeyFrame. Pastikan anda aktif di frame 2 lalu buatlah sebuah tanda contreng seperti gambar di bawah ini :

contreng1

3. Tekan sekali tombol Insert Layer pada timeline sehingga muncul layer baru bernama Layer 2. Klik kanan frame 2 Layer 2 dan pilih Insert Blank KeyFrame.

4. Pastikan anda aktif di frame 2 Layer 2 kemudian buatlah sebuah lingkaran berwarna merah. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan lingkaran sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

5. Letakkan movie clip lingkaran di frame 2 Layer 2 ini seperti gambar di bawah ini :

contreng2

6. Klik kanan frame 20 layer 1 dan pilih Insert Frame. Klik kanan frame 10 Layer 2 dan pilih Insert KeyFrame. Ubah bentuk dan letak movie clip lingkaran di frame 10 Layer 2 menjadi seperti gambar di bawah ini :

contreng3

7. Klik kanan frame 20 Layer 2 dan pilih Insert KeyFrame. Ubah bentuk dan letak movie clip lingkaran di frame 20 Layer 2 ini hingga menutupi seluruh tanda contreng seperti gambar di bawah ini :

contreng4

8. Klik kanan frame 2 Layer 2 dan pilih Create Motion Tween. Klik kanan frame 10 Layer 2 dan pilih Create Motion Tween. Klik kanan Layer 2 dan pilih Mask.

9. Tekan Ctrl+Enter untuk melihat hasilnya.

Animasi Silang

1. Buatlah sebuah flash document.

2. Tekan tombol Insert Layer sebanyak 4 kali sehingga muncul 4 buah layer baru masing-masing bernama Layer 2, Layer 3, Layer 4, Layer 5.

3. Klik kanan frame 2 Layer 2 dan pilih Insert Blank KeyFrame. Pastikan anda masih aktif di frame 2 Layer 2 kemudian buatlah sebuah garis miring seperti gambar di bawah ini :

silang1

4. Klik kanan frame 2 Layer 3 dan pilih Insert Blank KeyFrame. Pastikan anda masih aktif di frame 2 Layer 3 kemudian buatlah sebuah lingkaran berwarna merah.

5. Seleksi lingkaran ini lalu tekan F8. Pada panel yang muncul masukkan lingkaran sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

6. Atur letak dan besar movie clip lingkaran tadi seperti gambar di bawah ini :

silang2

7. Klik kanan frame 10 Layer 2 dan pilih Insert Frame. Klik kanan frame 10 Layer 3 dan pilih Insert KeyFrame.

8. Ubah bentuk dan letak movie clip lingkaran di frame 10 Layer 3 sehingga menutupi garis yang berada di Layer 2 seperti gambar di bawah ini :

silang3

9. Klik kanan frame 11 Layer 4 dan pilih Insert Blank KeyFrame. Pastikan anda masih aktif di frame 11 Layer 4 ini kemudian buatlah sebuah garis miring seperti gambar di bawah ini :

silang4

10. Pastikan garis yang anda gambar di frame 11 Layer 4 ini apabila digabungkan dengan garis yang ada di Layer 2 akan berbentuk tanda silang.

11. Klik kanan frame 11 Layer 5 dan pilih Inser Blank KeyFrame. Pastikan anda masih aktif di frame 11 Layer 5 ini kemudian tekan F11. Pada panel library yang muncul drag movie clip lingkaran yang ada di panel library ke dalam stage.

12. Atur letak dan bentuk movie clip lingkaran yang baru dikeluarkan dari panel library seperti gambar di bawah ini :

silang5

13. Klik kanan frame 2 Layer 2 kemudian pilih Copy Frames. Klik kanan frame 11 Layer 1 dan pilih Paste Frames.

14. Klik kanan frame 19 Layer 1 dan pilih Insert Frame. Klik kanan frame 19 Layer 4 dan pilih Insert Frame. Klik kanan frame 19 Layer 5 dan pilih Insert KeyFrame. Ubah ltak dan bentuk movie clip lingkaran di frame 19 Layer 5 menjadi seperti gambar di bawah ini :

silang6

15. Klik kanan frame 2 Layer 3 dan pilih Create Motion Tween. Klik kanan frame 11 Layer 5 dan pilih Create Motion Tween. Klik kanan Layer 3 dan pilih Mask. Klik kanan Layer 5 dan pilih Mask.

16. Tekan Ctrl+Enter untuk melihat hasilnya.

Sourcenya dapat di download di sini

Apakah tutorial di atas menarik atau bermanfaat bagi anda? Bantulah Warung Flash agar tetap ada dan memberikan tutorial-tutorial yang lebih bagus dan bermanfaat lagi. Silahkan klik link berikut ini untuk lebih jelasnya : Bantu Warung Flash



Bookmark and Share

17 Responses to “Contreng Silang”

  1. pokehack Says:

    thanks gan,,, sarapan yg enak bgt

  2. admin Says:

    Sama-sama B-)
    Silahkan mampir lagi :D

  3. ady Says:

    Mas… Kalau mau bikin teks berbentuk setengah lingkaran atau bentuk lain gimana ya? Tolong beri tutorialnya yaaa… :hope:
    Makasih… ;)

  4. agoez Says:

    selamat sore mas admin..

    hmm.. mau tanya apakah ada tutorial tentang meng-input data dari flash ke databse.. udah 3hari nyariin gak ketemu2,hingga akhir nya nemuin web yang keren gini,, =D>

    saya berharap sekali sama mas admin… :)

  5. admin Says:

    @ady
    Setengah lingkaran http://warungflash.com/2009/12/teks-mengelilingi-setengah-lingkaran/

    @agoez
    Maaf untuk database kami tidak mempelajarinya jadi tidak bisa membantu anda :respect: :respect: :respect:

  6. abu wahid Says:

    bgus……bikinin efek bunga ama daun tumbuh donk…
    dah ada belom….
    :-?
    :D
    :hope:

  7. karil Says:

    boleh juga jadi inspirasi.. berarti cara bikin orang berbentuk garis hampir sama ya kaya gini.. ;))

    om admin, kalo mw ikutan nyumbang tutorial ngrm na kemana?
    jadi nanti bisa om admin kulik + tampilin juga..

    thanks..

  8. admin Says:

    Silahkan kirim ke warungflash@gmail.com

  9. amar Says:

    thank maz!!!!or mbk!!!!!

  10. ims Says:

    om klo bikin animasi huruf dan di ujunk dikasi sound huruf tsbt gmn yah…? ajarin dunk..

  11. andhika Says:

    kk,.. q mau nanya ada gak artikel ttg animasi kartun orang yang matanya bisa bergerak sesuai dengan gerakan mouse,…?
    tolong diajarin donk…

  12. devi Says:

    mas ada tutorial buat orang jalan tapi yang kelihatan halus gitu mas,tolong, buat tugas sekolah….

  13. muhammadabduladhim Says:

    trima kasih atas semua ilmua, smoga bermanfaat, dan menjadi amal sholih..amin

  14. die Says:

    mas admin mau minta script22 kode pada flash boleh ga .?

    and ada ga ?
    kalau ada tlong mnta alamat buat downloadnya dong .please , pngen belajar nih mas ..
    :hope:

  15. litta pitta Says:

    warung flash…..

    pemadam kebodohan….. /keren

  16. yeni Says:

    warung flash memang ok bangetz….
    mw tanya donk…caranya nulis2 rumus matematika di flash gmana ya???????tlng di bantu donk..

  17. Putri Says:

    akhirnya bisa
    makasiiiiiiiihhh yaaaaaaaaaa /sarjana

Leave a Reply

B-) =DV <:-P ;)) ;) :yeye: :respect: :peace: :p :idea: :hope: :I: :D :-SS :-? :-/ :)) :) :(( 8-> more »

Komentar yang berisi pertanyaan atau request tutorial kemungkinan besar tidak bisa kami jawab dan penuhi. Hal ini dikarenakan kesibukan kami yang padat . Oleh karena itu kami mohon maaf dan pengertiannya.