14 Şubat 2010 Pazar

ImageReady İle Gif Yapmak

Ne zamandır bu tarz yazı hazırlamadığımı fark ettim ve hareketli bir gif’in nasıl yapılacağı hakkında fikir sahibi olmanıza yardımcı olacak bu yazıyı hazırlamaya karar verdim.
Adobe ImageReady ile nasıl gif hazırlayabiliriz bunu öğreneceğiz bu yazıda. ImageReady Photoshop ile beraber yüklenen bir program. Ben şuanda bu programın CS sürümünü kullanıyorum. Yeni sürümlerinde de ImageReady olması gerekiyor. Eğer bilgisayarınızda yüklü değil ise yükleyebilirsiniz. Aşağıdaki adımları sırasıyla yaparak gifimizi hazırlamaya başlayalım.

1. Adım

İlk olarak Photoshop‘u açın. Aşağıdaki resimde gördüğünüz gibi çalışmanızda hareketlendirmek istediğiniz her şeyi ayrı ayrı layerda hazırlayın. Resim veya istediğiniz yazıyı hareketlendirebilirsiniz. Ben burada 468×68px reklam alanı yapacağım. Sizde bu boyutlarda bir çalışma hazırlayabilirsiniz.  Aşağıdaki resime göre benim 3 tane yazı layerım, 3 tane(background layerı ile birlikte) resim layerım var.
1

2. Adım

Photoshop‘da çalışmanızı hazırladıktan sonra Araçlar (Tools) alanının en altında bulunan Edit in ImageReady butonuna basın. ImageReady açılacak ve bundan sonra ki çalışmayı burada gerçekleştireceğiz.
2

3. Adım

ImageReady açıldıktan sonra ilk bakmanız gereken Animation penceresinin açık olup olmadığıdır. Eğer sizde açık ise programın orta kısmına alın. Eğer açık değil ise Window>Animation‘dan aktifleştirebilirsiniz. Animation penceresi aşağıdaki gibidir. Üzerinde bulunan harfleri kısaca açıklayarak bu pencere hakkında bilgi sahibi olmanızı sağlayayım. Bu arada aynı zamanda Window>Layers sekmesinden de katmanları açın.
3
4
a-) Hangi katmanların ekranda kaç saniye görüntülenmesini istiyorsanız bu alandan ayarlayabilirsiniz. 0 se. yazan yere basılı tutarak bu süre üzerinde oynama yapabilirsiniz.
b-) Hazırladığınız çalışmanın önizlemesini bu butonlar sayesinde yapabilirsiniz.
c-) Tween ayarlarını yapmanızı sağlayan ekranı görüntüler.
d-) Yeni bir animasyon katmanı oluşturmanızı sağlar.
e-) İstediğiniz animasyon katmanını silmenizi sağlar.
f-) Daha ayrıntılı ayarlar yapmanızı sağlayan ekrana gider.

4. Adım

Şimdi işin en can alıcı noktasına geldik. Animation penceresi açık iken animasyonun başlangıcın da hangi layerların görüntülenmesini istiyorsanız onları görünür yapın. Aşağıdaki resimde 1 numaralı yerden bu layerların görüntülenme sürelerini ayarlayın. Ben 0,5 saniye olarak belirledim. Layer penceresinden de sadece bonus ve world logoları görüntülenmesini sağladım. 2 numaralı alanda hangi layerların görünür olduğuna dikkat edin.
5

5. Adım

Animation penceresinde aşağıdaki resimde gördüğünzü gibi Dublicate curret frame alanına tıklayarek bir nevi yeni bir animasyon frame’i oluşturun. Ardarda 3 defa bu butona basarak toplamda 4 adet frame oluşturun. 2., 3. ve 4. framelerin görüntülenme sürelerini birer saniye olarak değiştirin.
6
7

6. Adım

Son adım olarak devam edelim. Animation penceresinden 2. frame‘in üzerine tıklayın, ekranda görüntülenmesini istediğiniz layerı görünür yapın. Ben aşağıdaki gibi “REKLAM ALANI” yazan layerın görüntülenmesini sağladım. Aynı şekilde 3. frame’e gelin. “REKLAM ALANI” yazan layer eğer görünüyorsa görünmez yapın ve “YILLIK SADECE 1TL” yazan layerı görünür yapın. Aynı şekilde 4. frame gelin ve “KREDİ KARI GECERLİDİR” layerını görünür yapın, diğer yazı bulunan layerları görünmez yapın. Dikkat ettiyseniz bonus ve world resimleri için hiç birşey söylemedim. Çünkü onlar animasyonun her karesinde sürekli var. Çalışmanızı File>Save Optimized yolunu izleyerek .gif formatında kaydedebilirsiniz.
8
9
Çalışmanın en son hali aşağıdaki gibidir. Eğer çalışmanın kaynak dosyasını indirmek ve incelemek isterseniz buradan indirebilirsiniz.kaynak

Hiç yorum yok: