Kütüphane

Burada, görüp inceleyebileceğiniz, en azından size yeni ufuklar kazandıracak ve uzantısı fla olan dosyaları, animasyonlarınızda kullanacağınız birbirinden güzel sembolleri (clipart), ses dosyalarını ve çok değişik fontları bulacaksınız. Dosyaların çoğu zaten internette olan dosyalardır. Eğer sizinde elinizde paylaşmayı istediğiniz dosyalar varsa, bize gönderin hep birlikte paylaşalım.

Örnek .fla dosyaları

• Flash animasyonunuzun bir köşesinde tarih ve çalışan saat. Tarih_saat.zip - [3 KB]
• Basit bir araba yarışı nasıl yapılır, güzel bir animasyon. Loopracers.zip - [117 KB]
• İnanılmaz bir mouse efekti. Ancak çalıştıktan bir süre sonra hata veriyor. Pointingfollowers.zip - [8 KB]
• Gizli bir menü için gerekli olan animasyon. Gizlimenu.zip - [9KB]
• Mouse üzerine geldiğinde aşağı yukarı hareket eden bar. Scrollbars.zip - [4 KB]
• Hiyerarşik düzende bir menü örneği. Hiyerarşik menu.zip - [5 KB]
• Bazı animasyonlarınızda çok gerekecek bir şey, mouse pozisyonu. Mousepositing.zip - [4 KB]
• Flash'ta checkbox ve radio button nasıl hazırlanır? Checkbox.zip - [58 KB]
• Random komutu ile farklı alternatifler. Bunu mutlaka öğrenmeniz gerekir. Random.zip - [21 KB]
• Mouse'un açısını yerini bulup erkrana yazan bir animasyon. Mükemmel. Detectangle.zip - [5 KB]
• Bu oyunu mutlaka inceleyin çok şey öğreneceksiniz. Oyun.zip - [387 KB]

Animasyonlar için Değişik semboller (clip art)

• 3-D Semboller. Zip file - [179 KB]
• Anatomy ile ilgili çizimler. Zip file - [138 KB]
• Asortik çizimler. Zip file - [1530 KB]
• Kuşlar ile ilgili çizimler. Zip file - [25 KB]
• Çizgi filmle ilgili çizimler. Zip file - [84 KB]
• Kadın figürleri. Zip file - [558 KB]
• Dişli çarklar. Zip file - [12 KB]
• Halloween bayramında kullanılan nesneler. Zip file - [43 KB]
• Mükemmel helikopter çizimleri. Zip file - [29 KB]
• Müzik aletleri. Zip file - [71 KB]
• Mistik hava veren çizimler. Zip file - [82 KB]
• Ofis aletleri. Zip file - [14 KB]
• Sporla ilgili çizimler. Zip file - [30 KB]
• Star Wars kahramanları. Zip file - [681 KB]
• Seyehatle ilgili çizimler. Zip file - [14 KB]
• Ağaçlar. Zip file - [461 KB]

Flash ve Word ile 3B animasyon

Flash web dünyasında hızla ilerleyen bir standart, eğer flash açık kaynak olsaydı sanırım şimdiye dek tüm web tarayıcılar için bir standart haline gelirdi. Flash ile efekt oluştururken bir çok yan program da kullanılabilir, fakat ben bugün farklı bir alternatiften bahsetmek istiyorum.

Bildiğiniz gibi normalde Lightwave, 3D Studio Max ve Autocad gibi programlar kullanılarak 3B flash animasyonları hazırlanabiliyor, az sonra Word ile Flash'ı birlikte kullanarak 3B bir nesne oluşturacak ve bunu hareketlendireceğiz. Garip geldi değil mi?

Aslında çok basit bir mantığa sahip, okuduktan sonra ne kadar kolay olduğunu siz de göreceksiniz. (Bu arada bizim için önemli olan 3D çizim çubuğu olduğu için bu yaptıklarımızı Excel, Powerpoint vs. ile de yapabiliriz)

> Öncelikle, Word'ü ve Flash'ı açalım, Word menülerinden Görünüm/Araç Çubukları/Çizim'i açalım.

> Çok büyük olmayacak bir kare çizelim.

> Şimdi kareyi seçip alttan 3D bölümünü aktifleştirelim. (Sağ altta) Burada dikkat etmeniz gereken ana unsur, çizdiğiniz şeklin kenar boyutu ile 3D'nin nokta boyutunun bir birini tutması, aksi takdirde nesne hareketlendirmede bazı sorunlar çıkabiliyor.

> Evet, şimdi tasarımınıza göre bir renk ve yüzey kaplama seçeneğini aktifleştirip görünüm için son kontrolleri yapın. İşlem tamamlandıktan sonra nesneyi seçin ve Ctrl+C ile kopyalayın.

İşin en temel kısmını tamamladık, bundan sonrası çocuk oyuncağı ;) şimdi görev çubuğundan Flash'ı tıklayın ardından ilk sahnenin ilk çerçevesini seçin.

> Ctrl+V ile nesneyi yapıştırın.

Şimdi tekrar Word'e geçiyoruz,

> Nesne'yi çift tıklayın. Boyut sekmesini tıklayın ve döndürme için animasyonunuzun hassasiyetine göre bir açı girin, örneğin ben 5 derece kullanıyorum. Unutmayın derece azaldıkça animasyonun boyutu artacaktır. Fakat kalite ve yumuşaklık yükselecektir.

Bundan sonrası ingilizcede "maintance" Türkçe'de "hammallık" diye tabir edilen kısım,

Döngü: > Word'e dön açıyı 5 derece arttır, Ctrl + C > Flash'a dön sonraki çerçeveye açısı değişmiş şekli yapıştır.

Bu işlemi animasyon istediğiniz açıyı yakalayan dek sürdürün.

Bundan sonrası sizin hayal gücünüze ve yaratıcılığınıza kalmış ;) Unutmayın sadece kare kullanma zorunluluğunuz yok. 3B yapabildiğiniz her türlü nesne üzerinde Word/Flash ikilisini kullanarak 3B basit Flash animasyonları yapabilirsiniz.

Bu teknik ile kazandığınız avantajlar,

- Render derdi yok,
- Flash ve Word hemen hemen her tasarımcının bilgisayarında yüklü programlar,
- Diğer programların fiyatları çok yüksek ve sadece bu işler için alınabilecek programlar değiller.

Dezavantajlarımız,
- Çok kaliteli değil, kalite tasarımcının yeteneğine bağlı olarak ciddi anlamda değişebiliyor.
- İşin hammallığı sıkıcı olabilir, ama sonda elde edilecek şey bu sıkıntıyı unutturabilecek nitelikte.

Flash File Menüsü

New: Yeni bir proje açmaya yarar.

Open: Önceden yapılmış projeleri açmaya yarar.

Open as Library: Önceden tasarlanmış projelerde kullanılan
kütüphaneleri yeni projelerde de kullanmaya yarar.

Close: O anki projeyi kapatır.

Save: Projeyi saklamaya yarar.

Import: Projelerimize her hangi bir formatta yapılmış bir resim dosyası, daha önceden tasarlanmış bir projeyi, mov dosyalarını vb .

Export Movie: Film olarak çıktı almak için kullanılır.

Export İmage: Resim olarak çıktı almak için kullanılır.

Publish Settings: Burada Flash projemizin ekran görüntüsü için ayar yapmamızı sağlar.

Publish Preview : Yapılan ayarları test etmemizi sağlar.

Publish: Flash projemizi çalıştırır ve swf dosyası haline getirir.

Page Setup: Sayfa ayarları yapmamıza yarar.

Print Priview: Yazıcıdan çıkaracağımız belgenin ön izlenimini verir.

Print: Yazıcıya gönderme işlemine yarar.

Asistans: Çizgilerinizi düzenleştirmede,monitörünüzün çözünürlüğünü ayarlamada size yardımcı olur.

Flash Edit Menüsü

Undo: Yanlışlıkla yapılan işlemi geri almamıza yarar.

Redo: Yapılan işlemi bir ileri alma işlemine yarar.

Cut: İşaretlenmiş kısmı kesmeye yarar.

Copy: İşaretlenen kısmı kopyalamaya yarar.

Paste: Daha önceden copy veya cut işlemleri ile yapılmış işlemi yapıştırmaya yarar.

Paste in Place: Pano’nun içeriğini flash dosyanıza yapıştırır ve orijinal dosyaya bir bağlantı oluşturur.

Paste Special: İletişim kutusunda göreceğiniz seçenekler, panonun içeriğine göre farklılık gösterir.

Clear: Yapıştırılan belgeyi silmeye yarar.

Duplicate: İşaretlenmiş kısmın bir kopyasını yaratır.

Select All: Sayfadaki tüm nesneleri seçebilmemizi sağlar.

Deselect All: Seçili nesnelerin seçimlerini kaldırır.

Copy Frames: Timeline'da seçili olan frame'leri kopyalamanızı sağlar.

Paste Frames: Kopyalanmış frameleri, seçili olan frame'e yapıştırır.

Flash View Menüsü

Goto: İstenilen satıra gitmemize yarar.

Outlines: Çizilen karakterlerin dış çizgilerini verir.

Fast: Outlines’dan çıkmaya yarar.

Anatialias: Görünümde analitikliğini saglar.

Timeline: Timeline’ın görünüp saklanmasını sağlar.

Workarea: Çalışma alanının görünüp saklanmasını sağlar.

Rules: Cetvelini görünüp saklanmasını sağlar.

Grid: Sahnede yardımcı çizgilerin konulmasını sağlar.

Snap: Çizim yaparken bir çizgi ile diğer çizgiyi kolaylıkla birleştirmeye yarar.

Flash Control Menüsü

Play: Sahnemizin oynatılmasını sağlar.

Rewind: Sahnenin ilk frame’ine dönmeye yarar.

Step Forward: Adım adım ileriye götürür.

Step backward: Adım adım geriye götürür.

Test Movie: Fliminizi tüm sahneleriyle beraber test etmenizi sağlar.

Test Scene: Seçili sahneyi test etmenizi sağlar.

Loop Playback: İşletilen harekelerin hiç durmadan devam etmesini sağlar.

Play all Scenes: Bütün sahnelerin oynatılmasını sağlar.

Enable Frame Actions: Actionları aktifleştirir.

Enable buttons: Düğmeleri etkinleştirir.

Mute Sounds: Ses dosyalarını kapatır.

Flash Window Menüsü

New Window: Yeni pencere açmamıza yarar.

Arrange All: Bütün pencereleri tek pencerede gösterir.

Cascade: Pencereleri küçülterek ard arda sıralar.

Toolbar: Araç Kutusunun ayarlanmasını sağlar.

Inspector: Scenelerin müfettişliğini denetlemesini yapar onlar hakkında bilgi verir.

Controller: Kontrol tablosunun çıkmasına yarar.

Colors: Renk ayarlaması yapmaya yarar.

Output: Çıkışta verilerin alınmasına yarar.

Library: Kendi çalıştığımız penceredeki kullandığımız buton, movie vs. burada saklar.

Flashımızı Explorere Göre Ayarlamak

Flash movie'nizi Publish ettiniz. Fakat o da ne . Flash movienizin boyutu örneğin 400x300 piksel. Ve tarayıcı ekranında da bu boyutta gözüküyor. Oysa siz tüm browser ekranıı kaplamasını istiyorsunuz. İki adımda bu işi nasıl yapacağımızı kolayca öğreneceğiz.
BOYUTLAR
File>Publish Settings'i açıyoruz ve burda bulunan "Dimensions" seçeneğini "Percent" yapıyoruz.

Bu şu anlama gelir. Flash movie boyutlarını %100 yap ve tarayıcıyı kapla. Flash movie'nizi Publish ettiğinizde width ve height parametrelerinin %100 olduğuna dikkat edin.

Tabi yine isterseniz sizde bu değeri HTML kodda kendiniz girebilirsiniz.

Gün Isımlerini Türkçe Göstermek

Date.prototype nesnesini kullanark uzun döngü ve fonksiyonlara gerek duymadan gün isimlerini istedigmiiz dilde gösterebiliriz

sahnenin ilk frame ine su kodlari yazariz; Date.prototype.gunisimleri = function(dizi_olustur ) { return ["Pazar","Pazartesi","Sali","Çarsamba","Persembe","Cuma","Cumartesi"] [dizi_olustur] } zaman = new Date( ); gun = zaman.getDay( ); goruntule = zaman.gunisimleri(gun ); //sahneye bir dinamik textbox koyalim. degisken degeri; var:yazi olsun yazi = goruntule;

Buton Yapımı ve Kullanımı

1)
Şimdi ilk olarak rectangle(kare yapma) aracını seçiyoruz ve tool menüsünde options un hemen altındaki raunt rectangle aracını seçip bu değeri 10 yapıyoruz.(estetik görunmesi açısından olmasa da olur:) )

2) sahneye dış çizgisi olmayan iç rengi olan bir buton şekli çiziyoruz


3)Şimdi şeklimizi seçip F8 diyoruz ya da inster menüsünden new sembol diyoruz ve burada button seçeneğini işaretliyoruz name kısmına da buton yazıyoruz.


4)karşımıza bu şekilde bir ekran geliyor


Burada ilk olarak bilmeniz gerekenler timelineda gördüğünüz:

Up= butonun ilk halini gösterir hiç bir şeyle etkileşime girmemiş hali.

Over=imleç butonun sütüne geldiğinde görüneceği şekil

Down= butona basılınca görüneceği şekil yada yapacağı hareket

Hit= imleci butonun üzerinden çektiğimizde yapacağı işlem yada görüneceği şekil

evet şimdi devam edelim timeline da layer simini buton olarak değiştirelim ve sadece over kısmında 1 keyferme (anahtar kare)olan kısmı hit kısmına kadar F6 deyip birer keyferme ekleyelim şimdi over kısmına gelelim ve şeklimize tıklayıp herhangi bir renk verelim down kısmına da aynı rengi verelim bu sefer şeklimizi yukarı ve ileri ok tuşlarıyla 3 er pixel ileri alalım (yani 3 yukarı 3ileri ye basacağız) sonra hit kısmı up ile aynı şekilde duruyor olmalı bırakın ole dursun:)
buraya kadar butona imleç geldiğinde butonun neler yapacağını belirledik şimdi butonumuza bir isim verelim

5)yeni bir layer açalım buna da text diyelim;
burada yazı aracını seçip şeklimizin içine sığacak büyüklükte ana sayfa yazalım ve hit kısmına kadar F6 diyelim burada down kısmına gelelim yazımızı yukarıda yaptığımız gibi 3 er pixel yukarı ileri alalım yazı butonla hareket ediyormuş gibi görünsün diye



6)şimdi yeni bir layer açalım ve buna da ses ismini verelim down kısmına bir F6 ekleyelim


şimdi kütüphanemize bir ses ekleyeceğiz yapacağınız işlem File>import>import to library i seçin ve buton için uygun olan dong ding gibi bir ses seçin yoksa netten edinin. evet ses kütüphanenizde duruyor simdi ses layer ındaki down kısmına tıklatın ve kütüphanenizden sesinizi mouse�unuza basılı tutarak sahnede herhangi bir yere bırakın



7)simidi time line da ses layerında hit kısmına kadar uzanan bir çizgi göreceksiniz burada hit kısmına gelin ve
sağ tıklatıp remove deyin çünkü sesin sadece butona basıldığına çıkmasını istiyorum eğer isterseniz up over kısımlarına da ayrı-ayrı sesler ekleyebilirsiniz.
şimdi sahneniz bu şekilde görünmeli



8)şimdi burada scene1 e tıklayarak ana sahneye dönelim

şu an butonumuz hazır herkese hayırlı olsun :)

8)ama işimiz daha bitmedi şimdi butonumuza action script(a.s) kodu eklemeye geldi
şimdi F9 a basarak a.s panelimizi açalım
eğer çalışmamız da butonu time line üzerinde bir yere herhangi bir frame yönlendireceksek şu kodları yazıyoruz

on(press){

_root.gotoAndPlay(fream);
}




10)eğer herhangi bir siteye yönlendireceksek

a.s kısmına;
on (release){
getURL("site adı");
}



11)eğer bilgisayarımızdaki bir asp ya da html'e yönlendireceksek a.s kısmında;
on (release){
getURL("sss.asp");
}




Umarım anlatabilmişimdir arkadaşlar benden bu kadar hepinize iyi çalışmalar.

Su Efekti

Şimdi su efekti nasıl yaratılır bunu anlatmaya çalışacağım

İlk önce yeni bir documant sayfası açalım buraya aşağı da ki resmimizi (ctrl +r)diyerek import edelim ve propertiesten frame rete kısmını 13 yapalım


Sahnedeki resmimize tıklayaram F8 diyelim ve buradan movie clip butonu nu işaretleyelim



Şimdi kütüphanemizde duran movie clipimize çift tıklayalım ve karşımıza çıkan bardak resmine tıklayıp F8 diyelim name kısmını Picture_gr yapalım ve grafik butonu nu işaretleyelim sahnede yoksa kütüphane den sahneye alıp yapalım.



Şu an sahnede layer 1 isminde ve bir duruyor olmalı burada layer 1 in üstüne gelip sağ klik yapıp inster layer deyin ve 2 tane yeni layer oluşturun ve aşağıdaki gibi isimlendirin.



Şimdi main Picture yazan layer daki resmi mizi seçip ctrl+c diyelim ve üstünde bulunan Picture layerına tıklayarak 1 fream ı seçin ve buraya ctrl+v deyip yapıştırın şimdi bu kısım çok önemli bu işlemi yapmazsanız istediğimiz dalgalanma efektini veremeyiz Picture layerndaki resmimizi seçin 2 pixel ileri 2 pixel yukarı hareket ettirin(ok tuşlarına 2 ileri 2 yukarı diyerek yapabilirsiniz)

Şimdi geldik resmimizi maskelemeye water efeckt layer ına gelelim araçlardan rectangle tool aracını seçelim bununla resmimizi aşağıda ki şekilde kaplayacak uzun ince ve SIK(ne kadar sık ve ince o kadar iyi ) aralıklarla çizgiler çizeyim.


Resmimizin son hali


Şimdi bu işlemden sonra water efect katmanında 10. 20. ve 30. framelere F6 deyin


ve
1�10 arasında herhangi bir yere tıklayıp properties denetçisinden tween yazan yeri shape yapın uzayan yeşil bi ok göreceksiniz şimdi bunu 20. ve 30. framelereda uygulayın


Şimdi waterefect katmanına sağ klik yapıp mask ı seçin




Son olarak ta Picture ve mainPicture katmanlarını 30. freame gelerek F5 yapın



Ewet artık CTRL+ETER deyip çalışmamızın son halini

Açılır Menü

ilk olarak flash sayfamızı açalım rectrangle(kare yapım ®)aracını seçelim tools menüsünde options un hemen altında duran set corner radius�a tıklayalım ve bu değeri 12 yapalım Sahneye dış çizgisi olmayan bir kare çizelim text aracını seçip üzerine menü yazalım ve karemizi tamamen seçip F8 diyerek movie clip yapalım Şimdi menü movie clip imize çift tıklayarak içine girelim sahnede demin oluşturmuş olduğumuz menü karesi duruyor sahnedeki layerın ismini menü olarak değiştirelim bunun üzerine 2 tane daha layer ekleyelim ve sahnedeki layerların sıralaması aşağıdaki gibi olsun Şimdi mask katmanını seçelim ve buraya biraz sonra ekleyeceğimiz ana sayfa, galeri vs.. gibi butonları koyacağımız büyüklükte bir kare çizelim rengi önemli değildir çünkü bunu maskelemek için kullanacağız bunu f8 diyerek grafik yapalım şimdi geldik butonları yerleştirmeye ne kadar buton oluşturacaksanız o kadar layer oluşturun ve bu layerları mask katmanını altına çekin ben 3 tane buton oluşturacağım ve isimleri sırasıyla ana sayfa ,linkler ve galeri olacak son olarak en alta da bir layer eleyelim ve adına fon diyelim bu butonların arkasında bulunan zemin olacak buraya kadar yapılan işlem ve layerların sıralaması aşağıdaki gibi olmalı. Şimdi fon layer�ını seçip mask layerında çizdiğimiz kareden biraz daha ufak bir kare çizelim ama menü ile uyumlu bir renge sahip olsun ve bu çizdiğimiz kareyi menü yazısının üstüne taşıyalım aşağıdaki gibi olmalı Şimdi daha öncede yapmış olduğumuz butonları sahnedeki layerlarına yani ana sayfa butonunu ana sayfa layerına, linkler butonunu linkler layırına ama fon katmanın uzerinde bir yere yerleştiriyoruz(buton yapımı için daha önceki buton yapımı ve kullanımı adlı dersi inceleyin ) aşağıdaki gibi olmalı son şekli Şimdi gizli menüyü hareketlendirmeye geldi menü layerı hariç bütün layerlara F6 deyin menü layerın da ise 10 frame F5 deyin time line aşşaıdaki gibi olmalı Şimdi mask layerına gelin ve sağ kilik yapı mask seçeneğini seçin altındaki butonların bulunduğu layerları ve fon layer ını Mouse un sol tuşuyla çift tıklayın ve karşınıza gelen menüden masked seçenegini seçin Şimdi time line dan 5. frame geliyoruz sahnedeki action, Ana sayfa ve mask katmanını kilitliyoruz ve Mouse ile sahneyi tamamen seçip klavyeden aşağı ok tuşu ile seçtiğimiz butonlar ve fon katmanını aşağı indiriyoruz bunu yaparken sahneden kaybolduğunu göreceksiniz seçtiğiniz layerların şimdi mask katmanın üzerindeki kilitli işratinin yanındaki nokta yani gizli/ göster düğmesine tıklayın bi çarpı olmalı tıkladığınızda. Ve şimdi ana sayfa layer ına gelin ve timeline da sag klikleyin karşınıza gelen menüde en bastaki create motion tween e tılatın karşınıza pembemsi bir renkte ok gelecek bu işlemi diğer linkler, galerive fon katmanında da uygulayın --------------------------------------------------------- Şimdi time line çizgisini 0 ile 5 arasında oynatınca yukardan aşağıya inen menümüzü görüyoruz şimdi 10. freme gelelim menü layer'ı hariç bütün layerlara F6 diyelim ve demin yaptığımız gibi aşağıya taşıdığımız bütün layerları tekrara menü çubuğunun üstüne taşıylaım ve hepsine birer create motion tween ekleyin Şimdi geldi actionscript eklemeye acrions paneline gelelim 1. frame e tıklayalım F9 a basalım actions paneline stop(); komutunu ekleyelim 5. frame e de stop(); ekleyelim ve 10.frame gotoAndPlay(1); komutunu ekleyelim ve secene deyip ana sahneye dönelim şimdi işlemimiz daha bitmedi sahnede öylece çalışmayı bekleyen bir movie clip imiz var şimdi menümüzün bulunduğu layer ın üzerine bir layer daha oluşturalım ve adına da buton diyelim ve bir kare çizelim ve F8 le buton yapalım şekli şemali önemli değil sadece yaptığımız movie clip'i kaplasın yeter şimdi düğmemize tıklıyoruz ve properties denetçisin den color yazan yere tıklayın ve alpha değerini 0 yapın böylece buton sahnede görünmeyecek şimdi butonumuzu menü movie clip inin üzerine koyalım movie clip i tamamen kaplasın şimdi buton seçiliyken Actions panelini açalım (F9 ile ) ve şu kodları ekleyelim bu kısımda buton ve menü movi klip ini karıştırmamaya dikkat edin anlamak için propertiesten kontrol edin evet butona şu kodları yazalım on(release){ menü_mc.gotoAndPlay(5); }şimdi menü movi clip ini seçelim ve instance name ine menü_mc yazalım bunu yapmaz isek buton bu komutu hangi moviclipe uygulayacağını bilemez ve yaptığımız menü çalışmaz