Animasyonlu "gif" olusturalim

Web sayfalarının vazgeçilmez unsurlarından biri tabii ki animasyonlu GIF dosyaları. Bir seri GIF dosyasının üst üste getirilerek oynatılmasından oluşan animasyonlu GIF' ler web sayfasında aktif içeriği sağlamak için kullanılabilecek ilgi çekici ve basit bir teknik. Peki Animasyonlu GIF yapmak için neye ihtiyaciniz var? Kullanabileceginiz programlar neler?  Animasyonlu GIF yapmak için önünüzde bir çok seçenek var. Animagic, GIF Constructor, Animator Pro, Microsoft GIF Animator gibi programlar bunlardan sadece birkaç tanesi. Simdi bu programlardan

www.microsoft.com/imagecomposer/gifanimator/gifanin.htm <http://www.microsoft.com/imagecomposer/gifanimator/gifanin.htm> adresinden indirebileceginiz Microsoft GIF animatori tanitacak ücretsiz ve kullanimi basit olan bu program ile bir animasyonu nasil olusturacaginizi anlatacagiz…  Programi çalistirdiginizda ve bir GIF dosyasini açtiginizda karsiniza her bir kareyi görebileceginiz bir alan ile birlikte animasyonun akisini ve karakterini belirleyebileceginiz üç adet sekme gelecektir. Programda bir menü bulunmuyor fakat üstteki tus takimini kullanarak dosya açma, dosya kaydetme, kesme, kopyalama gibi islemleri gerçeklestirebiliyorsunuz.  Options ve Animation sekmelerinin, resmin tümünü, Image sekmesinin sadece seçili olan kareyi etkiledigini belirttikten sonra dilerseniz her bir sekmenin ve alt seçeneklerinin ne ise yaradigini açiklayalim:

 Options Sekmesi 

Thumbnails Reflect Image Position: Karelerin öngösterim penceresinde nasil görünecegini belirler. Bu seçenegi isaretlediginizde kareler animasyonda görülecegi sekilde öngösterim penceresinde tekrar boyutlandirilir.  Main Dialog Window Always On Top: GIF Animator'in tüm pencerelerin üzerinde görülmesini saglar.  Import Color Palette: GIF paletinin cinsini belirler. Optimal palette seçildiginde tüm karelerin paletleri birlestirilir ve 256 renge indirgenir. Browser Palette ise tüm karelerin paletlerini web tarayicisinin 216 renklik paletine çevirir. 

Import Dither Method:

Solid: Karenin renklerine en yakin renkleri seçer.

Pattern: Çok fazla renge sahip animasyonlar için en optimal renkleri seçer 

Random: Pattern'den daha iyi bir seçenektir fakat daha yavastir. 

Error Diffusion: Karelerde hata düzeltmesi yapar, parlama gibi yanlisliklari törpüler.

 

Animation Sekmesi 

Animation Width, Animation Height, Image Count: Animasyonlu GIF dosyasinin uzunluk ve genisligini, kaç adet kareden olustugunu gösterir. 

Looping: Animasyonun kaç defa tekrarlanacagini belirler. Repeat Forever seçenegi isaretlendiginde metin kutusundaki deger gözardi edilir ve animasyon sonsuza kadar devam eder. 

Trailing Comment: Animasyon hakkinda genel bir açiklama yapmaniza olanak tanir.

 

Image sekmesi  Bu bölümde karenin yükseklik ve genisligini veren Image Width ve Image Height seçenekleri her zaman sabit kalir. 

Left: GIF parçasinin ana GIF dosyasinin solundan ne kadar uzaga yerlestirilecegini, 

Top: parçacigin üstten ne kadar uzaga yerlestirilecegini gösterir. Bu iki deger küçük parçacigin ana parçacik üzerindeki koordinatini vermesi açisindan önemlidir.  Bu sekmedeki "Duration" seçenegi karenin kaç milisaniye (Saniyenin yüzde biri) ekrana duracagini belirler.  Undraw Method seçenegi küçük parçacigin isi bittikten sonra ne olacagini belirler.  "Leave" alt seçenegi parçacigin isi bittikten sonra ekranda kalmasini, "Restore Previus" parçacigin kullanilmadan önceki halinin geri getirilmesini, "Restore Background" ise parçacigin kullanildigi alanin bosaltilmasini saglar. Image sekmesindeki "Transparancy" seçenegi karenin hangi renginin transparan renk olacagini belirler. Kullanilmasi pek kolay olmayan bu seçenek iyi göz karari istiyor çünkü transparan rengi önizleme karesinden degil de renk paleti içerisinden seçmenizi istiyor. Son olarak her kare için ayri bir açiklama getirebileceginizi belirtelim. Açiklamalari yazmak için "Comment" kutusunu kullanabilirsiniz. 

 Animasyonu olusturalim…  GIF Animator ile animasyon olusturmak çok kolaydir. Animasyonunuzun parçalarini bir grafik editörüyle olusturduktan sonra ister teker teker kaydederek GIF Animator'a sürükler isterseniz grafik editörünüzden panoya yapistirarak Animator penceresinde Shift+Insert tuslarina basarsiniz.  GIF Animator en iyi sonucu önceden kaydedilmis resimlerin sürüklenip birakilmasiyla elde ediyor.  Istediginiz kareleri Animator penceresinde olusturup ok tuslariyla siralarini belirledikten sonra sira animasyonun kaç kere tekrarlanacagina geliyor. Bu islemi de bitirdiginizde artik Image sekmesine geçerek her bir karenin pozisyonunu ayarlayabilir ve isi bittikten sonra ne olacagini belirleyebilirsiniz.  GIF Animatoru, daha dogrusu tüm animasyon programlarini kullanirken dikkat etmeniz gereken bir iki nokta var. Bunlardan birincisi resmin sadece degisen parçalarini almaniz ve bunu animator penceresine yapistirmaniz, digeri ise animasyonlarinizda fazla renk kullanmamaniz. Eger animasyonlarinizda tekrarlanmayan parçalari tekrar tekrar kullanirsaniz dosyanin büyümesi, dolayisiyle yüklenmesinin zorlasmasini saglamis olursunuz.

JPEG MI GIF MI?

Web sayfalarinda resim kullanirken en çok sorulan sorulardan biri sudur:

  ' Madem JPEG dosyalari ayni ölçülerdeki GIF'lerden daha az yer tutuyor neden GIF dosyalarini kullanayim?'  Bu sorunun cevabi çok basit, GIF dosyalari sayfa üzerinde JPEG dosyalarindan daha keskin ve canli görünürler, bunun sebebi JPEG formatinin ' kayipli' bir grafik formati olmasidir. JPEG dosyalarinin kullanilmasi ayrica, sade beyaz alanlarda yüksek renk çözünürlügünde görülmeyen fakat 256 renkte göze batan küçük noktaciklarin olusmasina neden olur. JPEG formati, daha çok büyük ve az bir beyaz alana sahip grafik dosyalari üzerine uygulanmalidir.  Bu konu hakkinda daha çok bilgi için Soner Demircilerin hazirladigi "Web Sayfalarında Grafik Kullanımı" <11.htm> adli yaziyi okuyabilirsiniz.

Transparan GIF'ler

 Internet üzerinde gezinirken, resimlerin arka plan ve arka renkler ile uyum içinde oldugunu, resmin kare olmasina ragmen arka planin resmin bosluklarindan görünebildigine sahit olursunuz. Eger web sayfanizda bir resim kullaniyor ve resmin bos taraflarindan arkaplanin görünmemesinden ve resmin sayfa üzerinde yama gibi görünmesinden yakiniyorsaniz bu bölümü dikkatle okuyun.  Bu bölümde resmi transparan hale getirirken en çok kullanilan shareware grafik editörlerinden biri olan Paint Shop Pro'nun 3.12 sürümünü kullanacagiz. PSP 4.0 sahipleri de yaptiklarimizi aynen kendi programlarinda uygulayabilirler. Öncelikle Paint Shop'u açin ve transparan yapmak istediginiz GIF dosyasini yükleyin, unutmayin transparan dosyalar sadece GIF formatinda ve 256 renkte olabilirler.  "Select" araç kutusundan asagidaki resimde de seçili olan "Color Picker"i seçin ve resim üzerinde transparan yapmak istediginiz, yani yaprak ve dünyanin disinda kalan alanin üzerine götürün. Fareyi bu bölgeden ayirmadan durum çubugunun sag bölmesinde I: degerinin yanindaki degeri aklinizin bir kenarina kaydedin.  "File" menüsünden "Save As..." komutunu çalistirin ve format olarak GIF89a - Interlaced'i seçin. Diyalog kutusunun sag tarafinda bulunan Options butonuna bastiginizda GIF Transparency Options Diyalog kutusu karsiniza gelecektir. Bu kutucukta "Set Transparency Value to:" seçenegini isaretleyip karsisindaki metin kutusuna "I:"nin karsisinda okudugunuz degeri (yani yalniz bu resim için 215'i) yazarsaniz GIF dosyasinin  renk seçici ile seçtiginiz rengi transparan olacak böylece arkaplanlar bu bölgeden görülebilecektir. Resimler her zaman basarili olarak transparan yapilamazlar, bunun sebebi bazen resmin istemediginiz alanlarinda transparan yaptiginiz renge ait parçaciklarin kalmasidir. Bunu önlemek için resmi yüksek renge getirdikten sonra resim ile alakasi olmayan bir renk seçip transparan yapmak istediginiz alani bu renk ile boyamali ve resmi tekrar 256 renge getirerek bu rengin indeksini okuyup transparan hale getirmelisiniz. Bir transparan GIF'in hikayesi kisaca böyle, "Benim isim gücüm var, bu kadar isle ugrasamam" diyorsaniz, Internet üzerinde yüzlerce GIF dönüstürme seti bulabilirsiniz, hizli olmalarina ragmen insan elinin yerini tutmaz ama olsun.