flash animation etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
flash animation etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

17 Mart 2012 Cumartesi

Flash CS5 Türkiye Haritası Animasyonu Resimli Anlatım

Flash Mask Layer Örnek Çalışması:
Bu yazımda Flash CS3, CS4 ve CS5 versiyonlarında uygulayabileceğiniz basit bir maskeleme uygulamasını anlatmaya çalışacağım . Tüm işlemleri adım adım resimlendirerek göstermeye çalıştım. Oldukça basit bir animasyon. Frame By Frame animasyon tekniğine dayanıyor. Kodlama gerektiren bir durum yok. Sadece son frameye animasyon dursun diye bir ActionScript kodu koydum. Animasyon ekrana basit bir Türkiye haritası çizmektedir. Şimdi adım adım bu animasyonun nasıl yapıldğını görelim.


Adım 1:
İlk önce internetten basit bir Türkiye haritası bulun.
türkiye haritası
Adım 2:
Flash programınızı başlatın ve boş bir Flash dokumanı oluşturun AS2 veya AS3 olması fark etmez.
Flash açılış sayfası
Adım 3:

Haritanızı Üst menüden File > Import > Import to Stage yolunu izleyerek çalışma alanınıza yükleyin ve boyutlarını ayarlayın.
Flash Import

 Adım 4:
 Resmin tamamını seçin ve klavyeden CTRL+B ya da Üst menüde Modify >Break Apart yolunu izleyerek resmin pixellerine ayrılmasını sağlayın.
Flash Break Apart Resmi piksellerine ayırma
 Resim şekilde görüldüğü gibi seçili hale gelecektir.

 Adım 5:
 İlk önce resimdeki gibi Laso Tool’a ardında toolbarın alt kısmında olan Magic Wand’a tıklayın ve ardından harita resmindeki gri noktalı alanlara tıklayın ve seçili hale getirin. Ardında del tuşuna tıklayarak tüm gri alanları temizleyin. Geriye bir tek haritanın çizgileri kalsın. Eğer vektörel bir resimle çalışıyorsanız muhtemelen bu işlemi yapmanıza gerek yok. Burada amaç haritanın çizgilerini Falsh çalışma ortamında resimden ayırmak. Dilerseniz Çalışma alanının arka planını başka bir renkle renklendirip beyaz kısımları Eraser Tool ile silebilirsiniz .Dediğim gibi amaç geriye sadece sınır çizgilerinin kalması.

Flash Magic Wand

 Adım 6:
 Haritamızın bulunduğu layera maske ismini verin ve cizim isimli yeni bir layer oluşturup maske layerının altına koyun.

Flash Layer  Ekleme

Adım 7:

Maske layerının üstüne gelip farenin sağ tuşuyla tıklayın ve açılan menüden Mask seçeneğini seçin. Harita resmi kaybolacaktır. Cizim isimli layerın satırında bulunan kilit resmine tıklayarak haritayı görünür hale getirin.

Flash Layer Kilidini Açmak


 Adım 8:
 Maske layerında “Show Layer as Outlines” adlı minik yeşil bir kutucuk var. Sizin çalışmanızda bunun rengi başka olabilir. O kutucuğa tıklayarak içindeki rengin kaybolmasını sağlayın. Böylece haritamızın sınır çizgilerinin içi boşalacak sadece bu çizgilerin kenarlıkları görüntülenecektir.

Flash Show Outlines


Adım 9:
Tekrar cizim layerına dönüyoruz ve soldaki araç kutusundan Brush tool’u seçiyoruz. İstediğimiz bir rengi seçebiliriz.Bruaya kadar yaptıklarımız resmi ve animasyona kılavuzluk edecek olan çizgileri belirlemekle ilgiliydi. Bu adımdan sonra animasyonumuz oluşturmaya başlayacağız. Çizim layerındayken klavyeden F6 tuşuna basın ve yeni bir frame oluşturun haritanın istediğiniz bir kısmına zoom yapın. Burası başlangıç noktanız olacak. Brush tool ile harita çizgisinin minik bir kısmını boyayın ve ardından tekrar F6’ya basarak yeni bir layer oluşturun. Bunu her layerda tekrarlayarak tüm harita çizgilerini boyayın. Boyadığınız çizgilerin kesişmemesine dikkat edin.

Flash Painting

 Adım 10:
 Tüm boyama işlemi tamamlandığında harita aşağı yakarı şu şekilde olmalıdır. Frame By Frame animasyon biraz uzun sürebilir ama ne kadar çok parça yaparsanız animasyonunuz o kadar güzel ve gerçekçi olur. Artık Üst menüden Control > Test Movie > in Flash Proffessional yolunu takip ederek animasyonunuzu  test edebilirsiniz.

Flash Masking Layer


 Adım 11:
Son olarak bir layer ekleyn ismini actionscript olsun. En son Frame üstüne gelip F6 tuşuna basın. Böylelikle bu Frame bölünmüş olur. Klavyeden F9 tuşuna basıp Action-Frames isimli paneli açın ve şu kodu yazın  " stop(); ” bu kod flas animasyonun yazıldığı karede durmasını sağlar.  ActionScript kodu son kareye(frame) yazıldığı için animasyon son karede duracaktır.

Flash ActionScript
Böylelikle animasyon tamamlanmış oluyor. Aşağıda animasyonun tamamlanmış hali gif formatında görülmektedir. muhtemelen flash versiyonu daha hızlı işliyor. burada sadece bittiği zaman neye benzemesi gerektiğini göstermek için koydum.

Türkiye Haritası Animasyonu

 Bu çalışmanın örnek FLA dosyasını ayrıca şu linkten indirebilirsiniz. 



8 Haziran 2011 Çarşamba

Flash Yıldız Gezegen Animasyonu Ver. 1.01

Daha önce yapmış olduğum yıdız gezegen animasyonunu biraz daha geliştirdim. Flash animasyon tekniklerini öğrendikçe yaptığım çalışmaları buradan sergilemeye devam edeceğim.

Eğer animasyon görüntülenmiyorsa bilgisayarınızın DNS numaralarını değiştirin. İsterseniz şu numaraları kullanabilirsiniz:

64.81.79.2
128.107.241.184



2 Eylül 2010 Perşembe

Flash Yıldız-Gezegen Animasyonu


Flash ile yapılmış basit bir animasyon. Yıldız ve gezegen yüzeyini Photoshop'ta yaptım. Belki inanmayacaksınız ama yıldız yüzeyi kumdan üretildi. Photoshop'la sınırsız tasarım yapma imkanına sahipsiniz. Kullanımı da çok kolay. Ben ki daha bu işin başındayım, sonucu görüyorsunuz.

Eğer animasyon görüntülenmez ise bilgisayarınızın DNS numaralarını değiştirin. Şu DNS numaralarını kullanabilirsiniz.

64.81.79.2
128.107.241.184