Membuat Animasi Tata Surya Dengan Adobe Flash CS5

Tata surya merupakan sekumpulan objek yang berpusat pada Matahari dan terdiri dari sekumpulan planet-planet yang memiliki orbit-orbit mengelilingi matahari (yakni Uranus, Merkurius, Venus, Bumi, Mars, Jupiter, Saturnus, dan Neptunus) beserta bulannya masing-masing yang mengelilingi setiap planet dan semua objek yang berada di orbit matahari (seperti Asteroid, Komet, dan lain-lain).
Ada banyak cara untuk menganimasikan sebuah pergerakan planet dan satelitnya dari matahari yang kesemuanya menggambarkan tata surya. Salah satunya adalah dengan apa yang akan kita buat kali ini, yaitu memanfaatkan Drawing API pada Flash untuk menggambarkan komponen-komponen tata surya berupa matahari, planet, dan satelitnya. Selain itu untuk membuatnya beranimasi, kita akan melakukan update posisi relative planet dan satelitnya terhadap orbit berupa lingkaran dengan mengubah nilai rotation MovieClip/Sprite/Shape-nya masing-masing secara berkala dalam interval waktu tertentu sesuai nilai FPS, dengan mendefinisikan listener Event.ENTER_FRAME pada stage.
Pada Trik kali ini, kita akan coba menggambarkan matahari yang dikelilingi oleh satu planet dan satu satelit saja, dengan langkah-langkah pembuatannya sebagai berikut:

1. Buatlah sebuah file Flash baru dengan fitur ActionScript 3.0. Caranya klik menu File > New > General > ActionScript 3.0.
2. Klik Menu Modify > Document.
3. Untuk memberikan kesan Animasi ini berlatar belakang luar angkasa, ubah warna document menjadi gelap.
4. Pada panel Properties, tuliskan TataSurya di kolom Document Class. Tekan Enter pada Keyboard, bila muncul warning maka abaikan saja, karena file berisi definisi class-nya baru akan kita buat berikutnya.
5. Klik menu File > Save As. Simpan dengan format FLA.
6. Buat sebuah file Flash baru dengan fitur ActionScript 3.0 dengan mengklik File > New > General > ActionScript File.
7. Tuliskan Script berikut ini pada File:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117

package { import flash.display.*; import flash.events.*;   public class TataSurya extends MovieClip { private var matahari:Sprite = new Sprite(); private var bumi:Sprite = new Sprite(); private var bulan:Shape = new Shape();   public function TataSurya() { matahari.graphics.beginFill(0xFFCC00); matahari.graphics.drawCircle(0,0,40); matahari.graphics.endFill(); matahari.graphics.beginFill(0x000000); matahari.graphics.drawCircle(-10,-10,5); matahari.graphics.drawCircle(10,-10,5); matahari.graphics.endFill(); matahari.graphics.lineStyle(0,0x000000); matahari.graphics.moveTo(-20,10); matahari.graphics.curveTo(0,20,20,10); matahari.graphics.lineStyle(0,0x555555); matahari.graphics.drawCircle(0,0,120);   bumi.graphics.beginFill(0x0099CC); bumi.graphics.drawCircle(0,0,20); bumi.graphics.endFill(); bumi.graphics.lineStyle(0,0x333333); bumi.graphics.drawCircle(0,0,30);   bulan.graphics.beginFill(0xCCCCCC); bulan.graphics.drawCircle(0,0,5); bulan.graphics.endFill();   this.addChild(matahari); matahari.x = 275; matahari.y = 200;   matahari.addChild(bumi); bumi.x = 120; bumi.y = 0;   bumi.addChild(bulan); bulan.x = 30; bulan.y = 0;   stage.addEventListener(Event.ENTER_FRAME, orbit); }   private function orbit(evt:Event):void { matahari.rotation += 1; bumi.rotation += 5; bulan.rotation -= 10; } } }

8. Klik menu File > Save As, simpan file kedua ini dengan nama TataSurya.as pada folder yang sama dengan kita menyimpan file FLA (cara ke 5) sebelumnya.
9. Lakukan test Movieclip sebelumnya untuk melihat hasilnya, klik menu Control > Test Movie atau dengan menekan shortcut Ctrl+Enter pada Keyboard.
10. Hasilnya sebuah Animasi Bulan mengelilingi planet dimana disaat yang sama planet tersebut pun mengelilingi matahari.

Tutorial di atas juga berlaku untuk versi photoshop di bawah CS5. Bagi yang ingin mendapatkan Source File tutorial Adobe Flash CS5 di atas bisa meng-unduh-nya Disini


Refrensi

Read More

Membuat Aplikasi WebCam Dengan Adobe Flash CS5

Hampir semua laptop yang ada sekarang memiliki fitur webcam sebagai bawaannya. Seberapa sering kita memanfaatkannya? Aplikasi Online yang menyediakan Live Streaming webcam pun rupanya tidak jauh berbeda halnya dengan aplikasi streaming video, dimana sebagian besar menggunakan Flash sebagai platformnya. Hanya saja untuk mentransmisikannya, diperlukan Flash Media Server atau alternatifnya, Red5.
Pada flash kita dapat menembus kamera dengan cara membuat objek sebuah camera, kemudian dengan methodgetCamera() gambar yang ditangkap oleh kamera di komputer kita menjadi sebuah live video. Nah, untuk melihat hasil video tersebut secara local (tanpa melalui koneksi streaming), kita dapat meng-attach –nya di sebuah objek movie yang kita buat. Langkah-langkahnya adalah sebagai berikut:

1. Buat sebuah file flash baru dengan action script 3.0. Caranya klik menu File > New > General > ActionScript 3.0. 
2. Pada panel, Properties tuliskan Webcam di kolom document class. Bila muncul warning abaikan saja, karena definisi class ini akan kita buat nanti. 
3. Simpan file flash ini, klik menu File > Save As.
4. Buatlah sebuah file ActionScript eksternal yang mendefinisikan class dokumen kita, caranya klik menu File > New > General > ActionScript File. 
5. Tuliskan Script berikut pada pada file ActionScript tersebut:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

package {     import flash.display.Sprite;     import flash.media.Camera;     import flash.media.Video;     public class Webcam extends Sprite     {         private var webcam:Video = new Video();         private var camera:Camera;         private var camQuality:int = 80;         private var fps:int = 30;         public function Webcam():void {             webcam.width = 640;             webcam.height = 480;             camera = Camera.getCamera();             camera.setQuality(0, camQuality);             camera.setMode(webcam.width, webcam.height, fps);             webcam.attachCamera(camera);             this.addChild(webcam);         }     } }

Perhatikan code diatas, disini kita men-settings ukuran video pada layar sebesar 640 x 480 dengan kualitas 80, dan nilai FPS sebesar 30. Sederhana bukan?

6. Klik menu File > Save As. Simpan file ini dengan nama Webcam.as pada folder yang sama dengan tempat kita menyimpan file Flash sebelumnya.
7. Sekarang kembali ke File Flash untuk mengecek settingan publish, dan kemudian mem-publisnya. Klik menu File > Publish Settings. 
8. Checklish pilihan HTML untuk mendapatkan hasil SWF yang di embed ke sebuah file HTML, agar kita dapat melihat hasilnya nanti melalui web browser. 
9. klik pilihan publish, atau tekan Shift+F12 pada keyboard. 
10. lihat file HTML yang keluar, buka file ini dengan web broser yang kita punya. Jika sukses, maka pada awal tampilan Flash keluar akan menunjukkan sebuah dialog konfirmasi , ini muncul karena Flash Player memiliki prosedur standar untuk menjaga keamanan dan privasi dimana pada flash movie ini kita mencoba untuk meng-akses kamera webcam yang ada di komputer. Klik Allow untuk melanjutkan. 
11. Akhirnya, wajah anda yang tersorot webcam pun muncul di browser jika anda memiliki fasilitas Cam. 

Bagi yang ingin mendapatkan Source File secara lengkap bisa di download: Disini.

Refrensi

Read More

Menampilkan Status Twitter Dengan Adobe Flash CS5

Widget Status Twitter memang sudah tersedia dari situs resminya untuk bisa digunakan dalam website, tetapi Widget tersebut berupa susunan JavaScript dan HTML. Bisakah kita membuatnya berbeda? Seperti membuatnya dalam bentuk Flash?

Kita dapat meng-akses tweet terakhir dari satu user twitter dengan meng-akses  URL: http://twitter.com/status/user_timeline.xml?screen_name=nama_usernya. Twitter kemudian akan mengirimkan data dari nama user yang kita tuliskan tersebut dalam bentuk XML. Tentu dengan catatan bahwa user yang kita akses tweet-nya tersebut tidak mengeset timelinenya sebagai Private.
Sebelum melakukan data dengan paring XML, kita perlu terlebih dahulu mengetahui struktur data yang didapatkan dari twitter. Untuk mengambil data berupa tweet saja, maka yang kita perlukan hanya data yang terdapat dala tag <text>, dimana struktur sederhananya dapat kita gambarkan sebagai berikut (element tag lain yang tidak kita perlukan saat ini digambar sebagai titik-titik).
Langsung saja ikuti langkah-langkah berikut ini:

1. Buat sebuah file flash baru, dengan fitur ActionScript 3.0, dengan meng-klik menu File > New > ActionScript 3.0. 
2. Dengan menggunakan Text Tool buatlah sebuah  dynamic text pada stage area kerja. 
3. Dengan type text sebagai dynamic text, berikan sebuah istance name dengan nama tweet_txt. 
4. 4. Buatlah sebuah layer baru untuk tempat kita menyimpan ActionScript pada timeline (ActionScript 3.0 masih memperbolehkan kita untuk menyimpan script di timeline!). 
5. Klik kanan pada Frame pertama dari layer baru yang kita buat tadi, kemudian pilih menu Actions untuk memunculkan panel Actions.
6. Setelah panel Actions muncul, tuliskan script berikut:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35

var namaUser:String = "andreaadelheid";   var jmlTweet:uint = 7;   var twitterXMLLoader:URLLoader = new URLLoader();   &nbsp;   twitterXMLLoader.load(new URLRequest("http://twitter.com/statuses/user_timeline.xml?screen_name="+namaUser));   twitterXMLLoader.addEventListener(Event.COMPLETE, parseXML);   &nbsp;   function parseXML(e:Event):void   {   var twitterXML:XML = new XML(e.target.data);   for(var i:int=0; i<jmlTweet; i++)   {   if(i == 0) {   tweet_txt.text = "";   }   tweet_txt.appendText(twitterXML.status[i].text + "nn");   }   }

Pada script ini kita akan mencoba meng-akses 7 tweet terakhir dari user @Tunicko yang beralamat di http://twitter.com/andreaadelheid

1. Simpan file flash ini dengan cara meng-klik menu File > Save As…
2. Untuk melihat hasilnya, lakukan test movie. Klik menu Control > Test Movie atau tekan shortcut Ctrl+Enter pada Keyboard.
3. Jika komputer kita terkoneksi dengan internet, setelah proses load XML dari akses twitter selesai, maka secara otomatis timeline dari user @andreaadelheid akan tampil pada Flash movie yang kita buat. Untuk meng-akses user lain, kita tinggal mengubah variable “namaUser” pada script yang kita buat sebelumnya.

Penting:
Twitter hanya memperbolehkan 150 request perjam dari sebuah server. Jadi harus digunakan berdasarkan ketentuan yang telah dibuat Twiter. Tutorial diatas juga berlaku untuk versi Adobe Flash di bawah CS5.

Bagi anda yang ingin source code tutorial ini silahkan di unduh: Disini.

Refrensi

Read More

Membuat Bintang Berkelip Dengan Adobe Flash CS5

Pemandangan malam hari yang dikelilingi kerlipan bintang  akan membuat atsmosfer semakin indah. Mungkin anda pernah melihat hal seperti itu didalam banner flash website-website tertentu. Dalam tutorial kali ini akan dibahas cara pembuatan kerlipan bintang pada Adobe Flash CS5. 

1. Siapkan sebuah foto pemandangan malam hari. Buat document baru dan pilih New > Flash File (Action Script 3.0). 
2. Import foto pemandangan yang sudah dipersiapkan, pilih File > Import to Stage (Ctrl+R). 
3. Tekan Ctrl+J untuk membuka properties. Selanjutnya, sesuaikan dimensi gambar yang Anda persiapkan dengan background. 
4. Tahap berikutnya, buat bintang dengan menggunakan Polystar Tool. Dalam Adobe Flash, pembuatan Shape Tool terbagi menjadi 5 pilihan. Pilihan Polystar Tool dengan menekan dan menahan RectangleTool dan pilih Polystar Tool. 
5. Selanjutnya, tekan Options pada Properties dang anti Style dari polygon menjadi Star. Ubah jumlah pada Number of sides menjadi 4. 
6. Jika sudah, ubah gambar seperti gambar dibawah ini. 
7. Pilih gambar bintang kemudian klik kanan Convert to Symbol  > Movie clip (tekan F8). Ganti nama symbol menjadi “kerlipan 1”. 
8. Sekarang klik dua kali pada gambar bintang dan Anda akan memasuki ruang kerja movie clip kerlipan 1. Klik kanan pada keyframe pertama dan pilih Create Motion Frame. 
9. Ganti color pada tab properties menjadi Alpha. Ubah presentasenya hingga mencapai angka 0%. Namun, sebelumAnda harus mengklik gambar bintang tersebut agar tab Properties muncul. 
10. Klik kanan frame ke-10 dan pilih Insert KeyFrame. Ganti presentase hingga mencapai 100%. 
11. Ulangi langkah nomor 9, tetapi kali ini pada frame ke 20.
12. Tahap berikutnya, pindahkan ruang kerja movie clip ke Scene1. Buat layer baru dan ulangi langkah 4 sampai 10 dengan catatn di Frame 1 (alpha=100%), Frame 10 (alpha 0%), dan frame 20 (alpha 100%). Anda dapat membuat variasi kerlipan sesuai dengan keinginan. Semakin banyak variasi kerlipan, akan semakin indah. 
13. Kembali pada Layer 1, tekan F5 pada Frame ke-40. 
14. Drag kerlipan-kerlipan yang sudah dibuat pada tab Library. Semakin banyak kerlipan yang dimasukkan, akan semakin indah. Anda bebas meletakkan kerlipan pada gambar.
15. Ukuran erlipan sebaiknya tidak sama satu sama lain. Anda dapat mengatur kerlipan dengan cara meng-klik icon Free Transform Tool atau dengan menekan Q atau F. Simpan dan coba Movienya (Ctrl+Enter).

Perlu diperhatikan bahwa tutorial diatas juga masih bisa dicoba dalam Adobe Flash CS2, CS3, dan CS4. Klik disini untuk melihat hasil tutorial: kerlipan bintang.

Refrensi

Read More

Membuat Efek Film Lama Dengan Adobe Flash

Di awal-awal kemunculannya pertama kali, gambar yang di hasilkan TV mempunyai corak tersendiri. Pada saat itu TV tidak menghasilkan berjuta warna yang sesuai dengan aslinya. Dalam artikel kali ini, akan kita bahas cara membuat efek gambar TV pada awal kemunculannya dengan Adobe Flash.

1. Siapkan sebuah gambar atau foto, Agar efek terlihat indah, gambar atau foto sebaiknya berwarna hitam putih. Buat dokumen baru dan pilih New > Flash File (Action Script 2.0). 
2. Tekan Ctrl+J untuk membuka document properties. Selanjutnya, ganti ukuran background menjadi 640×480 dan ganti warna background menjadi berwarna hitam.
3. Import gambar atau foto yang sudah disiapkan, klik File > Import to Stage (Ctrl+R). 
4. Tahap berikutnya, buat grain atau gangguan kecil yang ada pada gambar televisi tua. Buat layer baru terlebih dahulu. Pilih Pencil Tool kemudian gambar setengah lingkaran.
5. Buat minimal tiga gambar setengah lingkaran agar efek yang dihasilkan semakin indah. Usahakan menempatkan gambar setengah lingkaran, tidak beraturan.
6. Sekarang pilih salah Satu gambar kemudian klik kanan > Convert to Symbol > Movie Clip (F8). 
7. Tekan F9 setelah salah satu gambar terpilih menjadi Movie Clip. Berikutnya, isikan script di bawah ini.

   onClipEvent (enterFrame) {
   _x = random (640);
   _y = random (460);
   _rotation = random (360);
   _alpha = random(100);
   _xscale = nue;
   _yscale = nue;
   nue = random (65);
   }

8. Ulangi langkah ke 6 dan ke 7 untuk dua gambar yang tersisa.
9. Buat garis dengan Line Tool agar kesan yang di ciptakan semakin indah.
10. Pilih Garis yang sudah dibuat dan tekan F8 untuk membuat Movie Clip.
11. Tekan F9 untuk membuka Action Script dan isikan script dibawah ini.

    onClipEvent (enterFrame) {
    _x = random (640);
    _alpha = random(15);
    }

12. Save atau simpan dan cobalah Movie-nya dengan menekan short cut Ctrl+Enter. 

Hasil tutorial diatas dapat di kombinasikan dengan Adobe After Effect untuk membuat berbagai macam hal menarik lainnya dalam meng-edit film. Sedikit tambahan dari penulis, bahwa tutorial diatas saya coba menggunakan Adobe Flash CS5, tetapi tidak tertutup kemungkinan cara yang sama juga bisa dilakukan oleh versi dibawahnya seperti Adobe Flash CS2, CS3, dan CS4.
klik disini untuk melihat contoh tutorial: TV Lama

Refrensi

Read More

Free Download Adobe Photoshop CS3 | Full Version With Crack

 

Adobe Photoshop CS3 merupakan perangkat lunak pengolah foto terbaru yang sangat powerful. Perangkat lunak ini akan meningkatkan nilai artistik dan kualitas gambar dengan baik dengan tetap memegang keaslian sebuah foto.

Adobe Photoshop CS3 memuat semua fitur yang Anda sukai dalam Photoshop CS2, jadi semua fitur yang ada pada versi sebelumnya tidak akan hilang. Photoshop CS3 mempercepat kurva (path) dari imajinasi untuk image. Photoshop CS3 ini sangat ideal untuk fotografer, desainer, dan standar profesional seperti perataan layer secara otomatis dan teknik pencampuran komposisi secara “advance”.

Ideal untuk:

• Fotografer (fotographer)
• Perancang Grafik (graphic designer)
• Perancang Web (web designer)
• Penyedia layanan cetak (print service provider)

Dengan melihat kelebihan fitur-fitur yang ditawarkan, kita bisa membuat gambar secara 3D. Jadi kita tidak perlu lagi menginstal program 3D lainnya. Cukup menggunakan Adobe Photoshop Cs3 Extended.

Adobe Photoshop CS3 Postingan kali ini sangat mudah di gunakan anda tidak perlu meng instal di PC, dan kapasitasnya pun tidak terlalu berat cuma 60 Mb.

Setalah anda download File Adobe Photoshop CS3 nya, dan extract File Zip dengan menggunakan Pasword yang sudah saya berikan. dan setalah itu Copy Folder Adobe Photoshop CS3 ke :  C: / Program Files / Adobe Photoshop. Dan kemudian membuat cara pintas ke photoshop.exe di dalam folder itu dan meletakkannya di desktop Anda.

Ini adalah FULL Adobe Photoshop CS3 dalam paket 60Mb … It is NOT PORTABLE, Dan  FULL VERSION.
Download Adobe Photoshop CS3 Disini

Password Mediafire : labkomputerku


Refrensi

Read More

Efek Transformasi dengan Blend Tool | Adobe Illustrator Tutorial

Mungkin banyak dari kita yang sudah tak asing dengan film Transformer. Beberapa tokoh di film tersebut berasal dari kendaraan yang kemudian berubah menjadi robot. Nah, pada tutorial yang sederhana kali ini, kita akan belajar melakukan hal yang sama, yaitu melakukan transformasi dari bentuk kepiting menjadi kepala panda. Bagaimanakah caranya? Mari kita simak tutorialnya.
Pertama-tama kita buka halaman kerja baru pada Adobe Illustrator. Setelah itu membuat objek baru. Kali ini, saya membuat objek baru yang sederhana, berasal dari objek dasar dan beberapa kali bentukan dari pen-tool. Jadilah sebuah gambar silouet berbentuk kepiting dan kepala panda.
Mungkin muncul pertanyaan, “Mengapa Silouet”? Hal ini dikarenakan keterbatasan dari Illustrator sendiri yang hanya mampu membuat transformasi objek (lewat Blend Tool) sederhana. Anda bisa sebenarnya apabila memadukan objek yang rumit, hanya saja hasilnya tidak akan begitu menggembirakan.

Sesudah membuat objek yang diinginkan, maka kita harus menyeleksi salah satu objek untuk digabungkan. Karena sebaiknya objek tersebut menjadi satu dan tidak terdiri atas beberapa bagian yang berbeda.

Nah, garis-garis yang ada pada bagian ini menunjukkan bahwa objek tersebut masih belum menjadi satu. Untuk menggabungkannya, kita bisa menggunakan “Pathfinder”, yang dapat dipanggil melalui menu “Window”.

Setelah semua objek tadi ter-seleksi, maka kita bisa segera menyatukannya dengan memilih funsi pertama pada “Shape Modes”. Setelah itu pilih “Expand” untuk menyatukan beberapa objek tadi menjadi satu bagian.

Nah, objek pun sudah menjadi satu. Lakukan hal yang sama pada objek satunya agar mendapatkan dua objek yang utuh.

Setelah mendapatkan dua buah objek yang tunggal, maka sekaranglah saatnya melakukan transformasi. Caranya, seleksi kedua objek tersebut. Anda sebaiknya memberi jarak yang cukup agar nantinya bisa memuat banyak objek.

Setelah menyeleksi kedua objek tersebut, pilihlah Object –> Blend –> Blend Options

Lalu akan muncul opsi seperti berikut ini. Untuk contoh kali ini saya memilih Specified Steps dengan value “3″ yang menandakan berapa jumlah objek tambahan yang akan muncul, lalu orientasi di sebelah kiri.

Setelah itu, kita melakukan langkah terakhir, yaitu Blend -> Make ( atau Alt + Ctrl + B) Untuk membuat objek tambahannya.

Nah, objek transformasi pun sudah jadi. Terlihat disana bahwa bentuk silouet dari kepiting perlahan-lahan berubah menjadi kepala panda secara otomatis. Tentu saja dengan memperbanyak jumlah value pada steps, transformasinya akan semakin halus. Hal ini juga menjadikan jarak antar objek yang sempat saya singgung menjadi penting karena jika terlalu berdempetan, maka objek akan tertumpuk.

Anda bisa memainkan transformasi dengan objek yang berbeda warna maupun mengubah letaknya seperti yang ditampilkan pada contoh di bawah ini. Untuk mengubah letaknya cukup drag & drop layaknya melakukan pemindahan objek pada umumnya dengan “selection tools” (berbentuk panah putih). Disini saya juga memperbanyak jumlah value steps-nya menjadi 5.

Tentunya dari contoh yang sederhana ini Anda bisa mencoba melakukan transformasi pada objek yang lebih rumit. Ketika Anda ingin menjadikan beberapa objek, Anda bisa menggunakan Object –> Expand.
Selamat bereksperimen

Read More